@sendbird/uikit-react 3.10.1 → 3.10.2-alpha.0

package/chunks/{bundle-ipC2A4Tb.js → bundle-otzUyFE_.js}

@@ -1,14 +1,15 @@
-import { _ as __assign, a as __spreadArray, b as __awaiter, c as __generator } from './bundle-GKopZh-T.js';
+import { _ as __assign, a as __spreadArray, b as __awaiter, c as __generator } from './bundle-BA7tv0JB.js';
 import React__default, { useEffect, useCallback, useReducer, useState, useMemo, useContext } from 'react';
-import { GroupChannelHandler } from '@sendbird/chat/groupChannel';
-import { p as pubSubTopics } from './bundle-ku6CEjGk.js';
-import { u as uuidv4 } from './bundle-aeQZ5WsP.js';
-import { n as noop } from './bundle-WpHDilD_.js';
-import { D as DELIVERY_RECEIPT$1 } from './bundle-ZKM9Qk_j.js';
-import { U as UserProfileProvider } from './bundle-cXqs96Pt.js';
+import { GroupChannelHandler, GroupChannelListOrder } from '@sendbird/chat/groupChannel';
+import { p as pubSubTopics } from './bundle-nlOgiAcu.js';
+import { u as uuidv4 } from './bundle-YoWLsJ0C.js';
+import { n as noop } from './bundle-cA_r9HRx.js';
+import { D as DELIVERY_RECEIPT$1 } from './bundle-MBrlu_LK.js';
+import { U as UserProfileProvider } from './bundle-vOT5acXc.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { K, S } from './bundle-kfNTRju0.js';
-import { T as filterChannelListParams, V as getChannelsWithUpsertedChannel } from './bundle-uk2Y0AQu.js';
+import { K, S } from './bundle-aKXnhi3A.js';
+import { R as filterChannelListParams, T as getChannelsWithUpsertedChannel } from './bundle-N9hMnIRl.js';
+import { u as useReconnectOnIdle } from './bundle-D1V3P366.js';
 
 var RESET_CHANNEL_LIST = 'RESET_CHANNEL_LIST';
 var CREATE_CHANNEL = 'CREATE_CHANNEL';
@@ -19,6 +20,7 @@ var FETCH_CHANNELS_SUCCESS = 'FETCH_CHANNELS_SUCCESS';
 var FETCH_CHANNELS_FAILURE = 'FETCH_CHANNELS_FAILURE';
 var INIT_CHANNELS_START = 'INIT_CHANNELS_START';
 var INIT_CHANNELS_SUCCESS = 'INIT_CHANNELS_SUCCESS';
+var REFRESH_CHANNELS_SUCCESS = 'REFRESH_CHANNELS_SUCCESS';
 var INIT_CHANNELS_FAILURE = 'INIT_CHANNELS_FAILURE';
 var ON_USER_JOINED = 'ON_USER_JOINED';
 var ON_CHANNEL_DELETED = 'ON_CHANNEL_DELETED';
