@sendbird/uikit-react 3.7.0 → 3.8.0

package/cjs/ui/EmojiReactions.js

@@ -6,360 +6,173 @@ var ui_ReactionButton = require('./ReactionButton.js');
 var ui_ImageRenderer = require('./ImageRenderer.js');
 var ui_Icon = require('./Icon.js');
 var ui_ContextMenu = require('./ContextMenu.js');
-var index = require('../index-dbe8dd84.js');
+var index = require('../chunks/bundle-FHx0K-3z.js');
 var ui_BottomSheet = require('./BottomSheet.js');
-var ui_Label = require('../index-b5a9b4b7.js');
+var ui_Label = require('../chunks/bundle-6ziaqiUd.js');
 var ui_UserListItem = require('./UserListItem.js');
+var _tslib = require('../chunks/bundle-hK4x7nmG.js');
 var ui_Tooltip = require('./Tooltip.js');
 var ui_TooltipWrapper = require('./TooltipWrapper.js');
-var MediaQueryContext = require('../MediaQueryContext-6141d955.js');
-var useLongPress = require('../useLongPress-18b7af79.js');
-var LocalizationContext = require('../LocalizationContext-58b6ed7c.js');
+var MediaQueryContext = require('../chunks/bundle-Y9TkHVI5.js');
+var useLongPress = require('../chunks/bundle-tywVawyg.js');
+var LocalizationContext = require('../chunks/bundle-QmSa90PC.js');
 var useSendbirdStateContext = require('../useSendbirdStateContext.js');
 var Message_context = require('../Message/context.js');
-var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-f5b0dfb9.js');
-require('../tslib.es6-c74b513f.js');
-require('../utils-eb6d90e0.js');
-require('prop-types');
+require('../chunks/bundle-z-Bvsn0B.js');
+require('../chunks/bundle-1yOirqug.js');
 require('react-dom');
 require('./SortByRow.js');
-require('../uuid-9a117e16.js');
+require('../chunks/bundle-gMxOq93o.js');
 require('../utils/message/getOutgoingMessageState.js');
-require('../index-54279ec2.js');
-require('../stringSet-1539ac47.js');
-require('../types-d0d770c3.js');
-require('../index-b8ba4548.js');
-require('../UserProfileContext-c6d7abb7.js');
+require('../chunks/bundle-I_9_5a8a.js');
+require('../hooks/useModal.js');
+require('../chunks/bundle-UooP2IDU.js');
+require('./IconButton.js');
+require('./Button.js');
+require('../chunks/bundle-n1yh-qDb.js');
+require('../chunks/bundle-4bb_98h6.js');
 require('./Avatar.js');
 require('./MutedAvatarOverlay.js');
 require('./Checkbox.js');
 require('./UserProfile.js');
 require('../sendbirdSelectors.js');
 require('../pubSub/topics.js');
