@sendbird/uikit-react 3.4.0-rc.1 → 3.4.0-rc.2

package/ChannelList/components/ChannelListUI.js

@@ -0,0 +1,268 @@
+import React__default, { useState, useEffect } from 'react';
+import ChannelListHeader from './ChannelListHeader.js';
+import { AddChannel } from './AddChannel.js';
+import ChannelPreview from './ChannelPreview.js';
+import ChannelPreviewAction from './ChannelPreviewAction.js';
+import { u as useChannelListContext, F as FETCH_CHANNELS_START, a as FETCH_CHANNELS_SUCCESS, b as FETCH_CHANNELS_FAILURE, L as LEAVE_CHANNEL_SUCCESS, S as SET_CURRENT_CHANNEL } from '../../ChannelListProvider-43f3a74a.js';
+import useSendbirdStateContext from '../../useSendbirdStateContext.js';
+import EditProfile from '../../EditUserProfile.js';
+import { P as PlaceHolder, a as PlaceHolderTypes } from '../../index-86034384.js';
+import '../../LocalizationContext-a6aa8be8.js';
+import '../../stringSet-ad8993d1.js';
+import '../../index-757a563a.js';
+import '../../index-67c5e94c.js';
+import 'prop-types';
+import '../../ui/Avatar.js';
+import '../../tslib.es6-cd680863.js';
+import '../../ui/ImageRenderer.js';
+import '../../ui/Icon.js';
+import '../../uuid-9f7da91d.js';
+import '../../ui/IconButton.js';
+import '../../CreateChannel.js';
+import '../../CreateChannel/components/CreateChannelUI.js';
+import '../../CreateChannelProvider-763b1601.js';
+import '../../sendbirdSelectors.js';
+import '../../topics-9fbe0d61.js';
+import '../../utils-aae15fda.js';
+import '../../CreateChannel/components/InviteUsers.js';
+import '../../ui/Modal.js';
+import 'react-dom';
+import '../../index-d4908e3c.js';
+import '../../ui/Button.js';
+import '../../MediaQueryContext-a551e770.js';
+import '../../ui/UserListItem.js';
+import '../../UserProfileContext-dd096494.js';
+import '../../ui/MutedAvatarOverlay.js';
+import '../../ui/Checkbox.js';
+import '../../ui/UserProfile.js';
+import '../../ui/ContextMenu.js';
+import '../../ui/SortByRow.js';
+import '../../index-8ee9e1f5.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../CreateChannel/components/SelectChannelType.js';
+import '../../_rollupPluginBabelHelpers-3e5825fa.js';
+import '../../ui/ChannelAvatar.js';
+import '../../utils-c196d7c4.js';
+import '../../ui/Badge.js';
+import '../../index-c8a147a4.js';
+import '../../index-6ccea9a6.js';
+import '../../ui/Loader.js';
+import '../../index-7283bb53.js';
+import '../../index-00eb27a6.js';
+import '../../ui/MentionUserLabel.js';
+import '../../ui/TextButton.js';
+import '../../color-ed83ffc3.js';
+import '../../Channel/components/TypingIndicator.js';
+import '@sendbird/chat/groupChannel';
+import '../../ChannelProvider-def8e42f.js';
+import '../../compareIds-c8335d61.js';
+import '../../const-e27598a1.js';
+import '@sendbird/chat/message';
+import '../../ui/ReactionButton.js';
+import '../../consts-886b25ca.js';
+import '../../useLongPress-49f5ba4f.js';
+import '../../withSendbird.js';
+import '../../index-1c547263.js';
+import '../../ui/Input.js';
+import '../../actionTypes-3245f646.js';
+
+const isAboutSame = (a, b, px) => Math.abs(a - b) <= px;
+
+var DELIVERY_RECIPT = 'delivery_receipt';
+
+var ChannelListUI = function (props) {
+  var _a;
+
+  var renderHeader = props.renderHeader,
+      renderChannelPreview = props.renderChannelPreview,
+      renderPlaceHolderError = props.renderPlaceHolderError,
+      renderPlaceHolderLoading = props.renderPlaceHolderLoading,
+      renderPlaceHolderEmptyList = props.renderPlaceHolderEmptyList;
+
+  var _b = useState(false),
+      showProfileEdit = _b[0],
+      setShowProfileEdit = _b[1];
+
+  var _c = useChannelListContext(),
+      onThemeChange = _c.onThemeChange,
+      allowProfileEdit = _c.allowProfileEdit,
+      allChannels = _c.allChannels,
+      loading = _c.loading,
+      currentChannel = _c.currentChannel,
+      channelListDispatcher = _c.channelListDispatcher,
+      channelSource = _c.channelSource,
+      typingChannels = _c.typingChannels,
+      initialized = _c.initialized;
+
+  var state = useSendbirdStateContext();
+  var sdkStore = (_a = state === null || state === void 0 ? void 0 : state.stores) === null || _a === void 0 ? void 0 : _a.sdkStore;
+  var config = state === null || state === void 0 ? void 0 : state.config;
+  var _d = config.logger,
+      logger = _d === void 0 ? null : _d,
+      _e = config.isOnline,
+      isOnline = _e === void 0 ? false : _e,
+      _f = config.disableMarkAsDelivered,
+      disableMarkAsDelivered = _f === void 0 ? false : _f;
+  var sdk = sdkStore === null || sdkStore === void 0 ? void 0 : sdkStore.sdk;
+  var sdkError = sdkStore === null || sdkStore === void 0 ? void 0 : sdkStore.error;
+
+  var _g = useState([]),
+      channelsTomarkAsRead = _g[0],
+      setChannelsToMarkAsRead = _g[1];
+
+  useEffect(function () {
+    // https://stackoverflow.com/a/60907638
+    var isMounted = true;
+
+    if ((channelsTomarkAsRead === null || channelsTomarkAsRead === void 0 ? void 0 : channelsTomarkAsRead.length) > 0 && !disableMarkAsDelivered) {
+      channelsTomarkAsRead === null || channelsTomarkAsRead === void 0 ? void 0 : channelsTomarkAsRead.forEach(function (c, idx) {
+        // Plan-based rate limits - minimum limit is 5 requests per second
+        setTimeout(function () {
+          if (isMounted) {
+            c === null || c === void 0 ? void 0 : c.markAsDelivered();
+          }
+        }, 2000 * idx);
+      });
+    }
+
+    return function () {
+      isMounted = false;
+    };
+  }, [channelsTomarkAsRead]);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-list__header"
+  }, (renderHeader === null || renderHeader === void 0 ? void 0 : renderHeader()) || /*#__PURE__*/React__default.createElement(ChannelListHeader, {
+    onEdit: function () {
+      if (allowProfileEdit) {
+        setShowProfileEdit(true);
+      }
+    },
+    allowProfileEdit: allowProfileEdit,
+    renderIconButton: function () {
+      return /*#__PURE__*/React__default.createElement(AddChannel, null);
+    }
+  })), showProfileEdit && /*#__PURE__*/React__default.createElement(EditProfile, {
+    onThemeChange: onThemeChange,
+    onCancel: function () {
+      setShowProfileEdit(false);
+    },
+    onEditProfile: function () {
+      setShowProfileEdit(false);
+    }
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-list__body",
+    onScroll: function (e) {
+      var target = e === null || e === void 0 ? void 0 : e.target;
+      var fetchMore = isAboutSame(target.clientHeight + target.scrollTop, target.scrollHeight, 10);
+
+      if (fetchMore && (channelSource === null || channelSource === void 0 ? void 0 : channelSource.hasNext)) {
+        logger.info('ChannelList: Fetching more channels');
+        channelListDispatcher({
+          type: FETCH_CHANNELS_START,
+          payload: null
+        });
+        channelSource.next().then(function (channelList) {
+          var _a, _b;
+
+          logger.info('ChannelList: Fetching channels successful', channelList);
+          channelListDispatcher({
+            type: FETCH_CHANNELS_SUCCESS,
+            payload: channelList
+          });
+          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_RECIPT;
+          });
+
+          if (canSetMarkAsDelivered) {
+            logger.info('ChannelList: Marking all channels as read'); // eslint-disable-next-line no-unused-expressions
+
+            setChannelsToMarkAsRead(channelList);
+          }
+        }).catch(function (err) {
+          logger.info('ChannelList: Fetching channels failed', err);
+          channelListDispatcher({
+            type: FETCH_CHANNELS_FAILURE,
+            payload: err
+          });
+        });
+      }
+    }
+  }, sdkError && !loading && (renderPlaceHolderError && typeof renderPlaceHolderError === 'function' ? renderPlaceHolderError === null || renderPlaceHolderError === void 0 ? void 0 : renderPlaceHolderError() : /*#__PURE__*/React__default.createElement(PlaceHolder, {
+    type: PlaceHolderTypes.WRONG
+  })), /*#__PURE__*/React__default.createElement("div", null, allChannels && allChannels.map(function (channel, idx) {
+    // todo: Refactor and move this inside channel - preview
+    var onLeaveChannel = function (c, cb) {
+      logger.info('ChannelList: Leaving channel', c);
+      c.leave().then(function (res) {
+        logger.info('ChannelList: Leaving channel success', res);
+
+        if (cb && typeof cb === 'function') {
+          cb(res, null);
+        }
+
+        channelListDispatcher({
+          type: LEAVE_CHANNEL_SUCCESS,
+          payload: channel === null || channel === void 0 ? void 0 : channel.url
+        });
+      }).catch(function (err) {
+        logger.error('ChannelList: Leaving channel failed', err);
+
+        if (cb && typeof cb === 'function') {
+          cb(null, err);
+        }
+      });
+    };
+
+    var onClick = function () {
+      if (!isOnline) {
+        return;
+      }
+
+      logger.info('ChannelList: Clicked on channel:', channel);
+      channelListDispatcher({
+        type: SET_CURRENT_CHANNEL,
+        payload: channel
+      });
+    };
+
+    return renderChannelPreview ?
+    /*#__PURE__*/
+    // eslint-disable-next-line
+    React__default.createElement("div", {
+      key: channel === null || channel === void 0 ? void 0 : channel.url,
+      onClick: onClick
+    }, renderChannelPreview({
+      channel: channel,
+      onLeaveChannel: onLeaveChannel
+    })) : /*#__PURE__*/React__default.createElement(ChannelPreview, {
+      key: channel === null || channel === void 0 ? void 0 : channel.url,
+      tabIndex: idx,
+      onClick: onClick,
+      channel: channel,
+      onLeaveChannel: function () {
+        return onLeaveChannel(channel, null);
+      },
+      isActive: (channel === null || channel === void 0 ? void 0 : channel.url) === (currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.url),
+      isTyping: typingChannels === null || typingChannels === void 0 ? void 0 : typingChannels.some(function (_a) {
+        var url = _a.url;
+        return url === (channel === null || channel === void 0 ? void 0 : channel.url);
+      }),
+      renderChannelAction: function () {
+        return /*#__PURE__*/React__default.createElement(ChannelPreviewAction, {
+          channel: channel,
+          disabled: !isOnline,
+          onLeaveChannel: function () {
+            return onLeaveChannel(channel, null);
+          }
+        });
+      }
+    });
+  })), !initialized && loading && (renderPlaceHolderLoading && typeof renderPlaceHolderLoading === 'function' ? renderPlaceHolderLoading === null || renderPlaceHolderLoading === void 0 ? void 0 : renderPlaceHolderLoading() : /*#__PURE__*/React__default.createElement(PlaceHolder, {
+    type: PlaceHolderTypes.LOADING
+  })), initialized && (allChannels === null || allChannels === void 0 ? void 0 : allChannels.length) === 0 && (renderPlaceHolderEmptyList && typeof renderPlaceHolderEmptyList === 'function' ? renderPlaceHolderEmptyList === null || renderPlaceHolderEmptyList === void 0 ? void 0 : renderPlaceHolderEmptyList() : /*#__PURE__*/React__default.createElement(PlaceHolder, {
+    type: PlaceHolderTypes.NO_CHANNELS
+  }))));
+};
+
+export { ChannelListUI as default };
+//# sourceMappingURL=ChannelListUI.js.map

