@sendbird/uikit-react 3.15.13 → 3.15.14

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

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

package/cjs/chunks/bundle-CMpha6Ac.js

@@ -0,0 +1,152 @@
+'use strict';
+
+var index = require('./bundle-Dn0hi6OJ.js');
+
+var EmojiManager = /** @class */ (function () {
+    function EmojiManager(props) {
+        var _this = this;
+        var _a;
+        var sdk = props.sdk, logger = props.logger;
+        (_a = sdk === null || sdk === void 0 ? void 0 : sdk.getAllEmoji) === null || _a === void 0 ? void 0 : _a.call(sdk).then(function (emojiContainer) {
+            _this._emojiContainer = emojiContainer;
+            logger === null || logger === void 0 ? void 0 : logger.info('EmojiManager | Succeeded getting all emojis. ', emojiContainer);
+        }).catch(function () {
+            logger === null || logger === void 0 ? void 0 : logger.warning('EmojiManager | Failed getting all emojis.');
+        });
+    }
+    Object.defineProperty(EmojiManager.prototype, "AllEmojisAsArray", {
+        get: function () {
+            return this._emojiContainer.emojiCategories.flatMap(function (category) { return category.emojis; });
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(EmojiManager.prototype, "AllEmojisAsMap", {
+        get: function () {
+            return this._emojiContainer.emojiCategories
+                .flatMap(function (category) { return category.emojis; })
+                .reduce(function (map, emoji) {
+                map.set(emoji.key, emoji.url);
+                return map;
+            }, new Map());
+        },
+        enumerable: false,
+        configurable: true
+    });
+    EmojiManager.prototype.getAllEmojis = function (type) {
+        var _this = this;
+        return index.K(type)
+            .when(function (type) { return ['array', 'arr'].includes(type); }, function () { return _this.AllEmojisAsArray; })
+            .when(function (type) { return ['map'].includes(type); }, function () { return _this.AllEmojisAsMap; })
+            .otherwise(function () { return _this.AllEmojisAsArray; });
+    };
+    EmojiManager.prototype.getEmojiUrl = function (reactionKey) {
+        var _a, _b;
+        return (_b = (_a = this.AllEmojisAsArray.find(function (emoji) { return emoji.key === reactionKey; })) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : '';
+    };
+    Object.defineProperty(EmojiManager.prototype, "emojiContainer", {
+        get: function () {
+            return this._emojiContainer;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return EmojiManager;
+}());
+
+/**
+ * Mapping object to convert numeric keys to descriptive text
+ * [(legacy) numeric key]: [(new) descriptive text]
+ */
+var colorMapping = {
+    // Primary / Secondary / Error / Information
+    100: 'extra-light',
+    200: 'light',
+    300: 'main',
+    400: 'dark',
+    500: 'extra-dark',
+    // Overlay
+    'overlay-01': 'overlay-dark',
+    'overlay-02': 'overlay-light',
+    // OnLight
+    'onlight-01': 'onlight-text-high-emphasis',
+    'onlight-02': 'onlight-text-mid-emphasis',
+    'onlight-03': 'onlight-text-low-emphasis',
+    'onlight-04': 'onlight-text-disabled',
+    // OnDark
+    'ondark-01': 'ondark-text-high-emphasis',
+    'ondark-02': 'ondark-text-mid-emphasis',
+    'ondark-03': 'ondark-text-low-emphasis',
+    'ondark-04': 'ondark-text-disabled',
+};
+/**
+ * Order of mappings to ensure longer keys are matched first
+ * e.g. In --sendbird-dark-background-extra-dark, 'extra-dark' should be matched instead of 'dark'
+ */
+var colorMappingOrder = Object
+    .values(colorMapping)
+    .sort(function (a, b) { return b.length - a.length; });
+/**
+ * Convert colorMapping to a Map for quick lookup in mapColorKeys
+ */
+var colorMappingMap = new Map(Object.entries(colorMapping).map(function (_a) {
+    var key = _a[0], value = _a[1];
+    return [value, key];
+}));
+/**
+ * Converts descriptive color keys to their numeric equivalents.
+ *
+ * This function takes a set of CSS variable keys and transforms
+ * descriptive color keys (e.g. 'extra-light', 'main') into their
+ * numeric equivalents(e.g. 100, 200, ..., 500) as defined in the colorMapping object.
+ *
+ * e.g.
+ * Input:
+ * {
+ *   '--sendbird-light-primary-extra-dark': '#00487c',
+ *   '--sendbird-light-primary-dark': '#4bb3fd',
+ *   '--sendbird-light-primary-main': '#3e6680',
+ *   '--sendbird-light-primary-light': '#0496ff',
+ *   '--sendbird-light-primary-extra-light': '#027bce',
+ * }
+ *
+ * Output:
+ * {
+ *   '--sendbird-light-primary-500': '#00487c',
+ *   '--sendbird-light-primary-400': '#4bb3fd',
+ *   '--sendbird-light-primary-300': '#3e6680',
+ *   '--sendbird-light-primary-200': '#0496ff',
+ *   '--sendbird-light-primary-100': '#027bce',
+ * }
+ *
+ * @param {ColorSet} colorSet - The input object containing CSS variables with descriptive keys.
+ * @returns {ColorSet} The transformed object with numeric keys.
+ */
+var mapColorKeys = function (colorSet) {
+    var mappedColors = {};
+    Object.entries(colorSet).forEach(function (_a) {
+        var key = _a[0], value = _a[1];
+        var descriptiveKey = key;
+        for (var _i = 0, colorMappingOrder_1 = colorMappingOrder; _i < colorMappingOrder_1.length; _i++) {
+            var mappingValue = colorMappingOrder_1[_i];
+            // Prepare a regex to match the mapping value at the end of the key
+            // e.g., '-extra-dark$'
+            var regex = new RegExp("-".concat(mappingValue, "$"));
+            if (regex.test(key)) {
+                // Find the corresponding numeric key for the mapping value using Map
+                var numericKey = colorMappingMap.get(mappingValue);
+                if (numericKey) {
+                    // Replace the descriptive text with the numeric key
+                    descriptiveKey = key.replace(regex, "-".concat(numericKey));
+                    break;
+                }
+            }
+        }
+        mappedColors[descriptiveKey] = value;
+    });
+    return mappedColors;
+};
+
+exports.EmojiManager = EmojiManager;
+exports.mapColorKeys = mapColorKeys;
+//# sourceMappingURL=bundle-CMpha6Ac.js.map

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

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

package/cjs/chunks/{bundle-B2zio8XF.js → bundle-CPeZ4wPf.js}

@@ -48,4 +48,4 @@ function useElementObserver(selector, targetElement) {
 }
 
 exports.useElementObserver = useElementObserver;
-//# sourceMappingURL=bundle-B2zio8XF.js.map
+//# sourceMappingURL=bundle-CPeZ4wPf.js.map

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

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

package/cjs/chunks/{bundle-BbpZ1Xe-.js → bundle-CXHWkhsI.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var _tslib = require('./bundle-D1slQ3hS.js');
+var _tslib = require('./bundle-CxoFSSXv.js');
 
 var USER_MENTION_PREFIX = '@';
 
@@ -244,4 +244,4 @@ exports.getChannelPreviewMessage = getChannelPreviewMessage;
 exports.getWhiteSpacePreservedText = getWhiteSpacePreservedText;
 exports.tokenizeMarkdown = tokenizeMarkdown;
 exports.tokenizeMessage = tokenizeMessage;
-//# sourceMappingURL=bundle-BbpZ1Xe-.js.map
+//# sourceMappingURL=bundle-CXHWkhsI.js.map

package/cjs/chunks/{bundle-BbpZ1Xe-.js.map → bundle-CXHWkhsI.js.map}

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

package/cjs/chunks/{bundle-DYjhaLRW.js → bundle-CaNXlSAv.js}

@@ -2,12 +2,13 @@
 
 var React = require('react');
 var reactDom = require('react-dom');
-var ui_Avatar = require('./bundle-DHPSwRDh.js');
+var ui_Avatar = require('./bundle-CLL-nCFU.js');
 var ui_Icon = require('../ui/Icon.js');
-var ui_Label = require('./bundle-BA6Cum_9.js');
-var index = require('./bundle-DTD48j2K.js');
-var ui_Modal = require('./bundle-Ol1CxgYk.js');
-var useSendbirdStateContext = require('../useSendbirdStateContext.js');
+var ui_Label = require('./bundle-B0UICprZ.js');
+var index = require('./bundle-D7YiKR6i.js');
+require('../hooks/useModal.js');
+var ui_Modal = require('./bundle-YeW89zsR.js');
+var useSendbird = require('./bundle-LI9JjqG2.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -17,7 +18,8 @@ var FileViewerView = function (_a) {
     var message = _a.message, onCancel = _a.onCancel, deleteMessage = _a.deleteMessage, onDownloadClick = _a.onDownloadClick;
     var sender = message.sender, type = message.type, url = message.url, _b = message.name, name = _b === void 0 ? '' : _b, threadInfo = message.threadInfo;
     var profileUrl = sender.profileUrl, nickname = sender.nickname, userId = sender.userId;
-    var config = useSendbirdStateContext.useSendbirdStateContext().config;
+    var state = useSendbird.useSendbird().state;
+    var config = state.config;
     return reactDom.createPortal(React__default.default.createElement(FileViewerComponent, { profileUrl: profileUrl, nickname: nickname, type: type, url: url, name: name, onCancel: onCancel, onDelete: function () { return deleteMessage(message).then(function () { return onCancel(); }); }, isByMe: config.userId === userId, disableDelete: (threadInfo === null || threadInfo === void 0 ? void 0 : threadInfo.replyCount) ? threadInfo.replyCount > 0 : false, onDownloadClick: onDownloadClick }), document.getElementById(ui_Modal.MODAL_ROOT));
 };
 var FileViewerComponent = function (_a) {
@@ -58,4 +60,4 @@ var FileViewerComponent = function (_a) {
 };
 
 exports.FileViewerView = FileViewerView;
-//# sourceMappingURL=bundle-DYjhaLRW.js.map
+//# sourceMappingURL=bundle-CaNXlSAv.js.map

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

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

package/cjs/chunks/bundle-CcVLRLk8.js

@@ -0,0 +1,217 @@
+'use strict';
+
+var _tslib = require('./bundle-CxoFSSXv.js');
+var SendbirdContext = require('./bundle-AAO7jUU2.js');
+var React = require('react');
+var groupChannel = require('@sendbird/chat/groupChannel');
+var uuid = require('./bundle-BUGwK1WK.js');
+var compareIds = require('./bundle-CvQwksvR.js');
+var utils = require('./bundle-DQNu-S6D.js');
+var UserProfileContext = require('./bundle-DeyX1dvY.js');
+var useSendbird = require('./bundle-LI9JjqG2.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+function useSetChannel(_a) {
+    var _this = this;
+    var channelUrl = _a.channelUrl, sdk = _a.sdk, logger = _a.logger, initialized = _a.initialized, _b = _a.dependencies, dependencies = _b === void 0 ? [] : _b;
+    var _c = useChannelSettings().actions, setChannel = _c.setChannel, setInvalid = _c.setInvalid, setLoading = _c.setLoading;
+    React.useEffect(function () {
+        var controller = new AbortController();
+        var signal = controller.signal;
+        var fetchChannel = function () { return _tslib.__awaiter(_this, void 0, void 0, function () {
+            var groupChannel, error_1;
+            return _tslib.__generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, 3, 4]);
+                        if (!channelUrl) {
+                            logger.warning('ChannelSettings: channel url is required');
+                            setLoading(false);
+                            return [2 /*return*/];
+                        }
+                        if (!initialized || !sdk) {
+                            logger.warning('ChannelSettings: SDK is not initialized');
+                            setLoading(false);
+                            return [2 /*return*/];
+                        }
+                        if (!sdk.groupChannel) {
+                            logger.warning('ChannelSettings: GroupChannelModule is not specified in the SDK');
+                            setLoading(false);
+                            return [2 /*return*/];
+                        }
+                        setLoading(true);
+                        return [4 /*yield*/, sdk.groupChannel.getChannel(channelUrl)];
+                    case 1:
+                        groupChannel = _a.sent();
+                        if (!signal.aborted) {
+                            logger.info('ChannelSettings | useSetChannel: fetched group channel', groupChannel);
+                            setChannel(groupChannel);
+                        }
+                        return [3 /*break*/, 4];
+                    case 2:
+                        error_1 = _a.sent();
+                        if (!signal.aborted) {
+                            logger.error('ChannelSettings | useSetChannel: failed fetching channel', error_1);
+                            setInvalid(true);
+                        }
+                        return [3 /*break*/, 4];
+                    case 3:
+                        if (!signal.aborted) {
+                            setLoading(false);
+                        }
+                        return [7 /*endfinally*/];
+                    case 4: return [2 /*return*/];
+                }
+            });
+        }); };
+        fetchChannel();
+        return function () { return controller.abort(); }; // Cleanup with AbortController
+    }, _tslib.__spreadArray([channelUrl, initialized, sdk], dependencies, true));
+}
+
+var useChannelHandler = function (_a) {
+    var sdk = _a.sdk, channelUrl = _a.channelUrl, logger = _a.logger, forceUpdateUI = _a.forceUpdateUI, _b = _a.dependencies, dependencies = _b === void 0 ? [] : _b;
+    React.useEffect(function () {
+        if (!sdk || !sdk.groupChannel) {
+            logger.warning('ChannelSettings: SDK or GroupChannelModule is not available');
+            return;
+        }
+        var newChannelHandlerId = uuid.uuidv4();
+        var channelHandler = new groupChannel.GroupChannelHandler({
+            onUserLeft: function (channel, user) {
+                if (compareIds.compareIds(channel === null || channel === void 0 ? void 0 : channel.url, channelUrl)) {
+                    logger.info('ChannelSettings: onUserLeft', { channel: channel, user: user });
+                    forceUpdateUI();
+                }
+            },
+            onUserBanned: function (channel, user) {
+                if (compareIds.compareIds(channel === null || channel === void 0 ? void 0 : channel.url, channelUrl) && channel.isGroupChannel()) {
+                    logger.info('ChannelSettings: onUserBanned', { channel: channel, user: user });
+                    forceUpdateUI();
+                }
+            },
+        });
+        sdk.groupChannel.addGroupChannelHandler(newChannelHandlerId, channelHandler);
+        return function () {
+            if (sdk.groupChannel && newChannelHandlerId) {
+                logger.info('ChannelSettings: Removing message receiver handler', newChannelHandlerId);
+                sdk.groupChannel.removeGroupChannelHandler(newChannelHandlerId);
+            }
+        };
+    }, _tslib.__spreadArray([sdk, channelUrl, logger], dependencies, true));
+    return null;
+};
+
+var ChannelSettingsContext = React.createContext(null);
+var initialState = {
+    // Props
+    channelUrl: '',
+    onCloseClick: undefined,
+    onLeaveChannel: undefined,
+    onChannelModified: undefined,
+    onBeforeUpdateChannel: undefined,
+    renderUserListItem: undefined,
+    queries: {},
+    overrideInviteUser: undefined,
+    // Managed states
+    channel: null,
+    loading: false,
+    invalidChannel: false,
+    forceUpdateUI: function () { },
+    setChannelUpdateId: function () { },
+};
+/**
+ * @returns {ReturnType<typeof createStore<ChannelSettingsState>>}
+ */
+var useChannelSettingsStore = function () {
+    return SendbirdContext.useStore(ChannelSettingsContext, function (state) { return state; }, initialState);
+};
+var ChannelSettingsManager = function (_a) {
+    var _b;
+    var channelUrl = _a.channelUrl, onCloseClick = _a.onCloseClick, onLeaveChannel = _a.onLeaveChannel, onChannelModified = _a.onChannelModified, overrideInviteUser = _a.overrideInviteUser, onBeforeUpdateChannel = _a.onBeforeUpdateChannel, queries = _a.queries, renderUserListItem = _a.renderUserListItem;
+    var state = useSendbird.useSendbird().state;
+    var config = state.config, stores = state.stores;
+    var updateState = useChannelSettingsStore().updateState;
+    var logger = config.logger;
+    var _c = (_b = stores === null || stores === void 0 ? void 0 : stores.sdkStore) !== null && _b !== void 0 ? _b : {}, sdk = _c.sdk, initialized = _c.initialized;
+    var _d = React.useState(function () { return uuid.uuidv4(); }), channelUpdateId = _d[0], setChannelUpdateId = _d[1];
+    var forceUpdateUI = React.useCallback(function () { return setChannelUpdateId(uuid.uuidv4()); }, []);
+    var dependencies = [channelUpdateId];
+    useSetChannel({
+        channelUrl: channelUrl,
+        sdk: sdk,
+        logger: logger,
+        initialized: initialized,
+        dependencies: dependencies,
+    });
+    useChannelHandler({
+        sdk: sdk,
+        channelUrl: channelUrl,
+        logger: logger,
+        forceUpdateUI: forceUpdateUI,
+        dependencies: dependencies,
+    });
+    React.useEffect(function () {
+        updateState({
+            channelUrl: channelUrl,
+            onCloseClick: onCloseClick,
+            onLeaveChannel: onLeaveChannel,
+            onChannelModified: onChannelModified,
+            onBeforeUpdateChannel: onBeforeUpdateChannel,
+            renderUserListItem: renderUserListItem,
+            queries: queries,
+            overrideInviteUser: overrideInviteUser,
+            forceUpdateUI: forceUpdateUI,
+            setChannelUpdateId: setChannelUpdateId,
+        });
+    }, [
+        channelUrl,
+        onCloseClick,
+        onLeaveChannel,
+        onChannelModified,
+        onBeforeUpdateChannel,
+        renderUserListItem,
+        queries,
+        overrideInviteUser,
+        forceUpdateUI,
+    ]);
+    return null;
+};
+var createChannelSettingsStore = function () { return SendbirdContext.createStore(initialState); };
+var InternalChannelSettingsProvider = function (_a) {
+    var children = _a.children;
+    var storeRef = React.useRef(createChannelSettingsStore());
+    return (React__default.default.createElement(ChannelSettingsContext.Provider, { value: storeRef.current }, children));
+};
+var ChannelSettingsProvider = function (props) {
+    var children = props.children, className = props.className;
+    return (React__default.default.createElement(InternalChannelSettingsProvider, null,
+        React__default.default.createElement(ChannelSettingsManager, _tslib.__assign({}, props)),
+        React__default.default.createElement(UserProfileContext.UserProfileProvider, _tslib.__assign({}, props),
+            React__default.default.createElement("div", { className: utils.classnames('sendbird-channel-settings', className) }, children))));
+};
+var useChannelSettingsContext = function () {
+    var _a = useChannelSettings(), state = _a.state, actions = _a.actions;
+    return _tslib.__assign(_tslib.__assign({}, state), actions);
+};
+
+var useChannelSettings = function () {
+    var store = React.useContext(ChannelSettingsContext);
+    if (!store)
+        throw new Error('useChannelSettings must be used within a ChannelSettingsProvider');
+    var state = SendbirdContext.shimExports.useSyncExternalStore(store.subscribe, store.getState);
+    var actions = React.useMemo(function () { return ({
+        setChannel: function (channel) { return store.setState(function (state) { return (_tslib.__assign(_tslib.__assign({}, state), { channel: channel })); }); },
+        setLoading: function (loading) { return store.setState(function (state) { return (_tslib.__assign(_tslib.__assign({}, state), { loading: loading })); }); },
+        setInvalid: function (invalid) { return store.setState(function (state) { return (_tslib.__assign(_tslib.__assign({}, state), { invalidChannel: invalid })); }); },
+    }); }, [store]);
+    return { state: state, actions: actions };
+};
+
+exports.ChannelSettingsProvider = ChannelSettingsProvider;
+exports.useChannelSettings = useChannelSettings;
+exports.useChannelSettingsContext = useChannelSettingsContext;
+//# sourceMappingURL=bundle-CcVLRLk8.js.map

package/{chunks/bundle-5-21Jk06.js.map → cjs/chunks/bundle-CcVLRLk8.js.map}

@@ -1 +1 @@
-{"version":3,"file":"bundle-5-21Jk06.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"bundle-CcVLRLk8.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/cjs/chunks/{bundle-vf5ayidG.js → bundle-CdtZVJ6y.js}

@@ -1,17 +1,17 @@
 'use strict';
 
-var _tslib = require('./bundle-D1slQ3hS.js');
+var _tslib = require('./bundle-CxoFSSXv.js');
 var React = require('react');
-var LocalizationContext = require('./bundle-DE5YH8Q-.js');
-var ChannelSettings_context = require('../ChannelSettings/context.js');
+var useChannelSettings = require('./bundle-CcVLRLk8.js');
+var LocalizationContext = require('./bundle-DDNdw3A9.js');
+var UserListItemMenu = require('./bundle-BWtBhW43.js');
 var ui_Button = require('../ui/Button.js');
-var UserListItemMenu = require('./bundle-D4NkDFD-.js');
 var ui_UserListItem = require('../ui/UserListItem.js');
-var ui_Modal = require('./bundle-Ol1CxgYk.js');
-var index = require('./bundle-A5UoPEJO.js');
-var ui_Label = require('./bundle-BA6Cum_9.js');
+var ui_Modal = require('./bundle-YeW89zsR.js');
+var index = require('./bundle-DwVBqZFY.js');
+var ui_Label = require('./bundle-B0UICprZ.js');
 var groupChannel = require('@sendbird/chat/groupChannel');
-var utils = require('./bundle-Cq5LKFhE.js');
+var utils = require('./bundle-DQNu-S6D.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -22,7 +22,7 @@ function OperatorsModal(_a) {
     var onCancel = _a.onCancel, _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React__default.default.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b, _c = _a.operatorListQueryParams, operatorListQueryParams = _c === void 0 ? {} : _c;
     var _d = React.useState([]), operators = _d[0], setOperators = _d[1];
     var _e = React.useState(null), operatorQuery = _e[0], setOperatorQuery = _e[1];
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
     React.useEffect(function () {
         var operatorListQuery = channel === null || channel === void 0 ? void 0 : channel.createOperatorListQuery(_tslib.__assign({ limit: 20 }, operatorListQueryParams));
@@ -67,7 +67,7 @@ function AddOperatorsModal(_a) {
     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;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     React.useEffect(function () {
         var memberListQuery = channel === null || channel === void 0 ? void 0 : channel.createMemberListQuery({
             operatorFilter: groupChannel.OperatorFilter.NONOPERATOR,
@@ -122,8 +122,8 @@ var OperatorList = function (_a) {
     var _e = React.useState(false), showMore = _e[0], setShowMore = _e[1];
     var _f = React.useState(false), showAdd = _f[0], setShowAdd = _f[1];
     var _g = React.useState(false), hasNext = _g[0], setHasNext = _g[1];
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
+    var stringSet = LocalizationContext.useLocalization().stringSet;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     var refreshList = React.useCallback(function () {
         if (!channel) {
             setOperators([]);
@@ -186,7 +186,7 @@ function BannedUsersModal(_a) {
     var onCancel = _a.onCancel, _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React__default.default.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b, _c = _a.bannedUserListQueryParams, bannedUserListQueryParams = _c === void 0 ? {} : _c;
     var _d = React.useState([]), members = _d[0], setMembers = _d[1];
     var _e = React.useState(null), memberQuery = _e[0], setMemberQuery = _e[1];
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     React.useEffect(function () {
         var bannedUserListQuery = channel === null || channel === void 0 ? void 0 : channel.createBannedUserListQuery(_tslib.__assign({ limit: 20 }, bannedUserListQueryParams));
@@ -234,7 +234,7 @@ var BannedUserList = function (_a) {
     var _e = React.useState(false), hasNext = _e[0], setHasNext = _e[1];
     var _f = React.useState(false), showModal = _f[0], setShowModal = _f[1];
     var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     var refreshList = React.useCallback(function () {
         if (!channel) {
             setMembers([]);
@@ -274,7 +274,7 @@ function MutedMembersModal(_a) {
     var onCancel = _a.onCancel, _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React__default.default.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b, _c = _a.memberListQueryParams, memberListQueryParams = _c === void 0 ? {} : _c;
     var _d = React.useState([]), members = _d[0], setMembers = _d[1];
     var _e = React.useState(null), memberQuery = _e[0], setMemberQuery = _e[1];
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     React.useEffect(function () {
         var memberUserListQuery = channel === null || channel === void 0 ? void 0 : channel.createMemberListQuery(_tslib.__assign(_tslib.__assign({ limit: 20 }, memberListQueryParams), { 
@@ -320,7 +320,7 @@ var MutedMemberList = function (_a) {
     var _e = React.useState(false), hasNext = _e[0], setHasNext = _e[1];
     var _f = React.useState(false), showModal = _f[0], setShowModal = _f[1];
     var stringSet = LocalizationContext.useLocalization().stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
+    var channel = useChannelSettings.useChannelSettings().state.channel;
     var refreshList = React.useCallback(function () {
         if (!channel) {
             setMembers([]);
@@ -365,4 +365,4 @@ var MutedMemberList = function (_a) {
 exports.BannedUserList = BannedUserList;
 exports.MutedMemberList = MutedMemberList;
 exports.OperatorList = OperatorList;
-//# sourceMappingURL=bundle-vf5ayidG.js.map
+//# sourceMappingURL=bundle-CdtZVJ6y.js.map

package/cjs/chunks/{bundle-vf5ayidG.js.map → bundle-CdtZVJ6y.js.map}

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

package/cjs/chunks/{bundle-Aw-PHA-I.js → bundle-CgCnWqE5.js}

@@ -3,4 +3,4 @@
 var TEXT_MESSAGE_BODY_CLASSNAME = 'sendbird-text-message-item-body';
 
 exports.TEXT_MESSAGE_BODY_CLASSNAME = TEXT_MESSAGE_BODY_CLASSNAME;
-//# sourceMappingURL=bundle-Aw-PHA-I.js.map
+//# sourceMappingURL=bundle-CgCnWqE5.js.map

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

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

package/cjs/chunks/bundle-ChpcAmBg.js

@@ -0,0 +1,40 @@
+'use strict';
+
+var React = require('react');
+var SendbirdContext = require('./bundle-AAO7jUU2.js');
+
+function useDeepCompareMemoize(value) {
+    var ref = React.useRef(value);
+    if (!SendbirdContext.isEqual(value, ref.current)) {
+        ref.current = value;
+    }
+    return ref.current;
+}
+/**
+ * Custom hook that works like useEffect but performs a deep comparison of dependencies
+ * instead of reference equality.
+ *
+ * Best used when:
+ * - Working with complex objects without guaranteed immutability
+ * - Handling data from external sources where reference equality isn't maintained
+ * - Dealing with deeply nested objects where individual memoization is impractical
+ *
+ * Avoid using when:
+ * - Detecting changes within array items is crucial
+ * - Performance is critical (deep comparison is expensive)
+ * - Working primarily with primitive values or simple objects
+ *
+ * @example
+ * useDeepCompareEffect(() => {
+ *   // Effect logic
+ * }, [complexObject, anotherObject]);
+ *
+ * @param callback Effect callback that can return a cleanup function
+ * @param dependencies Array of dependencies to be deeply compared
+ */
+function useDeepCompareEffect(callback, dependencies) {
+    React.useEffect(callback, dependencies.map(useDeepCompareMemoize));
+}
+
+exports.useDeepCompareEffect = useDeepCompareEffect;
+//# sourceMappingURL=bundle-ChpcAmBg.js.map

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

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