-require('./Button.js');
-require('../index-e8928da6.js');
 require('../withSendbird.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var ReactedMembersBottomSheet = function (_a) {
-  var _b, _c, _d;
-  var message = _a.message,
-    channel = _a.channel,
-    _e = _a.emojiKey,
-    emojiKey = _e === void 0 ? '' : _e,
-    hideMenu = _a.hideMenu,
-    emojiContainer = _a.emojiContainer,
-    onPressUserProfileHandler = _a.onPressUserProfileHandler;
-  var _f = channel.members,
-    members = _f === void 0 ? [] : _f;
-  var _g = React.useState(emojiKey),
-    selectedEmoji = _g[0],
-    setSelectedEmoji = _g[1];
-  function onPressUserProfileCallBack() {
-    if (onPressUserProfileHandler && message) {
-      var sender = message === null || message === void 0 ? void 0 : message.sender;
-      onPressUserProfileHandler(sender);
-    }
-  }
-  return /*#__PURE__*/React__default["default"].createElement(ui_BottomSheet, {
-    onBackdropClick: hideMenu
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-message__bottomsheet"
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-message__bottomsheet__reacted-members"
-  }, (_b = message.reactions) === null || _b === void 0 ? void 0 : _b.map(function (reaction) {
-    var emojiUrl = index.getEmojiUrl(emojiContainer, reaction.key);
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      key: reaction.key,
-      className: "\n                  sendbird-message__bottomsheet__reacted-members__item\n                  ".concat(selectedEmoji === reaction.key ? 'sendbird-message__bottomsheet__reacted-members__item__selected' : '', "\n                "),
-      onClick: function () {
-        setSelectedEmoji(reaction.key);
-      }
-    }, /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer["default"], {
-      url: emojiUrl,
-      width: "28px",
-      height: "28px",
-      placeHolder: function (style) {
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          style: style
-        }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-          type: ui_Icon.IconTypes.QUESTION,
-          fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
-          width: "28px",
-          height: "28px"
-        }));
-      }
-    }), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
-      type: ui_Label.LabelTypography.BUTTON_2,
-      color: selectedEmoji === reaction.key ? ui_Label.LabelColors.PRIMARY : ui_Label.LabelColors.ONBACKGROUND_3
-    }, reaction.userIds.length));
-  })), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-message__bottomsheet__reactor-list"
-  },
-  // making a member list who reacted to the message with the `selectedEmoji`
-  ((_d = (_c = message.reactions) === null || _c === void 0 ? void 0 : _c.find(function (reaction) {
-    return reaction.key === selectedEmoji;
-  })) === null || _d === void 0 ? void 0 : _d.userIds.map(function (userId) {
-    return members.find(function (member) {
-      return member.userId === userId;
-    });
-  }).filter(function (member) {
-    return member !== undefined;
-  })).map(function (member) {
-    return /*#__PURE__*/React__default["default"].createElement(ui_UserListItem, {
-      key: member.userId,
-      className: "sendbird-message__bottomsheet__reactor-list__item",
-      user: member,
-      avatarSize: "36px",
-      onClick: onPressUserProfileCallBack
-    });
-  }))));
+var ReactedMembersBottomSheet = function (_a) {
+    var _b, _c, _d;
+    var message = _a.message, channel = _a.channel, _e = _a.emojiKey, emojiKey = _e === void 0 ? '' : _e, hideMenu = _a.hideMenu, emojiContainer = _a.emojiContainer, onPressUserProfileHandler = _a.onPressUserProfileHandler;
+    var _f = channel.members, members = _f === void 0 ? [] : _f;
+    var _g = React.useState(emojiKey), selectedEmoji = _g[0], setSelectedEmoji = _g[1];
+    function onPressUserProfileCallBack() {
+        if (onPressUserProfileHandler && message) {
+            var sender = message === null || message === void 0 ? void 0 : message.sender;
+            onPressUserProfileHandler(sender);
+        }
+    }
+    return (React.createElement(ui_BottomSheet, { onBackdropClick: hideMenu },
+        React.createElement("div", { className: "sendbird-message__bottomsheet" },
+            React.createElement("div", { className: "sendbird-message__bottomsheet__reacted-members" }, (_b = message.reactions) === null || _b === void 0 ? void 0 : _b.map(function (reaction) {
+                var emojiUrl = index.getEmojiUrl(emojiContainer, reaction.key);
+                return (React.createElement("div", { key: reaction.key, className: "\n                  sendbird-message__bottomsheet__reacted-members__item\n                  ".concat(selectedEmoji === reaction.key ? 'sendbird-message__bottomsheet__reacted-members__item__selected' : '', "\n                "), onClick: function () {
+                        setSelectedEmoji(reaction.key);
+                    } },
+                    React.createElement(ui_ImageRenderer.default, { url: emojiUrl, width: "28px", height: "28px", placeHolder: function (style) { return (React.createElement("div", { style: style },
+                            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.QUESTION, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" }))); } }),
+                    React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.BUTTON_2, color: selectedEmoji === reaction.key ? ui_Label.LabelColors.PRIMARY : ui_Label.LabelColors.ONBACKGROUND_3 }, reaction.userIds.length)));
+            })),
+            React.createElement("div", { className: "sendbird-message__bottomsheet__reactor-list" }, // making a member list who reacted to the message with the `selectedEmoji`
+            ((_d = (_c = message.reactions) === null || _c === void 0 ? void 0 : _c.find(function (reaction) { return reaction.key === selectedEmoji; })) === null || _d === void 0 ? void 0 : _d.userIds.map(function (userId) { return members.find(function (member) { return member.userId === userId; }); }).filter(function (member) { return member !== undefined; }))
+                .map(function (member) { return (React.createElement(ui_UserListItem, { key: member.userId, className: "sendbird-message__bottomsheet__reactor-list__item", user: member, avatarSize: "36px", onClick: onPressUserProfileCallBack })); })))));
 };
 
-function ReactionItem(_a) {
-  var _b;
-  var reaction = _a.reaction,
-    memberNicknamesMap = _a.memberNicknamesMap,
-    setEmojiKey = _a.setEmojiKey,
-    toggleReaction = _a.toggleReaction,
-    emojisMap = _a.emojisMap,
-    channel = _a.channel;
-  var store = useSendbirdStateContext.useSendbirdStateContext();
-  var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
-  var messageStore = Message_context.useMessageContext();
-  var message = messageStore === null || messageStore === void 0 ? void 0 : messageStore.message;
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-  var userId = store.config.userId;
-  var reactedByMe = index.isReactedBy(userId, reaction);
-  var showHoverTooltip = reaction.userIds.length > 0 && (channel === null || channel === void 0 ? void 0 : channel.isGroupChannel()) && !channel.isSuper;
-  var handleOnClick = function () {
-    setEmojiKey('');
-    toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction(message, reaction.key, reactedByMe);
-  };
-  var longPress = useLongPress.useLongPress({
-    onLongPress: function () {
-      setEmojiKey(reaction.key);
-    },
-    onClick: handleOnClick
-  }, {
-    shouldPreventDefault: true,
-    shouldStopPropagation: true
-  });
-  return /*#__PURE__*/React__default["default"].createElement(ui_TooltipWrapper, {
-    className: "sendbird-emoji-reactions__reaction-badge",
-    hoverTooltip: showHoverTooltip ? /*#__PURE__*/React__default["default"].createElement(ui_Tooltip, null, index.getEmojiTooltipString(reaction, userId, memberNicknamesMap, stringSet)) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null)
-  }, /*#__PURE__*/React__default["default"].createElement("div", isMobile ? longPress : {
-    onClick: handleOnClick
-  }, /*#__PURE__*/React__default["default"].createElement(ui_ReactionBadge, {
-    count: reaction.userIds.length,
-    selected: reactedByMe
-  }, /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer["default"], {
-    circle: true,
-    url: ((_b = emojisMap.get(reaction === null || reaction === void 0 ? void 0 : reaction.key)) === null || _b === void 0 ? void 0 : _b.url) || '',
-    width: "20px",
-    height: "20px",
-    defaultComponent: /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-      width: "20px",
-      height: "20px",
-      type: ui_Icon.IconTypes.QUESTION
-    })
-  }))));
+function ReactionItem(_a) {
+    var _b;
+    var reaction = _a.reaction, memberNicknamesMap = _a.memberNicknamesMap, setEmojiKey = _a.setEmojiKey, toggleReaction = _a.toggleReaction, emojisMap = _a.emojisMap, channel = _a.channel;
+    var store = useSendbirdStateContext.useSendbirdStateContext();
+    var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
+    var messageStore = Message_context.useMessageContext();
+    var message = messageStore === null || messageStore === void 0 ? void 0 : messageStore.message;
+    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+    var userId = store.config.userId;
+    var reactedByMe = index.isReactedBy(userId, reaction);
+    var showHoverTooltip = (reaction.userIds.length > 0)
+        && ((channel === null || channel === void 0 ? void 0 : channel.isGroupChannel()) && !channel.isSuper);
+    var handleOnClick = function () {
+        setEmojiKey('');
+        toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction((message), reaction.key, reactedByMe);
+    };
+    var longPress = useLongPress.useLongPress({
+        onLongPress: function () {
+            setEmojiKey(reaction.key);
+        },
+        onClick: handleOnClick,
+    }, {
+        shouldPreventDefault: true,
+        shouldStopPropagation: true,
+    });
+    return (React.createElement(ui_TooltipWrapper, { className: "sendbird-emoji-reactions__reaction-badge", hoverTooltip: showHoverTooltip ? (React.createElement(ui_Tooltip, null, index.getEmojiTooltipString(reaction, userId, memberNicknamesMap, stringSet))) : React.createElement(React.Fragment, null) },
+        React.createElement("div", _tslib.__assign({}, (isMobile
+            ? longPress
+            : { onClick: handleOnClick })),
+            React.createElement(ui_ReactionBadge, { count: reaction.userIds.length, selected: reactedByMe },
+                React.createElement(ui_ImageRenderer.default, { circle: true, url: ((_b = emojisMap.get(reaction === null || reaction === void 0 ? void 0 : reaction.key)) === null || _b === void 0 ? void 0 : _b.url) || '', width: "20px", height: "20px", defaultComponent: (React.createElement(ui_Icon.default, { width: "20px", height: "20px", type: ui_Icon.IconTypes.QUESTION })) })))));
 }
 