@@ -138,7 +140,7 @@ var createChannelListQuery = function (_a) {
     var params = {
         includeEmpty: false,
         limit: 20,
-        order: 'latest_last_message', // 'chronological', 'latest_last_message', 'channel_name_alphabetical', and 'metadata_value_alphabetical'
+        order: GroupChannelListOrder.LATEST_LAST_MESSAGE,
     };
     if (userFilledChannelListQuery) {
         Object.keys(userFilledChannelListQuery).forEach(function (key) {
@@ -303,10 +305,16 @@ function channelListReducer(state, action) {
         var payload = _a.payload;
         return (__assign(__assign({}, state), { loading: true, currentUserId: payload.currentUserId }));
     })
-        .with({ type: RESET_CHANNEL_LIST }, function () { return initialState; })
+        .with({ type: RESET_CHANNEL_LIST }, function () {
+        return initialState;
+    })
         .with({ type: INIT_CHANNELS_SUCCESS }, function (action) {
         var _a = action.payload, channelList = _a.channelList, disableAutoSelect = _a.disableAutoSelect;
-        return __assign(__assign({}, state), { initialized: true, loading: false, allChannels: channelList, disableAutoSelect: disableAutoSelect, currentChannel: !disableAutoSelect && channelList && channelList.length && channelList.length > 0 ? channelList[0] : null });
+        return __assign(__assign({}, state), { initialized: true, loading: false, allChannels: channelList, disableAutoSelect: disableAutoSelect, currentChannel: !disableAutoSelect && channelList && channelList.length && channelList.length > 0 ? channelList[0] : state.currentChannel });
+    })
+        .with({ type: REFRESH_CHANNELS_SUCCESS }, function (action) {
+        var _a = action.payload, channelList = _a.channelList, currentChannel = _a.currentChannel;
+        return __assign(__assign({}, state), { loading: false, allChannels: channelList, currentChannel: currentChannel });
     })
         .with({ type: FETCH_CHANNELS_SUCCESS }, function (action) {
         var currentChannels = state.allChannels.map(function (c) { return c.url; });
@@ -371,22 +379,41 @@ function channelListReducer(state, action) {
         var _a;
         var _b = action.payload, channel = _b.channel, isMe = _b.isMe;
         var allChannels = state.allChannels, currentUserId = state.currentUserId, currentChannel = state.currentChannel, channelListQuery = state.channelListQuery, disableAutoSelect = state.disableAutoSelect;
-        var nextChannels = allChannels.filter(function (ch) { return ch.url !== channel.url; });
-        var nextChannel = null;
-        if (channelListQuery) {
-            if (filterChannelListParams(channelListQuery, channel, currentUserId)) {
-                // Good to [add to/keep in] the ChannelList
-                nextChannels = getChannelsWithUpsertedChannel(allChannels, channel, (_a = state.channelListQuery) === null || _a === void 0 ? void 0 : _a.order);
+        var nextChannels = __spreadArray([], allChannels, true);
+        var nextChannel = channel;
+        /**
+         * 1. If I left channel:
+         *   - Remove the channel from channel list
+         *   - Replace currentChannel with the next ordered channel
+         * 2. If other member left channel:
+         *   2-1. If query is given:
+         *     2-1-1. If channel no longer matches the query
+         *       - Same as step 1
+         *     2-1-2. If channel matches the query:
+         *       - Upsert channel list with the channel
+         *       - Replace currentChannel IFF url is same
+         *   2-2. If query is not given,
+         *     - Same as step 2-1-2
+         */
+        /* `1` and `2-1-1` */
+        if (isMe || (channelListQuery && !filterChannelListParams(channelListQuery, channel, currentUserId))) {
+            var channelAt = allChannels.findIndex(function (ch) { return ch.url === channel.url; });
+            if (channelAt > -1) {
+                nextChannels.splice(channelAt, 1);
+                nextChannel = getNextChannel({
+                    channel: channel,
+                    currentChannel: currentChannel,
+                    allChannels: allChannels,
+                    disableAutoSelect: disableAutoSelect,
+                });
             }
         }
-        // Replace the currentChannel if I left the currentChannel
-        if (isMe) {
-            nextChannel = getNextChannel({
-                channel: channel,
-                currentChannel: currentChannel,
-                allChannels: allChannels,
-                disableAutoSelect: disableAutoSelect,
-            });
+        else {
+            /* `2-1-2` and `2-2` */
+            nextChannels = getChannelsWithUpsertedChannel(allChannels, channel, (_a = state.channelListQuery) === null || _a === void 0 ? void 0 : _a.order);
+            if ((currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.url) === channel.url) {
+                nextChannel = channel;
+            }
         }
         return __assign(__assign({}, state), { currentChannel: nextChannel, allChannels: nextChannels });
     })
@@ -590,6 +617,86 @@ var useFetchChannelList = function (_a, _b) {
     ]);
 };
 
+function useHandleReconnectForChannelList(_a) {
+    var isOnline = _a.isOnline, reconnectOnIdle = _a.reconnectOnIdle, logger = _a.logger, sdk = _a.sdk, currentGroupChannel = _a.currentGroupChannel, channelListDispatcher = _a.channelListDispatcher, setChannelSource = _a.setChannelSource, userFilledChannelListQuery = _a.userFilledChannelListQuery, sortChannelList = _a.sortChannelList, disableAutoSelect = _a.disableAutoSelect, markAsDeliveredScheduler = _a.markAsDeliveredScheduler, disableMarkAsDelivered = _a.disableMarkAsDelivered;
+    var shouldReconnect = useReconnectOnIdle(isOnline, currentGroupChannel, reconnectOnIdle).shouldReconnect;
+    useEffect(function () {
+        return function () {
+            var _a, _b, _c, _d;
+            // state changed from offline to online AND tab is visible
+            if (shouldReconnect) {
+                logger.info('ChannelList refresh - creating query', { userFilledChannelListQuery: userFilledChannelListQuery });
+                var channelListQuery = createChannelListQuery({ sdk: sdk, userFilledChannelListQuery: userFilledChannelListQuery });
+                logger.info('ChannelList refresh - created query', channelListQuery);
+                setChannelSource(channelListQuery);
+                channelListDispatcher({
+                    type: INIT_CHANNELS_START,
+                    payload: {
+                        currentUserId: (_b = (_a = sdk === null || sdk === void 0 ? void 0 : sdk.currentUser) === null || _a === void 0 ? void 0 : _a.userId) !== null && _b !== void 0 ? _b : '',
+                    },
+                });
+                if (userFilledChannelListQuery) {
+                    logger.info('ChannelList refresh - setting up channelListQuery', channelListQuery);
+                    channelListDispatcher({
+                        type: CHANNEL_LIST_PARAMS_UPDATED,
+                        payload: {
+                            channelListQuery: channelListQuery,
+                            currentUserId: (_d = (_c = sdk === null || sdk === void 0 ? void 0 : sdk.currentUser) === null || _c === void 0 ? void 0 : _c.userId) !== null && _d !== void 0 ? _d : '',
+                        },
+                    });
+                }
+                logger.info('ChannelList refresh - fetching channels');
+                if (channelListQuery.hasNext) {
+                    channelListQuery
+                        .next()
+                        .then(function (channelList) {
+                        var _a, _b;
+                        logger.info('ChannelList refresh - fetched channels', channelList);
+                        var sortedChannelList = channelList;
+                        if (sortChannelList && typeof sortChannelList === 'function') {
+                            sortedChannelList = sortChannelList(channelList);
+                            logger.info('ChannelList refresh - channel list sorted', sortedChannelList);
+                        }
+                        // select first channel
+                        var newCurrentChannel = !disableAutoSelect ? sortedChannelList[0] : null;
+                        if (currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.url) {
+                            var foundChannel = sortedChannelList.find(function (channel) { return (channel.url === currentGroupChannel.url); });
+                            if (foundChannel) {
+                                newCurrentChannel = foundChannel;
+                            }
+                        }
+                        logger.info('ChannelList refresh - highlight channel', newCurrentChannel);
+                        channelListDispatcher({
+                            type: REFRESH_CHANNELS_SUCCESS,
+                            payload: {
+                                channelList: sortedChannelList,
+                                currentChannel: newCurrentChannel,
+                            },
+                        });
+                        var canSetMarkAsDelivered = (_b = (_a = sdk === null || sdk === void 0 ? void 0 : sdk.appInfo) === null || _a === void 0 ? void 0 : _a.premiumFeatureList) === null || _b === void 0 ? void 0 : _b.find(function (feature) { return feature === DELIVERY_RECEIPT$1; });
+                        if (canSetMarkAsDelivered && !disableMarkAsDelivered) {
+                            sortedChannelList.forEach(function (channel) {
+                                markAsDeliveredScheduler.push(channel);
+                            });
+                        }
+                    })
+                        .catch(function (err) {
+                        if (err) {
+                            logger.error('ChannelList refresh - could not fetch channels', err);
+                            channelListDispatcher({
+                                type: INIT_CHANNELS_FAILURE,
+                            });
+                        }
+                    });
+                }
+                else {
+                    logger.info('ChannelList refresh - there are no more channels');
+                }
+            }
+        };
+    }, [shouldReconnect]);
+}
+
 var ChannelListContext = React__default.createContext({
     disableUserProfile: true,
     allowProfileEdit: true,
@@ -609,11 +716,12 @@ var ChannelListContext = React__default.createContext({
     channelSource: null,
     typingChannels: [],
     fetchChannelList: noop,
+    reconnectOnIdle: true,
 });
 var ChannelListProvider = function (props) {
     var _a, _b;
     // destruct props
-    var children = props.children, className = props.className, disableUserProfile = props.disableUserProfile, allowProfileEdit = props.allowProfileEdit, queries = props.queries, onProfileEditSuccess = props.onProfileEditSuccess, onThemeChange = props.onThemeChange, onBeforeCreateChannel = props.onBeforeCreateChannel, sortChannelList = props.sortChannelList, overrideInviteUser = props.overrideInviteUser, activeChannelUrl = props.activeChannelUrl, _c = props.isTypingIndicatorEnabled, isTypingIndicatorEnabled = _c === void 0 ? null : _c, _d = props.isMessageReceiptStatusEnabled, isMessageReceiptStatusEnabled = _d === void 0 ? null : _d;
+    var children = props.children, className = props.className, disableUserProfile = props.disableUserProfile, allowProfileEdit = props.allowProfileEdit, queries = props.queries, onProfileEditSuccess = props.onProfileEditSuccess, onThemeChange = props.onThemeChange, onBeforeCreateChannel = props.onBeforeCreateChannel, sortChannelList = props.sortChannelList, overrideInviteUser = props.overrideInviteUser, activeChannelUrl = props.activeChannelUrl, _c = props.isTypingIndicatorEnabled, isTypingIndicatorEnabled = _c === void 0 ? null : _c, _d = props.isMessageReceiptStatusEnabled, isMessageReceiptStatusEnabled = _d === void 0 ? null : _d, reconnectOnIdle = props.reconnectOnIdle;
     // disable autoselect, if activeChannelUrl is provided
     // useActiveChannelUrl should be executed when activeChannelUrl is present
     var disableAutoSelect = (props === null || props === void 0 ? void 0 : props.disableAutoSelect) || !!activeChannelUrl;
@@ -623,7 +731,7 @@ var ChannelListProvider = function (props) {
     var config = globalStore.config, stores = globalStore.stores;
     var sdkStore = stores.sdkStore;
     var pubSub = config.pubSub, logger = config.logger, onUserProfileMessage = config.onUserProfileMessage;
-    var markAsDeliveredScheduler = config.markAsDeliveredScheduler, _e = config.disableMarkAsDelivered, disableMarkAsDelivered = _e === void 0 ? false : _e, _f = config.isTypingIndicatorEnabledOnChannelList, isTypingIndicatorEnabledOnChannelList = _f === void 0 ? false : _f, _g = config.isMessageReceiptStatusEnabledOnChannelList, isMessageReceiptStatusEnabledOnChannelList = _g === void 0 ? false : _g;
+    var markAsDeliveredScheduler = config.markAsDeliveredScheduler, _e = config.disableMarkAsDelivered, disableMarkAsDelivered = _e === void 0 ? false : _e, _f = config.isTypingIndicatorEnabledOnChannelList, isTypingIndicatorEnabledOnChannelList = _f === void 0 ? false : _f, _g = config.isMessageReceiptStatusEnabledOnChannelList, isMessageReceiptStatusEnabledOnChannelList = _g === void 0 ? false : _g, isOnline = config.isOnline;
     var sdk = sdkStore === null || sdkStore === void 0 ? void 0 : sdkStore.sdk;
     var _h = ((_a = sdk === null || sdk === void 0 ? void 0 : sdk.appInfo) !== null && _a !== void 0 ? _a : {}).premiumFeatureList, premiumFeatureList = _h === void 0 ? [] : _h;
     // derive some variables
@@ -801,6 +909,20 @@ var ChannelListProvider = function (props) {
         logger: logger,
         channelListDispatcher: channelListDispatcher,
     });
+    useHandleReconnectForChannelList({
+        isOnline: isOnline,
+        reconnectOnIdle: reconnectOnIdle,
+        logger: logger,
+        sdk: sdk,
+        currentGroupChannel: currentChannel,
+        channelListDispatcher: channelListDispatcher,
+        setChannelSource: setChannelSource,
+        userFilledChannelListQuery: userFilledChannelListQuery,
+        sortChannelList: sortChannelList,
+        disableAutoSelect: disableAutoSelect,
+        markAsDeliveredScheduler: markAsDeliveredScheduler,
+        disableMarkAsDelivered: disableMarkAsDelivered,
+    });
     var fetchChannelList = useFetchChannelList({
         channelSource: channelSource,
         disableMarkAsDelivered: disableMarkAsDelivered || !premiumFeatureList.some(function (feature) { return feature === DELIVERY_RECEIPT$1; }),
@@ -821,4 +943,4 @@ function useChannelListContext() {
 }
 
 export { ChannelListProvider as C, LEAVE_CHANNEL_SUCCESS as L, SET_CURRENT_CHANNEL as S, useChannelListContext as u };
-//# sourceMappingURL=bundle-ipC2A4Tb.js.map
+//# sourceMappingURL=bundle-otzUyFE_.js.map

package/{cjs/chunks/bundle-Jcrboe06.js.map → chunks/bundle-otzUyFE_.js.map}

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

package/chunks/{bundle-f9mkey82.js → bundle-poK2Vr1v.js}

@@ -1,7 +1,5 @@
 var PREV_RESULT_SIZE = 30;
 var NEXT_RESULT_SIZE = 15;
-var MAX_USER_MENTION_COUNT = 10;
-var MAX_USER_SUGGESTION_COUNT = 15;
 var USER_MENTION_TEMP_CHAR = '@';
 var ThreadReplySelectType;
 (function (ThreadReplySelectType) {
@@ -9,5 +7,5 @@ var ThreadReplySelectType;
     ThreadReplySelectType["THREAD"] = "THREAD";
 })(ThreadReplySelectType || (ThreadReplySelectType = {}));
 
-export { MAX_USER_MENTION_COUNT as M, NEXT_RESULT_SIZE as N, PREV_RESULT_SIZE as P, ThreadReplySelectType as T, USER_MENTION_TEMP_CHAR as U, MAX_USER_SUGGESTION_COUNT as a };
-//# sourceMappingURL=bundle-f9mkey82.js.map
+export { NEXT_RESULT_SIZE as N, PREV_RESULT_SIZE as P, ThreadReplySelectType as T, USER_MENTION_TEMP_CHAR as U };
+//# sourceMappingURL=bundle-poK2Vr1v.js.map

package/chunks/bundle-poK2Vr1v.js.map

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

package/chunks/bundle-qAc60kip.js

@@ -0,0 +1,48 @@
+import React__default, { useRef, useState, useContext } from 'react';
+import { u as useLocalization, L as LocalizationContext } from './bundle-BBjosDA0.js';
+import ContextMenu, { MenuItems, MenuItem } from '../ui/ContextMenu.js';
+import IconButton from '../ui/IconButton.js';
+import Icon, { IconTypes, IconColors } from '../ui/Icon.js';
+import { M as Modal } from './bundle-cvTUkQV_.js';
+import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
+
+var LeaveGroupChannel = function (_a) {
+    var channel = _a.channel, onSubmit = _a.onSubmit, onCancel = _a.onCancel;
+    var config = useSendbirdStateContext().config;
+    var logger = config.logger, isOnline = config.isOnline;
+    var stringSet = useLocalization().stringSet;
+    if (channel) {
+        return (React__default.createElement(Modal, { disabled: !isOnline, onCancel: onCancel, onSubmit: function () {
+                logger.info('LeaveGroupChannel: Leaving channel', channel);
+                channel.leave().then(function () {
+                    logger.info('LeaveGroupChannel: Leaving channel successful!', channel);
+                    onSubmit();
+                });
+            }, submitText: stringSet.MODAL__LEAVE_CHANNEL__FOOTER, titleText: stringSet.MODAL__LEAVE_CHANNEL__TITLE }));
+    }
+};
+
+function ChannelPreviewAction(_a) {
+    var channel = _a.channel, _b = _a.disabled, disabled = _b === void 0 ? false : _b, onLeaveChannel = _a.onLeaveChannel;
+    var parentRef = useRef(null);
+    var parentContainerRef = useRef(null);
+    var _c = useState(false), showModal = _c[0], setShowModal = _c[1];
+    var stringSet = useContext(LocalizationContext).stringSet;
+    return (React__default.createElement("div", { ref: parentContainerRef, tabIndex: 0, role: "button", style: { display: 'inline-block' }, onKeyDown: function (e) { return e.stopPropagation(); }, onClick: function (e) { return e.stopPropagation(); } },
+        React__default.createElement(ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.createElement(IconButton, { ref: parentRef, onClick: toggleDropdown, height: "32px", width: "32px" },
+                React__default.createElement(Icon, { type: IconTypes.MORE, fillColor: IconColors.PRIMARY, width: "24px", height: "24px" }))); }, menuItems: function (closeDropdown) { return (React__default.createElement(MenuItems, { parentRef: parentRef, parentContainRef: parentContainerRef, closeDropdown: closeDropdown },
+                React__default.createElement(MenuItem, { onClick: function () {
+                        if (disabled) {
+                            return;
+                        }
+                        setShowModal(true);
+                        closeDropdown();
+                    }, dataSbId: "channel_list_item_context_menu_leave_channel" }, stringSet.CHANNEL_SETTING__LEAVE_CHANNEL__TITLE))); } }),
+        showModal && (React__default.createElement(LeaveGroupChannel, { channel: channel, onSubmit: function () {
+                setShowModal(false);
+                onLeaveChannel();
+            }, onCancel: function () { return setShowModal(false); } }))));
+}
+
+export { ChannelPreviewAction as C, LeaveGroupChannel as L };
+//# sourceMappingURL=bundle-qAc60kip.js.map

package/chunks/bundle-qAc60kip.js.map

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

package/chunks/{bundle-KmauOTrg.js → bundle-r9j_eCHc.js}

@@ -73,4 +73,4 @@ var MediaQueryProvider = function (props) {
 var useMediaQueryContext = function () { return React__default.useContext(MediaQueryContext); };
 
 export { MediaQueryProvider as M, useMediaQueryContext as u };
-//# sourceMappingURL=bundle-KmauOTrg.js.map
+//# sourceMappingURL=bundle-r9j_eCHc.js.map

package/chunks/bundle-r9j_eCHc.js.map

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

package/chunks/bundle-tPCzzoc1.js

@@ -0,0 +1,34 @@
+function getComponentKeyFromMessage(message) {
+    if ('sendingStatus' in message) {
+        if (message.sendingStatus === 'succeeded')
+            return String(message.messageId);
+        return message.reqId;
+    }
+    return String(message.messageId);
+}
+function isContextMenuClosed() {
+    var _a, _b;
+    return (((_a = document.getElementById('sendbird-dropdown-portal')) === null || _a === void 0 ? void 0 : _a.childElementCount) === 0
+        && ((_b = document.getElementById('sendbird-emoji-list-portal')) === null || _b === void 0 ? void 0 : _b.childElementCount) === 0);
+}
+function getMessageTopOffset(messageCreatedAt) {
+    var _a;
+    var element = (_a = document.querySelectorAll("[data-sb-created-at=\"".concat(messageCreatedAt, "\"]"))) === null || _a === void 0 ? void 0 : _a[0];
+    if (element instanceof HTMLElement) {
+        return element.offsetTop;
+    }
+    return null;
+}
+var isDisabledBecauseFrozen = function (groupChannel) {
+    if (!groupChannel)
+        return false;
+    return groupChannel.isFrozen && groupChannel.myRole !== 'operator';
+};
+var isDisabledBecauseMuted = function (groupChannel) {
+    if (!groupChannel)
+        return false;
+    return groupChannel.myMutedState === 'muted';
+};
+
+export { isDisabledBecauseMuted as a, isContextMenuClosed as b, getComponentKeyFromMessage as c, getMessageTopOffset as g, isDisabledBecauseFrozen as i };
+//# sourceMappingURL=bundle-tPCzzoc1.js.map

package/chunks/bundle-tPCzzoc1.js.map

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

package/chunks/bundle-uIetzCLw.js

@@ -0,0 +1,64 @@
+import React__default, { useState, useEffect, useContext } from 'react';
+import { GroupChannelHandler } from '@sendbird/chat/groupChannel';
+import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-I8JFwttJ.js';
+import { L as LocalizationContext } from './bundle-BBjosDA0.js';
+import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
+import { u as uuidv4 } from './bundle-YoWLsJ0C.js';
+
+var TypingIndicatorText = function (_a) {
+    var members = _a.members;
+    function getText() {
+        var stringSet = useContext(LocalizationContext).stringSet;
+        if (!members || members.length === 0) {
+            return '';
+        }
+        if (members && members.length === 1) {
+            return "".concat(members[0].nickname, " ").concat(stringSet.TYPING_INDICATOR__IS_TYPING);
+        }
+        if (members && members.length === 2) {
+            return "".concat(members[0].nickname, " ").concat(stringSet.TYPING_INDICATOR__AND, " ").concat(members[1].nickname, " ").concat(stringSet.TYPING_INDICATOR__ARE_TYPING);
+        }
+        return stringSet.TYPING_INDICATOR__MULTIPLE_TYPING;
+    }
+    return React__default.createElement(React__default.Fragment, null, getText());
+};
+var TypingIndicator = function (_a) {
+    var _b, _c, _d;
+    var channelUrl = _a.channelUrl;
+    var globalStore = useSendbirdStateContext();
+    var sb = (_c = (_b = globalStore === null || globalStore === void 0 ? void 0 : globalStore.stores) === null || _b === void 0 ? void 0 : _b.sdkStore) === null || _c === void 0 ? void 0 : _c.sdk;
+    var logger = (_d = globalStore === null || globalStore === void 0 ? void 0 : globalStore.config) === null || _d === void 0 ? void 0 : _d.logger;
+    var _e = useState(uuidv4()), handlerId = _e[0], setHandlerId = _e[1];
+    var _f = useState([]), typingMembers = _f[0], setTypingMembers = _f[1];
+    useEffect(function () {
+        var _a;
+        if ((_a = sb === null || sb === void 0 ? void 0 : sb.groupChannel) === null || _a === void 0 ? void 0 : _a.addGroupChannelHandler) {
+            sb.groupChannel.removeGroupChannelHandler(handlerId);
+            var newHandlerId = uuidv4();
+            var handler = new GroupChannelHandler({
+                onTypingStatusUpdated: function (groupChannel) {
+                    // there is a possible warning in here - setState called after unmount
+                    logger.info('Channel > Typing Indicator: onTypingStatusUpdated', groupChannel);
+                    if (groupChannel.url === channelUrl) {
+                        var members = groupChannel.getTypingUsers();
+                        setTypingMembers(members);
+                    }
+                },
+            });
+            sb.groupChannel.addGroupChannelHandler(newHandlerId, handler);
+            setHandlerId(newHandlerId);
+        }
+        return function () {
+            var _a;
+            setTypingMembers([]);
+            if ((_a = sb === null || sb === void 0 ? void 0 : sb.groupChannel) === null || _a === void 0 ? void 0 : _a.removeGroupChannelHandler) {
+                sb.groupChannel.removeGroupChannelHandler(handlerId);
+            }
+        };
+    }, [channelUrl]);
+    return (React__default.createElement(Label, { className: "sendbird-conversation__footer__typing-indicator__text", type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 },
+        React__default.createElement(TypingIndicatorText, { members: typingMembers })));
+};
+
+export { TypingIndicator as T, TypingIndicatorText as a };
+//# sourceMappingURL=bundle-uIetzCLw.js.map

package/chunks/bundle-uIetzCLw.js.map

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

package/chunks/bundle-v3WxYU8s.js

@@ -0,0 +1,30 @@
+// we use pubsub to sync events between multiple components(example - ChannelList, Channel)
+// for example, if customer sends a message from their custom component
+// without pubsub,we would not be able to listen to it
+// in our ChannelList or Conversation
+var pubSubFactory = function () {
+    var topics = {};
+    return {
+        __getTopics: function () { return topics; },
+        subscribe: function (topic, listener) {
+            var _a;
+            (_a = topics[topic]) !== null && _a !== void 0 ? _a : (topics[topic] = new Set());
+            topics[topic].add(listener);
+            return {
+                remove: function () {
+                    topics[topic].delete(listener);
+                },
+            };
+        },
+        publish: function (topic, info) {
+            if (topics[topic]) {
+                topics[topic].forEach(function (fn) {
+                    setTimeout(function () { return fn(info !== undefined ? info : {}); }, 0);
+                });
+            }
+        },
+    };
+};
+
+export { pubSubFactory as p };
+//# sourceMappingURL=bundle-v3WxYU8s.js.map

package/chunks/bundle-v3WxYU8s.js.map

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

package/chunks/{bundle-cXqs96Pt.js → bundle-vOT5acXc.js}

@@ -21,4 +21,4 @@ var UserProfileProvider = function (_a) {
 };
 
 export { UserProfileProvider as U, UserProfileContext as a };
-//# sourceMappingURL=bundle-cXqs96Pt.js.map
+//# sourceMappingURL=bundle-vOT5acXc.js.map

package/chunks/bundle-vOT5acXc.js.map

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

package/chunks/{bundle-Lt8mReNU.js → bundle-vz3GEsoi.js}

@@ -1,5 +1,5 @@
-import { b as isMultipleFilesMessage } from './bundle-uk2Y0AQu.js';
-import { K } from './bundle-kfNTRju0.js';
+import { a as isMultipleFilesMessage } from './bundle-N9hMnIRl.js';
+import { K } from './bundle-aKXnhi3A.js';
 
 function getModalDeleteMessageTitle(stringSet, message) {
     return K(message)
@@ -13,4 +13,4 @@ function getModalDeleteMessageTitle(stringSet, message) {
 }
 
 export { getModalDeleteMessageTitle as g };
-//# sourceMappingURL=bundle-Lt8mReNU.js.map
+//# sourceMappingURL=bundle-vz3GEsoi.js.map

package/chunks/bundle-vz3GEsoi.js.map

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

package/chunks/{bundle-aVVX2zHR.js → bundle-w1C-Xmf3.js}

@@ -1,5 +1,5 @@
-import { d as isFileMessage, b as isMultipleFilesMessage } from './bundle-uk2Y0AQu.js';
-import { K } from './bundle-kfNTRju0.js';
+import { c as isFileMessage, a as isMultipleFilesMessage } from './bundle-N9hMnIRl.js';
+import { K } from './bundle-aKXnhi3A.js';
 
 function getMessageFirstFileType(message) {
     return K(message)
@@ -66,4 +66,4 @@ function getMessageFirstFileThumbnailUrl(message) {
 }
 
 export { getMessageFirstFileType as a, getMessageFirstFileName as b, getMessageFirstFileThumbnailUrl as c, getMessageFirstFileUrl as g };
-//# sourceMappingURL=bundle-aVVX2zHR.js.map
+//# sourceMappingURL=bundle-w1C-Xmf3.js.map

package/chunks/bundle-w1C-Xmf3.js.map

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

package/chunks/{bundle-DeRyZP32.js → bundle-wMP1pqZM.js}

@@ -1,16 +1,16 @@
-import { _ as __assign } from './bundle-GKopZh-T.js';
+import { _ as __assign } from './bundle-BA7tv0JB.js';
 import React__default, { useRef, useContext } from 'react';
 import { createPortal } from 'react-dom';
-import { L as LocalizationContext } from './bundle-y_LgB6DS.js';
+import { L as LocalizationContext } from './bundle-BBjosDA0.js';
 import '../hooks/useModal.js';
-import { b as isMultipleFilesMessage, d as isFileMessage, e as isSupportedFileView, f as isVideo$1, c as isImage$1 } from './bundle-uk2Y0AQu.js';
-import { n as noop } from './bundle-WpHDilD_.js';
-import { A as Avatar } from './bundle-X3h4GiLa.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-dWJnfDPH.js';
+import { a as isMultipleFilesMessage, c as isFileMessage, E as isSupportedFileView, w as isVideo$1, u as isImage$1 } from './bundle-N9hMnIRl.js';
+import { n as noop } from './bundle-cA_r9HRx.js';
+import { A as Avatar } from './bundle-Qufz6_i_.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-I8JFwttJ.js';
 import Icon, { IconTypes, IconColors } from '../ui/Icon.js';
-import { h as SLIDER_BUTTON_ICON_SIDE_LENGTH } from './bundle-ZKM9Qk_j.js';
-import { u as useKeyDown } from './bundle-xgiw36M5.js';
-import { a as MODAL_ROOT } from './bundle-VPanFdbf.js';
+import { j as SLIDER_BUTTON_ICON_SIDE_LENGTH } from './bundle-MBrlu_LK.js';
+import { u as useKeyDown } from './bundle-fQ1V_U8F.js';
+import { a as MODAL_ROOT } from './bundle-cvTUkQV_.js';
 
 // https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types
 var SUPPORTED_MIMES = {
@@ -144,4 +144,4 @@ function FileViewer(_a) {
 }
 
 export { FileViewer as F, isVideo as a, FileViewerComponent as b, isImage as i };
-//# sourceMappingURL=bundle-DeRyZP32.js.map
+//# sourceMappingURL=bundle-wMP1pqZM.js.map

package/chunks/{bundle-DeRyZP32.js.map → bundle-wMP1pqZM.js.map}

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

package/chunks/bundle-x_yt1Yd5.js

@@ -0,0 +1,30 @@
+import React__default from 'react';
+import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
+import { u as useLocalization } from './bundle-BBjosDA0.js';
+import { A as Avatar } from './bundle-Qufz6_i_.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-I8JFwttJ.js';
+
+var GroupChannelListHeader = function (_a) {
+    var renderTitle = _a.renderTitle, renderIconButton = _a.renderIconButton, onEdit = _a.onEdit, allowProfileEdit = _a.allowProfileEdit;
+    var stores = useSendbirdStateContext().stores;
+    var user = stores.userStore.user;
+    var stringSet = useLocalization().stringSet;
+    return (React__default.createElement("div", { className: [
+            'sendbird-channel-header',
+            allowProfileEdit ? 'sendbird-channel-header--allow-edit' : '',
+        ].join(' ') },
+        (renderTitle === null || renderTitle === void 0 ? void 0 : renderTitle()) || (React__default.createElement("div", { className: "sendbird-channel-header__title", role: "button", onClick: function () {
+                onEdit === null || onEdit === void 0 ? void 0 : onEdit();
+            }, onKeyDown: function () {
+                onEdit === null || onEdit === void 0 ? void 0 : onEdit();
+            }, tabIndex: 0 },
+            React__default.createElement("div", { className: "sendbird-channel-header__title__left" },
+                React__default.createElement(Avatar, { width: "32px", height: "32px", src: user.profileUrl, alt: user.nickname })),
+            React__default.createElement("div", { className: "sendbird-channel-header__title__right" },
+                React__default.createElement(Label, { className: "sendbird-channel-header__title__right__name", type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_1 }, user.nickname || stringSet.NO_NAME),
+                React__default.createElement(Label, { className: "sendbird-channel-header__title__right__user-id", type: LabelTypography.BODY_2, color: LabelColors.ONBACKGROUND_2 }, user.userId)))),
+        React__default.createElement("div", { className: "sendbird-channel-header__right-icon" }, renderIconButton === null || renderIconButton === void 0 ? void 0 : renderIconButton())));
+};
+
+export { GroupChannelListHeader as G };
+//# sourceMappingURL=bundle-x_yt1Yd5.js.map

package/chunks/bundle-x_yt1Yd5.js.map

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