package/ChannelList/components/ChannelPreview.js

@@ -0,0 +1,193 @@
+import { a as _extends } from '../../_rollupPluginBabelHelpers-3e5825fa.js';
+import { _ as __assign } from '../../tslib.es6-cd680863.js';
+import React__default, { useState } from 'react';
+import ChannelAvatar from '../../ui/ChannelAvatar.js';
+import Badge from '../../ui/Badge.js';
+import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-67c5e94c.js';
+import { g as getChannelTitle, a as getTotalMembers, M as MessageStatus, b as getLastMessageCreatedAt, c as getLastMessage, d as getChannelUnreadMessageCount } from '../../index-c8a147a4.js';
+import useSendbirdStateContext from '../../useSendbirdStateContext.js';
+import { u as useLocalization } from '../../LocalizationContext-a6aa8be8.js';
+import MentionUserLabel from '../../ui/MentionUserLabel.js';
+import Modal from '../../ui/Modal.js';
+import TextButton from '../../ui/TextButton.js';
+import { u as useChannelListContext } from '../../ChannelListProvider-43f3a74a.js';
+import { TypingIndicatorText } from '../../Channel/components/TypingIndicator.js';
+import { d as isVoiceMessage, e as isEditedMessage } from '../../index-8ee9e1f5.js';
+import { u as useMediaQueryContext } from '../../MediaQueryContext-a551e770.js';
+import { u as useLongPress } from '../../useLongPress-49f5ba4f.js';
+import '../../ui/Avatar.js';
+import '../../ui/ImageRenderer.js';
+import '../../uuid-9f7da91d.js';
+import '../../utils-c196d7c4.js';
+import 'prop-types';
+import '../../stringSet-ad8993d1.js';
+import '../../index-6ccea9a6.js';
+import '../../index-757a563a.js';
+import '../../ui/Loader.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../index-7283bb53.js';
+import '../../index-00eb27a6.js';
+import '../../withSendbird.js';
+import 'react-dom';
+import '../../index-d4908e3c.js';
+import '../../ui/Button.js';
+import '../../ui/IconButton.js';
+import '../../color-ed83ffc3.js';
+import '@sendbird/chat/groupChannel';
+import '../../topics-9fbe0d61.js';
+import '../../utils-aae15fda.js';
+import '../../UserProfileContext-dd096494.js';
+import '../../ChannelProvider-def8e42f.js';
+import '../../compareIds-c8335d61.js';
+import '../../const-e27598a1.js';
+import '@sendbird/chat/message';
+import '../../ui/ContextMenu.js';
+import '../../ui/SortByRow.js';
+import '../../ui/ReactionButton.js';
+import '../../consts-886b25ca.js';
+
+var ChannelPreview = function (_a) {
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k;
+
+  var channel = _a.channel,
+      _l = _a.isActive,
+      isActive = _l === void 0 ? false : _l,
+      _m = _a.isTyping,
+      isTyping = _m === void 0 ? false : _m,
+      renderChannelAction = _a.renderChannelAction,
+      onLeaveChannel = _a.onLeaveChannel,
+      onClick = _a.onClick,
+      tabIndex = _a.tabIndex;
+  var sbState = useSendbirdStateContext();
+
+  var _o = useChannelListContext(),
+      _p = _o.isTypingIndicatorEnabled,
+      isTypingIndicatorEnabled = _p === void 0 ? false : _p,
+      _q = _o.isMessageReceiptStatusEnabled,
+      isMessageReceiptStatusEnabled = _q === void 0 ? false : _q;
+
+  var _r = useLocalization(),
+      dateLocale = _r.dateLocale,
+      stringSet = _r.stringSet;
+
+  var isMobile = useMediaQueryContext().isMobile;
+
+  var _s = useState(false),
+      showMobileLeave = _s[0],
+      setShowMobileLeave = _s[1];
+
+  var userId = (_d = (_c = (_b = sbState === null || sbState === void 0 ? void 0 : sbState.stores) === null || _b === void 0 ? void 0 : _b.userStore) === null || _c === void 0 ? void 0 : _c.user) === null || _d === void 0 ? void 0 : _d.userId;
+  var theme = (_e = sbState === null || sbState === void 0 ? void 0 : sbState.config) === null || _e === void 0 ? void 0 : _e.theme;
+  var isMentionEnabled = (_f = sbState === null || sbState === void 0 ? void 0 : sbState.config) === null || _f === void 0 ? void 0 : _f.isMentionEnabled;
+  var isFrozen = (channel === null || channel === void 0 ? void 0 : channel.isFrozen) || false;
+  var isBroadcast = (channel === null || channel === void 0 ? void 0 : channel.isBroadcast) || false;
+  var isChannelTyping = isTypingIndicatorEnabled && isTyping;
+  var isMessageStatusEnabled = isMessageReceiptStatusEnabled && (((_g = channel === null || channel === void 0 ? void 0 : channel.lastMessage) === null || _g === void 0 ? void 0 : _g.messageType) === 'user' || ((_h = channel === null || channel === void 0 ? void 0 : channel.lastMessage) === null || _h === void 0 ? void 0 : _h.messageType) === 'file') && ((_k = (_j = channel === null || channel === void 0 ? void 0 : channel.lastMessage) === null || _j === void 0 ? void 0 : _j.sender) === null || _k === void 0 ? void 0 : _k.userId) === userId;
+  var onLongPress = useLongPress({
+    onLongPress: function () {
+      if (isMobile) {
+        setShowMobileLeave(true);
+      }
+    },
+    onClick: onClick
+  }, {
+    delay: 1000
+  });
+  var channelName = getChannelTitle(channel, userId, stringSet);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", _extends({
+    className: ['sendbird-channel-preview', isActive ? 'sendbird-channel-preview--active' : ''].join(' '),
+    role: "link",
+    tabIndex: tabIndex
+  }, isMobile ? __assign({}, onLongPress) : {
+    onClick: onClick
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__avatar"
+  }, /*#__PURE__*/React__default.createElement(ChannelAvatar, {
+    channel: channel,
+    userId: userId,
+    theme: theme
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__content"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__content__upper"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__content__upper__header"
+  }, isBroadcast && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__content__upper__header__broadcast-icon"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: IconTypes.BROADCAST,
+    fillColor: IconColors.SECONDARY,
+    height: "16px",
+    width: "16px"
+  })), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-channel-preview__content__upper__header__channel-name",
+    type: LabelTypography.SUBTITLE_2,
+    color: LabelColors.ONBACKGROUND_1
+  }, /*#__PURE__*/React__default.createElement("div", null, channelName)), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-channel-preview__content__upper__header__total-members",
+    type: LabelTypography.CAPTION_2,
+    color: LabelColors.ONBACKGROUND_2
+  }, getTotalMembers(channel)), isFrozen && /*#__PURE__*/React__default.createElement("div", {
+    title: "Frozen",
+    className: "sendbird-channel-preview__content__upper__header__frozen-icon"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: IconTypes.FREEZE,
+    fillColor: IconColors.PRIMARY,
+    height: 12,
+    width: 12
+  }))), isMessageStatusEnabled ? /*#__PURE__*/React__default.createElement(MessageStatus, {
+    className: "sendbird-channel-preview__content__upper__last-message-at",
+    channel: channel,
+    message: channel === null || channel === void 0 ? void 0 : channel.lastMessage,
+    isDateSeparatorConsidered: false
+  }) : /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-channel-preview__content__upper__last-message-at",
+    type: LabelTypography.CAPTION_3,
+    color: LabelColors.ONBACKGROUND_2
+  }, getLastMessageCreatedAt({
+    channel: channel,
+    locale: dateLocale,
+    stringSet: stringSet
+  }))), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__content__lower"
+  }, /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-channel-preview__content__lower__last-message",
+    type: LabelTypography.BODY_2,
+    color: LabelColors.ONBACKGROUND_3
+  }, isChannelTyping && /*#__PURE__*/React__default.createElement(TypingIndicatorText, {
+    members: channel === null || channel === void 0 ? void 0 : channel.getTypingUsers()
+  }), !isChannelTyping && !isVoiceMessage(channel === null || channel === void 0 ? void 0 : channel.lastMessage) && getLastMessage(channel) + (isEditedMessage(channel === null || channel === void 0 ? void 0 : channel.lastMessage) ? " ".concat(stringSet.MESSAGE_EDITED) : ''), !isChannelTyping && isVoiceMessage(channel === null || channel === void 0 ? void 0 : channel.lastMessage) && stringSet.VOICE_MESSAGE), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__content__lower__unread-message-count"
+  }, isMentionEnabled && (channel === null || channel === void 0 ? void 0 : channel.unreadMentionCount) > 0 ? /*#__PURE__*/React__default.createElement(MentionUserLabel, {
+    className: "sendbird-channel-preview__content__lower__unread-message-count__mention",
+    color: "purple"
+  }, '@') : null, getChannelUnreadMessageCount(channel) // return number
+  ? /*#__PURE__*/React__default.createElement(Badge, {
+    count: getChannelUnreadMessageCount(channel)
+  }) : null))), !isMobile && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-preview__action"
+  }, renderChannelAction({
+    channel: channel
+  }))), showMobileLeave && isMobile && /*#__PURE__*/React__default.createElement(Modal, {
+    className: "sendbird-channel-preview__leave--mobile",
+    titleText: channelName,
+    hideFooter: true,
+    isCloseOnClickOutside: true,
+    onCancel: function () {
+      return setShowMobileLeave(false);
+    }
+  }, /*#__PURE__*/React__default.createElement(TextButton, {
+    onClick: function () {
+      onLeaveChannel();
+      setShowMobileLeave(false);
+    },
+    className: "sendbird-channel-preview__leave-label--mobile"
+  }, /*#__PURE__*/React__default.createElement(Label, {
+    type: LabelTypography.SUBTITLE_1,
+    color: LabelColors.ONBACKGROUND_1
+  }, stringSet.CHANNEL_PREVIEW_MOBILE_LEAVE))));
+};
+
+export { ChannelPreview as default };
+//# sourceMappingURL=ChannelPreview.js.map