-var AddReactionBadgeItem = function (_a) {
-  var onClick = _a.onClick;
-  var onlyClick = useLongPress.useLongPress({
-    onLongPress: function () {},
-    onClick: onClick
-  }, {
-    shouldPreventDefault: true,
-    shouldStopPropagation: true
-  });
-  return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers._extends({
-    className: "sendbird-emoji-reactions__add-reaction-badge"
-  }, onlyClick), /*#__PURE__*/React__default["default"].createElement(ui_ReactionBadge, {
-    isAdd: true
-  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-    type: ui_Icon.IconTypes.EMOJI_MORE,
-    fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
-    width: "20px",
-    height: "20px"
-  })));
+var AddReactionBadgeItem = function (_a) {
+    var onClick = _a.onClick;
+    var onlyClick = useLongPress.useLongPress({
+        onLongPress: function () { },
+        onClick: onClick,
+    }, {
+        shouldPreventDefault: true,
+        shouldStopPropagation: true,
+    });
+    return (React.createElement("div", _tslib.__assign({ className: "sendbird-emoji-reactions__add-reaction-badge" }, onlyClick),
+        React.createElement(ui_ReactionBadge, { isAdd: true },
+            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EMOJI_MORE, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "20px", height: "20px" }))));
 };
 
-var MobileEmojisBottomSheet = function (_a) {
-  var userId = _a.userId,
-    message = _a.message,
-    emojiContainer = _a.emojiContainer,
-    hideMenu = _a.hideMenu,
-    toggleReaction = _a.toggleReaction;
-  var emojiAllList = React.useMemo(function () {
-    return index.getEmojiListAll(emojiContainer);
-  }, [emojiContainer]);
-  return /*#__PURE__*/React__default["default"].createElement(ui_BottomSheet, {
-    onBackdropClick: hideMenu
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-message__bottomsheet sendbird-message__emojis-bottomsheet"
-  }, emojiAllList.map(function (emoji) {
-    var _a, _b, _c, _d;
-    var isReacted = (_d = (_c = (_b = (_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.find(function (reaction) {
-      return reaction.key === emoji.key;
-    })) === null || _b === void 0 ? void 0 : _b.userIds) === null || _c === void 0 ? void 0 : _c.some(function (reactorId) {
-      return reactorId === userId;
-    })) !== null && _d !== void 0 ? _d : false;
-    return /*#__PURE__*/React__default["default"].createElement(ui_ReactionButton, {
-      key: emoji.key,
-      width: "44px",
-      height: "44px",
-      selected: isReacted,
-      onClick: function (e) {
-        e === null || e === void 0 ? void 0 : e.stopPropagation();
-        toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction(message, emoji.key, isReacted);
-        hideMenu();
-      },
-      dataSbId: "ui_mobile_emoji_reactions_menu_".concat(emoji.key)
-    }, /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer["default"], {
-      url: emoji.url,
-      width: "38px",
-      height: "38px",
-      placeHolder: function (style) {
-        return /*#__PURE__*/React__default["default"].createElement("div", {
-          style: style
-        }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-          type: ui_Icon.IconTypes.QUESTION,
-          fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
-          width: "28px",
-          height: "28px"
-        }));
-      }
-    }));
-  })));
+var MobileEmojisBottomSheet = function (_a) {
+    var userId = _a.userId, message = _a.message, emojiContainer = _a.emojiContainer, hideMenu = _a.hideMenu, toggleReaction = _a.toggleReaction;
+    var emojiAllList = React.useMemo(function () {
+        return index.getEmojiListAll(emojiContainer);
+    }, [emojiContainer]);
+    return (React.createElement(ui_BottomSheet, { onBackdropClick: hideMenu },
+        React.createElement("div", { className: "sendbird-message__bottomsheet sendbird-message__emojis-bottomsheet" }, emojiAllList.map(function (emoji) {
+            var _a, _b, _c, _d;
+            var isReacted = (_d = ((_c = (_b = (_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.find(function (reaction) { return reaction.key === emoji.key; })) === null || _b === void 0 ? void 0 : _b.userIds) === null || _c === void 0 ? void 0 : _c.some(function (reactorId) { return reactorId === userId; }))) !== null && _d !== void 0 ? _d : false;
+            return (React.createElement(ui_ReactionButton, { key: emoji.key, width: "44px", height: "44px", selected: isReacted, onClick: function (e) {
+                    e === null || e === void 0 ? void 0 : e.stopPropagation();
+                    toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction(message, emoji.key, isReacted);
+                    hideMenu();
+                }, dataSbId: "ui_mobile_emoji_reactions_menu_".concat(emoji.key) },
+                React.createElement(ui_ImageRenderer.default, { url: emoji.url, width: "38px", height: "38px", placeHolder: function (style) { return (React.createElement("div", { style: style },
+                        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.QUESTION, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" }))); } })));
+        }))));
 };
 
-var EmojiReactions = function (_a) {
-  var _b, _c, _d, _e, _f;
-  var _g = _a.className,
-    className = _g === void 0 ? '' : _g,
-    userId = _a.userId,
-    message = _a.message,
-    channel = _a.channel,
-    emojiContainer = _a.emojiContainer,
-    memberNicknamesMap = _a.memberNicknamesMap,
-    _h = _a.spaceFromTrigger,
-    spaceFromTrigger = _h === void 0 ? {
-      x: 0,
-      y: 0
-    } : _h,
-    _j = _a.isByMe,
-    isByMe = _j === void 0 ? false : _j,
-    toggleReaction = _a.toggleReaction,
-    onPressUserProfile = _a.onPressUserProfile;
-  var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
-  var addReactionRef = React.useRef(null);
-  var _k = React.useState(false),
-    showEmojiList = _k[0],
-    setShowEmojiList = _k[1];
-  var _l = React.useState(''),
-    selectedEmojiKey = _l[0],
-    setSelectedEmojiKey = _l[1];
-  var emojisMap = index.getEmojiMapAll(emojiContainer);
-  var showAddReactionBadge = ((_c = (_b = message.reactions) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0) < emojisMap.size;
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: index.getClassName([className, 'sendbird-emoji-reactions', isByMe ? 'outgoing' : 'incoming'])
-  }, ((_e = (_d = message.reactions) === null || _d === void 0 ? void 0 : _d.length) !== null && _e !== void 0 ? _e : 0) > 0 && ((_f = message.reactions) === null || _f === void 0 ? void 0 : _f.map(function (reaction) {
-    return /*#__PURE__*/React__default["default"].createElement(ReactionItem, {
-      key: reaction === null || reaction === void 0 ? void 0 : reaction.key,
-      reaction: reaction,
-      memberNicknamesMap: memberNicknamesMap,
-      setEmojiKey: setSelectedEmojiKey,
-      toggleReaction: toggleReaction,
-      emojisMap: emojisMap,
-      channel: channel
-    });
-  })), !isMobile && showAddReactionBadge && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
-    menuTrigger: function (toggleDropdown) {
-      return /*#__PURE__*/React__default["default"].createElement(ui_ReactionBadge, {
-        className: "sendbird-emoji-reactions__add-reaction-badge",
-        ref: addReactionRef,
-        isAdd: true,
-        onClick: function (e) {
-          var _a;
-          toggleDropdown();
-          (_a = e === null || e === void 0 ? void 0 : e.stopPropagation) === null || _a === void 0 ? void 0 : _a.call(e);
-        }
-      }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-        type: ui_Icon.IconTypes.EMOJI_MORE,
-        fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
-        width: "20px",
-        height: "20px"
-      }));
-    },
-    menuItems: function (closeDropdown) {
-      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.EmojiListItems, {
-        parentRef: addReactionRef,
-        parentContainRef: addReactionRef,
-        closeDropdown: closeDropdown,
-        spaceFromTrigger: spaceFromTrigger
-      }, index.getEmojiListAll(emojiContainer).map(function (emoji) {
-        var _a, _b, _c;
-        var isReacted = ((_c = (_b = (_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.find(function (reaction) {
-          return reaction.key === emoji.key;
-        })) === null || _b === void 0 ? void 0 : _b.userIds) === null || _c === void 0 ? void 0 : _c.some(function (reactorId) {
-          return reactorId === userId;
-        })) || false;
-        return /*#__PURE__*/React__default["default"].createElement(ui_ReactionButton, {
-          key: emoji.key,
-          width: "36px",
-          height: "36px",
-          selected: isReacted,
-          onClick: function (e) {
-            closeDropdown();
-            toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction(message, emoji.key, isReacted);
-            e === null || e === void 0 ? void 0 : e.stopPropagation();
-          },
-          dataSbId: "ui_emoji_reactions_menu_".concat(emoji.key)
-        }, /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer["default"], {
-          url: (emoji === null || emoji === void 0 ? void 0 : emoji.url) || '',
-          width: "28px",
-          height: "28px",
-          placeHolder: function (style) {
-            return /*#__PURE__*/React__default["default"].createElement("div", {
-              style: style
-            }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-              type: ui_Icon.IconTypes.QUESTION,
-              fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
-              width: "28px",
-              height: "28px"
-            }));
-          }
-        }));
-      }));
-    }
-  }), isMobile && showAddReactionBadge && /*#__PURE__*/React__default["default"].createElement(AddReactionBadgeItem, {
-    onClick: function () {
-      setShowEmojiList(true);
-    }
-  }), isMobile && showEmojiList && /*#__PURE__*/React__default["default"].createElement(MobileEmojisBottomSheet, {
-    userId: userId,
-    message: message,
-    emojiContainer: emojiContainer,
-    hideMenu: function () {
-      setShowEmojiList(false);
-    },
-    toggleReaction: toggleReaction
-  }), isMobile && selectedEmojiKey && channel !== null && /*#__PURE__*/React__default["default"].createElement(ReactedMembersBottomSheet, {
-    message: message,
-    channel: channel,
-    emojiKey: selectedEmojiKey,
-    hideMenu: function () {
-      setSelectedEmojiKey('');
-    },
-    emojiContainer: emojiContainer,
-    onPressUserProfileHandler: onPressUserProfile
-  }));
+var EmojiReactions = function (_a) {
+    var _b, _c, _d, _e, _f;
+    var _g = _a.className, className = _g === void 0 ? '' : _g, userId = _a.userId, message = _a.message, channel = _a.channel, emojiContainer = _a.emojiContainer, memberNicknamesMap = _a.memberNicknamesMap, _h = _a.spaceFromTrigger, spaceFromTrigger = _h === void 0 ? { x: 0, y: 0 } : _h, _j = _a.isByMe, isByMe = _j === void 0 ? false : _j, toggleReaction = _a.toggleReaction, onPressUserProfile = _a.onPressUserProfile;
+    var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
+    var addReactionRef = React.useRef(null);
+    var _k = React.useState(false), showEmojiList = _k[0], setShowEmojiList = _k[1];
+    var _l = React.useState(''), selectedEmojiKey = _l[0], setSelectedEmojiKey = _l[1];
+    var emojisMap = index.getEmojiMapAll(emojiContainer);
+    var showAddReactionBadge = ((_c = (_b = message.reactions) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0) < emojisMap.size;
+    return (React.createElement("div", { className: index.getClassName([
+            className, 'sendbird-emoji-reactions',
+            isByMe ? 'outgoing' : 'incoming',
+        ]) },
+        (((_e = (_d = message.reactions) === null || _d === void 0 ? void 0 : _d.length) !== null && _e !== void 0 ? _e : 0) > 0) && ((_f = message.reactions) === null || _f === void 0 ? void 0 : _f.map(function (reaction) {
+            return (React.createElement(ReactionItem, { key: reaction === null || reaction === void 0 ? void 0 : reaction.key, reaction: reaction, memberNicknamesMap: memberNicknamesMap, setEmojiKey: setSelectedEmojiKey, toggleReaction: toggleReaction, emojisMap: emojisMap, channel: channel }));
+        })),
+        (!isMobile && showAddReactionBadge) && (React.createElement(ui_ContextMenu.default, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_ReactionBadge, { className: "sendbird-emoji-reactions__add-reaction-badge", ref: addReactionRef, isAdd: true, onClick: function (e) {
+                    var _a;
+                    toggleDropdown();
+                    (_a = e === null || e === void 0 ? void 0 : e.stopPropagation) === null || _a === void 0 ? void 0 : _a.call(e);
+                } },
+                React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EMOJI_MORE, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "20px", height: "20px" }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.EmojiListItems, { parentRef: addReactionRef, parentContainRef: addReactionRef, closeDropdown: closeDropdown, spaceFromTrigger: spaceFromTrigger }, index.getEmojiListAll(emojiContainer).map(function (emoji) {
+                var _a, _b, _c;
+                var isReacted = ((_c = (_b = (_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.find(function (reaction) { return reaction.key === emoji.key; })) === null || _b === void 0 ? void 0 : _b.userIds) === null || _c === void 0 ? void 0 : _c.some(function (reactorId) { return reactorId === userId; })) || false;
+                return (React.createElement(ui_ReactionButton, { key: emoji.key, width: "36px", height: "36px", selected: isReacted, onClick: function (e) {
+                        closeDropdown();
+                        toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction(message, emoji.key, isReacted);
+                        e === null || e === void 0 ? void 0 : e.stopPropagation();
+                    }, dataSbId: "ui_emoji_reactions_menu_".concat(emoji.key) },
+                    React.createElement(ui_ImageRenderer.default, { url: (emoji === null || emoji === void 0 ? void 0 : emoji.url) || '', width: "28px", height: "28px", placeHolder: function (style) { return (React.createElement("div", { style: style },
+                            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.QUESTION, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" }))); } })));
+            }))); } })),
+        (isMobile && showAddReactionBadge) && (React.createElement(AddReactionBadgeItem, { onClick: function () {
+                setShowEmojiList(true);
+            } })),
+        (isMobile && showEmojiList) && (React.createElement(MobileEmojisBottomSheet, { userId: userId, message: message, emojiContainer: emojiContainer, hideMenu: function () {
+                setShowEmojiList(false);
+            }, toggleReaction: toggleReaction })),
+        (isMobile && selectedEmojiKey && channel !== null) && (React.createElement(ReactedMembersBottomSheet, { message: message, channel: channel, emojiKey: selectedEmojiKey, hideMenu: function () {
+                setSelectedEmojiKey('');
+            }, emojiContainer: emojiContainer, onPressUserProfileHandler: onPressUserProfile }))));
 };
 
 module.exports = EmojiReactions;

package/cjs/ui/EmojiReactions.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiReactions.js","sources":["../../../src/ui/MobileMenu/ReactedMembersBottomSheet.tsx","../../../src/ui/EmojiReactions/ReactionItem.tsx","../../../src/ui/EmojiReactions/AddReactionBadgeItem.tsx","../../../src/ui/MobileMenu/MobileEmojisBottomSheet.tsx","../../../src/ui/EmojiReactions/index.tsx"],"sourcesContent":["import React, { ReactElement, useState } from 'react';\nimport { EmojiContainer, User } from '@sendbird/chat';\nimport { GroupChannel, Member } from '@sendbird/chat/groupChannel';\nimport { Reaction } from '@sendbird/chat/message';\n\nimport './mobile-menu-reacted-members.scss';\n\nimport BottomSheet from '../BottomSheet';\nimport { getEmojiUrl, SendableMessageType } from '../../utils';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport Label, { LabelColors, LabelTypography } from '../Label';\nimport UserListItem from '../UserListItem';\n\nexport interface ReactedMembersBottomSheetProps {\n  message: SendableMessageType;\n  channel: GroupChannel;\n  emojiKey: string;\n  hideMenu: () => void;\n  emojiContainer?: EmojiContainer;\n  onPressUserProfileHandler?: (member: User) => void;\n}\n\nexport const ReactedMembersBottomSheet = ({\n  message,\n  channel,\n  emojiKey = '',\n  hideMenu,\n  emojiContainer,\n  onPressUserProfileHandler,\n}: ReactedMembersBottomSheetProps): ReactElement => {\n  const { members = [] } = channel;\n  const [selectedEmoji, setSelectedEmoji] = useState(emojiKey);\n\n  function onPressUserProfileCallBack() {\n    if (onPressUserProfileHandler && message) {\n      const sender = (message as SendableMessageType)?.sender;\n      onPressUserProfileHandler(sender);\n    }\n  }\n\n  return (\n    <BottomSheet onBackdropClick={hideMenu}>\n      <div className=\"sendbird-message__bottomsheet\">\n        <div className=\"sendbird-message__bottomsheet__reacted-members\">\n          {message.reactions?.map((reaction: Reaction): ReactElement => {\n            const emojiUrl = getEmojiUrl(emojiContainer, reaction.key);\n            return (\n              <div\n                key={reaction.key}\n                className={`\n                  sendbird-message__bottomsheet__reacted-members__item\n                  ${selectedEmoji === reaction.key ? 'sendbird-message__bottomsheet__reacted-members__item__selected' : ''}\n                `}\n                onClick={() => {\n                  setSelectedEmoji(reaction.key);\n                }}\n              >\n                <ImageRenderer\n                  url={emojiUrl}\n                  width=\"28px\"\n                  height=\"28px\"\n                  placeHolder={(style) => (\n                    <div style={style}>\n                      <Icon\n                        type={IconTypes.QUESTION}\n                        fillColor={IconColors.ON_BACKGROUND_3}\n                        width=\"28px\"\n                        height=\"28px\"\n                      />\n                    </div>\n                  )}\n                />\n                <Label\n                  type={LabelTypography.BUTTON_2}\n                  color={selectedEmoji === reaction.key ? LabelColors.PRIMARY : LabelColors.ONBACKGROUND_3}\n                >\n                  {reaction.userIds.length}\n                </Label>\n              </div>\n            );\n          })}\n        </div>\n        <div className=\"sendbird-message__bottomsheet__reactor-list\">\n          { // making a member list who reacted to the message with the `selectedEmoji`\n            (\n              message.reactions?.find(reaction => reaction.key === selectedEmoji)\n                ?.userIds.map((userId) => members.find((member) => member.userId === userId))\n                .filter((member) => member !== undefined) as Array<Member>\n            )\n              .map((member) => (\n                <UserListItem\n                  key={member.userId}\n                  className=\"sendbird-message__bottomsheet__reactor-list__item\"\n                  user={member}\n                  avatarSize=\"36px\"\n                  onClick={onPressUserProfileCallBack}\n                />\n              ))\n          }\n        </div>\n      </div>\n    </BottomSheet>\n  );\n};\n","import React, { useContext } from 'react';\n\nimport { Emoji } from '@sendbird/chat';\nimport { GroupChannel } from '@sendbird/chat/groupChannel';\nimport { OpenChannel } from '@sendbird/chat/openChannel';\nimport { Reaction, UserMessage } from '@sendbird/chat/message';\n\nimport Tooltip from '../Tooltip';\nimport TooltipWrapper from '../TooltipWrapper';\nimport ReactionBadge from '../ReactionBadge';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes } from '../Icon';\n\nimport { Nullable } from '../../types';\nimport { getEmojiTooltipString, isReactedBy, SendableMessageType } from '../../utils';\nimport { useMediaQueryContext } from '../../lib/MediaQueryContext';\nimport useLongPress from '../../hooks/useLongPress';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport useSendbirdStateContext from '../../hooks/useSendbirdStateContext';\nimport { useMessageContext } from '../../modules/Message/context/MessageProvider';\n\ntype Props = {\n  reaction: Reaction;\n  memberNicknamesMap: Map<string, string>;\n  setEmojiKey: React.Dispatch<React.SetStateAction<string>>;\n  toggleReaction?: (message: SendableMessageType, key: string, byMe: boolean) => void;\n  emojisMap: Map<string, Emoji>;\n  channel: Nullable<GroupChannel | OpenChannel>;\n};\n\nexport default function ReactionItem({\n  reaction,\n  memberNicknamesMap,\n  setEmojiKey,\n  toggleReaction,\n  emojisMap,\n  channel,\n}: Props) {\n  const store = useSendbirdStateContext();\n  const { isMobile } = useMediaQueryContext();\n  const messageStore = useMessageContext();\n  const message = messageStore?.message as UserMessage;\n  const { stringSet } = useContext(LocalizationContext);\n\n  const userId = store.config.userId;\n  const reactedByMe = isReactedBy(userId, reaction);\n  const showHoverTooltip = (reaction.userIds.length > 0)\n    && (channel?.isGroupChannel() && !channel.isSuper);\n\n  const handleOnClick = () => {\n    setEmojiKey('');\n    toggleReaction?.((message), reaction.key, reactedByMe);\n  };\n  const longPress = useLongPress({\n    onLongPress: () => {\n      setEmojiKey(reaction.key);\n    },\n    onClick: handleOnClick,\n  }, {\n    shouldPreventDefault: true,\n    shouldStopPropagation: true,\n  });\n\n  return (\n    <TooltipWrapper\n      className=\"sendbird-emoji-reactions__reaction-badge\"\n      hoverTooltip={showHoverTooltip ? (\n        <Tooltip>\n          {getEmojiTooltipString(reaction, userId, memberNicknamesMap, stringSet)}\n        </Tooltip>\n      ) : <></>}\n    >\n      <div\n        {...(\n          isMobile\n            ? longPress\n            : { onClick: handleOnClick }\n        )}\n      >\n        <ReactionBadge\n          count={reaction.userIds.length}\n          selected={reactedByMe}\n        >\n          <ImageRenderer\n            circle\n            url={emojisMap.get(reaction?.key)?.url || ''}\n            width=\"20px\"\n            height=\"20px\"\n            defaultComponent={(\n              <Icon width=\"20px\" height=\"20px\" type={IconTypes.QUESTION} />\n            )}\n          />\n        </ReactionBadge>\n      </div>\n    </TooltipWrapper>\n  );\n}\n","import React, {\n  KeyboardEvent,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport ReactionBadge from '../ReactionBadge';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport useLongPress from '../../hooks/useLongPress';\n\nexport interface AddReactionBadgeItemProps {\n  onClick: (e: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement> | TouchEvent<HTMLDivElement>) => void;\n}\n\nexport const AddReactionBadgeItem = ({\n  onClick,\n}: AddReactionBadgeItemProps): React.ReactElement => {\n  const onlyClick = useLongPress({\n    onLongPress: () => { /* noop */ },\n    onClick,\n  }, {\n    shouldPreventDefault: true,\n    shouldStopPropagation: true,\n  });\n\n  return (\n    <div\n      className=\"sendbird-emoji-reactions__add-reaction-badge\"\n      {...onlyClick}\n    >\n      <ReactionBadge\n        isAdd\n      >\n        <Icon\n          type={IconTypes.EMOJI_MORE}\n          fillColor={IconColors.ON_BACKGROUND_3}\n          width=\"20px\"\n          height=\"20px\"\n        />\n      </ReactionBadge>\n    </div>\n  );\n};\n","import React, { ReactElement, useMemo } from 'react';\nimport { EmojiContainer } from '@sendbird/chat';\nimport { Reaction } from '@sendbird/chat/message';\n\nimport BottomSheet from '../BottomSheet';\nimport { getEmojiListAll, SendableMessageType } from '../../utils';\nimport ReactionButton from '../ReactionButton';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconColors, IconTypes } from '../Icon';\n\nexport interface MobileEmojisBottomSheetProps {\n  userId: string;\n  message: SendableMessageType;\n  emojiContainer: EmojiContainer;\n  hideMenu: () => void;\n  toggleReaction?: (message: SendableMessageType, key: string, byMe: boolean) => void;\n}\n\nexport const MobileEmojisBottomSheet = ({\n  userId,\n  message,\n  emojiContainer,\n  hideMenu,\n  toggleReaction,\n}: MobileEmojisBottomSheetProps): ReactElement => {\n  const emojiAllList = useMemo(() => {\n    return getEmojiListAll(emojiContainer);\n  }, [emojiContainer]);\n  return (\n    <BottomSheet onBackdropClick={hideMenu}>\n      <div className=\"sendbird-message__bottomsheet sendbird-message__emojis-bottomsheet\">\n        {emojiAllList.map((emoji) => {\n          const isReacted: boolean = (message?.reactions\n            ?.find((reaction: Reaction): boolean => reaction.key === emoji.key)?.userIds\n            ?.some((reactorId: string): boolean => reactorId === userId)) ?? false;\n          return (\n            <ReactionButton\n              key={emoji.key}\n              width=\"44px\"\n              height=\"44px\"\n              selected={isReacted}\n              onClick={(e) => {\n                e?.stopPropagation();\n                toggleReaction?.(message, emoji.key, isReacted);\n                hideMenu();\n              }}\n              dataSbId={`ui_mobile_emoji_reactions_menu_${emoji.key}`}\n            >\n              <ImageRenderer\n                url={emoji.url}\n                width=\"38px\"\n                height=\"38px\"\n                placeHolder={(style: Record<string, unknown>): ReactElement => (\n                  <div style={style}>\n                    <Icon\n                      type={IconTypes.QUESTION}\n                      fillColor={IconColors.ON_BACKGROUND_3}\n                      width=\"28px\"\n                      height=\"28px\"\n                    />\n                  </div>\n                )}\n              />\n            </ReactionButton>\n          );\n        })}\n      </div>\n    </BottomSheet>\n  );\n};\n","import './index.scss';\nimport React, { ReactElement, useRef, useState } from 'react';\nimport type { Emoji, EmojiContainer } from '@sendbird/chat';\nimport type { Reaction } from '@sendbird/chat/message';\nimport type { GroupChannel } from '@sendbird/chat/groupChannel';\n\nimport ReactionBadge from '../ReactionBadge';\nimport ReactionButton from '../ReactionButton';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ContextMenu, { EmojiListItems } from '../ContextMenu';\nimport { Nullable, SpaceFromTriggerType } from '../../types';\n\nimport { getClassName, getEmojiListAll, getEmojiMapAll, SendableMessageType } from '../../utils';\nimport { ReactedMembersBottomSheet } from '../MobileMenu/ReactedMembersBottomSheet';\nimport ReactionItem from './ReactionItem';\nimport { useMediaQueryContext } from '../../lib/MediaQueryContext';\nimport { AddReactionBadgeItem } from './AddReactionBadgeItem';\nimport { MobileEmojisBottomSheet } from '../MobileMenu/MobileEmojisBottomSheet';\nimport { User } from '@sendbird/chat';\n\ninterface Props {\n  className?: string | Array<string>;\n  userId: string;\n  message: SendableMessageType;\n  channel: Nullable<GroupChannel>;\n  emojiContainer: EmojiContainer;\n  memberNicknamesMap: Map<string, string>;\n  spaceFromTrigger?: SpaceFromTriggerType;\n  isByMe?: boolean;\n  toggleReaction?: (message: SendableMessageType, key: string, byMe: boolean) => void;\n  onPressUserProfile?: (member: User) => void;\n}\n\nconst EmojiReactions = ({\n  className = '',\n  userId,\n  message,\n  channel,\n  emojiContainer,\n  memberNicknamesMap,\n  spaceFromTrigger = { x: 0, y: 0 },\n  isByMe = false,\n  toggleReaction,\n  onPressUserProfile,\n}: Props): ReactElement => {\n  const { isMobile } = useMediaQueryContext();\n  const addReactionRef = useRef(null);\n  const [showEmojiList, setShowEmojiList] = useState(false);\n  const [selectedEmojiKey, setSelectedEmojiKey] = useState('');\n\n  const emojisMap = getEmojiMapAll(emojiContainer);\n  const showAddReactionBadge = (message.reactions?.length ?? 0) < emojisMap.size;\n\n  return (\n    <div className={getClassName([\n      className, 'sendbird-emoji-reactions',\n      isByMe ? 'outgoing' : 'incoming',\n    ])}>\n      {((message.reactions?.length ?? 0) > 0) && (\n        message.reactions?.map((reaction: Reaction): ReactElement => {\n          return (\n            <ReactionItem\n              key={reaction?.key}\n              reaction={reaction}\n              memberNicknamesMap={memberNicknamesMap}\n              setEmojiKey={setSelectedEmojiKey}\n              toggleReaction={toggleReaction}\n              emojisMap={emojisMap}\n              channel={channel}\n            />\n          );\n        })\n      )}\n      {(!isMobile && showAddReactionBadge) && (\n        <ContextMenu\n          menuTrigger={(toggleDropdown: () => void): ReactElement => (\n            <ReactionBadge\n              className=\"sendbird-emoji-reactions__add-reaction-badge\"\n              ref={addReactionRef}\n              isAdd\n              onClick={(e) => {\n                toggleDropdown();\n                e?.stopPropagation?.();\n              }}\n            >\n              <Icon\n                type={IconTypes.EMOJI_MORE}\n                fillColor={IconColors.ON_BACKGROUND_3}\n                width=\"20px\"\n                height=\"20px\"\n              />\n            </ReactionBadge>\n          )}\n          menuItems={(closeDropdown: () => void): ReactElement => (\n            <EmojiListItems\n              parentRef={addReactionRef}\n              parentContainRef={addReactionRef}\n              closeDropdown={closeDropdown}\n              spaceFromTrigger={spaceFromTrigger}\n            >\n              {getEmojiListAll(emojiContainer).map((emoji: Emoji): ReactElement => {\n                const isReacted: boolean = (message?.reactions\n                  ?.find((reaction: Reaction): boolean => reaction.key === emoji.key)?.userIds\n                  ?.some((reactorId: string): boolean => reactorId === userId)) || false;\n                return (\n                  <ReactionButton\n                    key={emoji.key}\n                    width=\"36px\"\n                    height=\"36px\"\n                    selected={isReacted}\n                    onClick={(e): void => {\n                      closeDropdown();\n                      toggleReaction?.(message, emoji.key, isReacted);\n                      e?.stopPropagation();\n                    }}\n                    dataSbId={`ui_emoji_reactions_menu_${emoji.key}`}\n                  >\n                    <ImageRenderer\n                      url={emoji?.url || ''}\n                      width=\"28px\"\n                      height=\"28px\"\n                      placeHolder={(style: Record<string, unknown>): ReactElement => (\n                        <div style={style}>\n                          <Icon\n                            type={IconTypes.QUESTION}\n                            fillColor={IconColors.ON_BACKGROUND_3}\n                            width=\"28px\"\n                            height=\"28px\"\n                          />\n                        </div>\n                      )}\n                    />\n                  </ReactionButton>\n                );\n              })}\n            </EmojiListItems>\n          )}\n        />\n      )}\n      {(isMobile && showAddReactionBadge) && (\n        <AddReactionBadgeItem\n          onClick={() => {\n            setShowEmojiList(true);\n          }}\n        />\n      )}\n      {(isMobile && showEmojiList) && (\n        <MobileEmojisBottomSheet\n          userId={userId}\n          message={message}\n          emojiContainer={emojiContainer}\n          hideMenu={() => {\n            setShowEmojiList(false);\n          }}\n          toggleReaction={toggleReaction}\n        />\n      )}\n      {(isMobile && selectedEmojiKey && channel !== null) && (\n        <ReactedMembersBottomSheet\n          message={message}\n          channel={channel}\n          emojiKey={selectedEmojiKey}\n          hideMenu={() => {\n            setSelectedEmojiKey('');\n          }}\n          emojiContainer={emojiContainer}\n          onPressUserProfileHandler={onPressUserProfile}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default EmojiReactions;\n"],"names":["ReactedMembersBottomSheet","_a","message","channel","_e","emojiKey","hideMenu","emojiContainer","onPressUserProfileHandler","_f","members","_g","useState","selectedEmoji","setSelectedEmoji","onPressUserProfileCallBack","sender","React","createElement","BottomSheet","onBackdropClick","className","_b","reactions","map","reaction","emojiUrl","getEmojiUrl","key","concat","onClick","ImageRenderer","url","width","height","placeHolder","style","Icon","type","IconTypes","QUESTION","fillColor","IconColors","ON_BACKGROUND_3","Label","LabelTypography","BUTTON_2","color","LabelColors","PRIMARY","ONBACKGROUND_3","userIds","length","_d","_c","find","userId","member","filter","undefined","UserListItem","user","avatarSize","ReactionItem","memberNicknamesMap","setEmojiKey","toggleReaction","emojisMap","store","useSendbirdStateContext","isMobile","useMediaQueryContext","messageStore","useMessageContext","stringSet","useContext","LocalizationContext","config","reactedByMe","isReactedBy","showHoverTooltip","isGroupChannel","isSuper","handleOnClick","longPress","useLongPress","onLongPress","shouldPreventDefault","shouldStopPropagation","TooltipWrapper","hoverTooltip","Tooltip","getEmojiTooltipString","Fragment","ReactionBadge","count","selected","circle","get","defaultComponent","AddReactionBadgeItem","onlyClick","_extends","isAdd","EMOJI_MORE","MobileEmojisBottomSheet","emojiAllList","useMemo","getEmojiListAll","emoji","isReacted","some","reactorId","ReactionButton","e","stopPropagation","dataSbId","EmojiReactions","_h","spaceFromTrigger","x","y","_j","isByMe","onPressUserProfile","addReactionRef","useRef","_k","showEmojiList","setShowEmojiList","_l","selectedEmojiKey","setSelectedEmojiKey","getEmojiMapAll","showAddReactionBadge","size","getClassName","ContextMenu","menuTrigger","toggleDropdown","ref","menuItems","closeDropdown","EmojiListItems","parentRef","parentContainRef"],"mappings":"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"}
+{"version":3,"file":"EmojiReactions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}