package/ChannelList/components/ChannelPreviewAction.js

@@ -0,0 +1,133 @@
+import React__default, { useRef, useState, useContext } from 'react';
+import PropTypes from 'prop-types';
+import { u as useLocalization, a as LocalizationContext } from '../../LocalizationContext-a6aa8be8.js';
+import ContextMenu, { MenuItems, MenuItem } from '../../ui/ContextMenu.js';
+import IconButton from '../../ui/IconButton.js';
+import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
+import useSendbirdStateContext from '../../useSendbirdStateContext.js';
+import { n as noop } from '../../utils-aae15fda.js';
+import Modal from '../../ui/Modal.js';
+import { u as useChannelListContext } from '../../ChannelListProvider-43f3a74a.js';
+import '../../stringSet-ad8993d1.js';
+import '../../index-757a563a.js';
+import '../../tslib.es6-cd680863.js';
+import 'react-dom';
+import '../../ui/SortByRow.js';
+import '../../uuid-9f7da91d.js';
+import '../../index-8ee9e1f5.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../index-67c5e94c.js';
+import '../../withSendbird.js';
+import '../../_rollupPluginBabelHelpers-3e5825fa.js';
+import '../../index-d4908e3c.js';
+import '../../ui/Button.js';
+import '../../MediaQueryContext-a551e770.js';
+import '@sendbird/chat/groupChannel';
+import '../../topics-9fbe0d61.js';
+import '../../UserProfileContext-dd096494.js';
+
+var LeaveChannel = function (props) {
+  var _a, _b, _c;
+
+  var _d = props.channel,
+      channel = _d === void 0 ? null : _d,
+      _e = props.onSubmit,
+      onSubmit = _e === void 0 ? noop : _e,
+      _f = props.onCancel,
+      onCancel = _f === void 0 ? noop : _f;
+  var channelFromContext = (_a = useChannelListContext()) === null || _a === void 0 ? void 0 : _a.currentChannel;
+  var leavingChannel = channel || channelFromContext;
+  var state = useSendbirdStateContext();
+  var stringSet = useLocalization().stringSet;
+  var logger = (_b = state === null || state === void 0 ? void 0 : state.config) === null || _b === void 0 ? void 0 : _b.logger;
+  var isOnline = (_c = state === null || state === void 0 ? void 0 : state.config) === null || _c === void 0 ? void 0 : _c.isOnline;
+
+  if (leavingChannel) {
+    return /*#__PURE__*/React__default.createElement(Modal, {
+      disabled: !isOnline,
+      onCancel: onCancel,
+      onSubmit: function () {
+        logger.info('ChannelSettings: Leaving channel', leavingChannel);
+        leavingChannel === null || leavingChannel === void 0 ? void 0 : leavingChannel.leave().then(function () {
+          logger.info('ChannelSettings: Leaving channel successful!', leavingChannel);
+          onSubmit();
+        });
+      },
+      submitText: stringSet.MODAL__LEAVE_CHANNEL__FOOTER,
+      titleText: stringSet.MODAL__LEAVE_CHANNEL__TITLE
+    });
+  }
+};
+
+function ChannelPreviewAction(_ref) {
+  let {
+    channel,
+    disabled,
+    onLeaveChannel
+  } = _ref;
+  const parentRef = useRef(null);
+  const parentContainerRef = useRef(null);
+  const [showModal, setShowModal] = useState(false);
+  const {
+    stringSet
+  } = useContext(LocalizationContext);
+  return /*#__PURE__*/React__default.createElement("div", {
+    role: "button",
+    style: {
+      display: 'inline-block'
+    },
+    onKeyDown: e => {
+      e.stopPropagation();
+    },
+    tabIndex: 0,
+    onClick: e => {
+      e.stopPropagation();
+    },
+    ref: parentContainerRef
+  }, /*#__PURE__*/React__default.createElement(ContextMenu, {
+    menuTrigger: toggleDropdown => /*#__PURE__*/React__default.createElement(IconButton, {
+      ref: parentRef,
+      onClick: toggleDropdown,
+      height: "32px",
+      width: "32px"
+    }, /*#__PURE__*/React__default.createElement(Icon, {
+      type: IconTypes.MORE,
+      fillColor: IconColors.PRIMARY,
+      width: "24px",
+      height: "24px"
+    })),
+    menuItems: closeDropdown => /*#__PURE__*/React__default.createElement(MenuItems, {
+      parentRef: parentRef,
+      parentContainRef: parentContainerRef,
+      closeDropdown: closeDropdown
+    }, /*#__PURE__*/React__default.createElement(MenuItem, {
+      onClick: () => {
+        if (disabled) {
+          return;
+        }
+
+        setShowModal(true);
+        closeDropdown();
+      }
+    }, stringSet.CHANNEL_SETTING__LEAVE_CHANNEL__TITLE))
+  }), showModal && /*#__PURE__*/React__default.createElement(LeaveChannel, {
+    channel: channel,
+    onSubmit: () => {
+      setShowModal(false);
+      onLeaveChannel();
+    },
+    onCancel: () => setShowModal(false)
+  }));
+}
+ChannelPreviewAction.propTypes = {
+  disabled: PropTypes.bool,
+  onLeaveChannel: PropTypes.func.isRequired,
+  channel: PropTypes.shape({})
+};
+ChannelPreviewAction.defaultProps = {
+  disabled: false,
+  channel: null
+};
+
+export { ChannelPreviewAction as default };
+//# sourceMappingURL=ChannelPreviewAction.js.map

package/ChannelList/context.js

@@ -0,0 +1,15 @@
+import '../tslib.es6-cd680863.js';
+import 'react';
+import '@sendbird/chat/groupChannel';
+export { C as ChannelListProvider, u as useChannelListContext } from '../ChannelListProvider-43f3a74a.js';
+import '../uuid-9f7da91d.js';
+import '../utils-aae15fda.js';
+import '../UserProfileContext-dd096494.js';
+import '../useSendbirdStateContext.js';
+import '../topics-9fbe0d61.js';
+import '../_rollupPluginBabelHelpers-3e5825fa.js';
+import '../index-8ee9e1f5.js';
+import '../utils/message/getOutgoingMessageState.js';
+import 'prop-types';
+import '../withSendbird.js';
+//# sourceMappingURL=context.js.map