@sendbird/uikit-react 3.14.3-rc.1 → 3.14.4

package/cjs/ui/MessageInput.js.map

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

package/cjs/ui/MessageItemMenu.js

@@ -2,151 +2,151 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _tslib = require('../chunks/bundle-BwzMNAFs.js');
+var _tslib = require('../chunks/bundle-HGbi-rCv.js');
 var React = require('react');
 var ui_ContextMenu = require('./ContextMenu.js');
 var ui_Icon = require('./Icon.js');
 var ui_IconButton = require('./IconButton.js');
-var index = require('../chunks/bundle-BTEk9dhT.js');
-var LocalizationContext = require('../chunks/bundle-Cg6exdly.js');
-var types = require('../chunks/bundle-B5nh0Mif.js');
-var utils = require('../chunks/bundle-_VH8bxGE.js');
+var index = require('../chunks/bundle-wl1uuzU7.js');
+var LocalizationContext = require('../chunks/bundle-oeWNUdCB.js');
+var types = require('../chunks/bundle-BaAUvjl9.js');
+var utils = require('../chunks/bundle-BoLhr7Ko.js');
+require('../chunks/bundle-BTU876jx.js');
 require('react-dom');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
 require('./SortByRow.js');
-require('../chunks/bundle-B0Cl8cKp.js');
-require('../chunks/bundle-Cm_quRwQ.js');
-require('../chunks/bundle-DXrpp6AJ.js');
+require('../chunks/bundle-1XtsxT8L.js');
+require('../chunks/bundle-5_kPn4wU.js');
+require('../chunks/bundle-gtkPlUrw.js');
 require('@sendbird/chat/groupChannel');
 require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-CN-HA7zS.js');
-require('../chunks/bundle-XPPVGabQ.js');
+require('../chunks/bundle-BWGOXLHb.js');
 
-function MessageMenu(props) {
-    var _a;
-    var className = props.className, message = props.message, channel = props.channel, _b = props.isByMe, isByMe = _b === void 0 ? false : _b, _c = props.disabled, disabled = _c === void 0 ? false : _c, replyType = props.replyType, _d = props.disableDeleteMessage, disableDeleteMessage = _d === void 0 ? null : _d, showEdit = props.showEdit, showRemove = props.showRemove, deleteMessage = props.deleteMessage, resendMessage = props.resendMessage, setQuoteMessage = props.setQuoteMessage, setSupposedHover = props.setSupposedHover, onReplyInThread = props.onReplyInThread, _e = props.onMoveToParentMessage, onMoveToParentMessage = _e === void 0 ? null : _e;
-    var _f = utils.deleteNullish(props).renderMenuItem, renderMenuItem = _f === void 0 ? function (props) { return React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props), props.text); } : _f;
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var triggerRef = React.useRef(null);
-    var containerRef = React.useRef(null);
-    var showMenuItemCopy = index.isUserMessage(message);
-    var showMenuItemEdit = (!(channel === null || channel === void 0 ? void 0 : channel.isEphemeral) && index.isUserMessage(message) && index.isSentMessage(message) && isByMe);
-    var showMenuItemResend = (index.isFailedMessage(message) && (message === null || message === void 0 ? void 0 : message.isResendable) && isByMe);
-    var showMenuItemDelete = !(channel === null || channel === void 0 ? void 0 : channel.isEphemeral) && !index.isPendingMessage(message) && isByMe;
-    var showMenuItemOpenInChannel = onMoveToParentMessage !== null;
-    /**
-     * TODO: Manage timing issue
-     * User delete pending message -> Sending message success
-     */
-    var isReplyTypeEnabled = !index.isFailedMessage(message)
-        && !index.isPendingMessage(message)
-        && (((_a = channel === null || channel === void 0 ? void 0 : channel.isGroupChannel) === null || _a === void 0 ? void 0 : _a.call(channel))
-            && !(channel === null || channel === void 0 ? void 0 : channel.isEphemeral)
-            && (((channel === null || channel === void 0 ? void 0 : channel.isBroadcast) && (channel === null || channel === void 0 ? void 0 : channel.myRole) === types.Role.OPERATOR)
-                || !(channel === null || channel === void 0 ? void 0 : channel.isBroadcast)));
-    var showMenuItemReply = isReplyTypeEnabled && replyType === 'QUOTE_REPLY';
-    var showMenuItemThread = isReplyTypeEnabled && replyType === 'THREAD' && !(message === null || message === void 0 ? void 0 : message.parentMessageId) && onReplyInThread;
-    if (!(showMenuItemCopy
-        || showMenuItemReply
-        || showMenuItemThread
-        || showMenuItemOpenInChannel
-        || showMenuItemEdit
-        || showMenuItemResend
-        || showMenuItemDelete)) {
-        return null;
-    }
-    return (React.createElement("div", { className: index.getClassName([className, 'sendbird-message-item-menu']), ref: containerRef },
-        React.createElement(ui_ContextMenu.default, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-message-item-menu__trigger", ref: triggerRef, width: "32px", height: "32px", onClick: function () {
-                    toggleDropdown();
-                    setSupposedHover(true);
-                }, onBlur: function () {
-                    setSupposedHover(false);
-                } },
-                React.createElement(ui_Icon.default, { className: "sendbird-message-item-menu__trigger__icon", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE, width: "24px", height: "24px" }))); }, menuItems: function (close) {
-                var _a;
-                var closeDropdown = function () {
-                    close();
-                    setSupposedHover(false);
-                };
-                return (React.createElement(ui_ContextMenu.MenuItems, { className: "sendbird-message-item-menu__list", parentRef: triggerRef, parentContainRef: containerRef, closeDropdown: closeDropdown, openLeft: isByMe },
-                    showMenuItemCopy && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-copy',
-                        onClick: function () {
-                            index.copyToClipboard(message === null || message === void 0 ? void 0 : message.message);
-                            closeDropdown();
-                        },
-                        dataSbId: 'ui_message_item_menu_copy',
-                        text: stringSet.MESSAGE_MENU__COPY,
-                    })),
-                    showMenuItemReply && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-reply',
-                        onClick: function () {
-                            setQuoteMessage(message);
-                            closeDropdown();
-                        },
-                        disable: (message === null || message === void 0 ? void 0 : message.parentMessageId) > 0,
-                        dataSbId: 'ui_message_item_menu_reply',
-                        text: stringSet.MESSAGE_MENU__REPLY,
-                    })),
-                    showMenuItemThread && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-thread',
-                        onClick: function () {
-                            onReplyInThread === null || onReplyInThread === void 0 ? void 0 : onReplyInThread({ message: message });
-                            closeDropdown();
-                        },
-                        dataSbId: 'ui_message_item_menu_thread',
-                        text: stringSet.MESSAGE_MENU__THREAD,
-                    })),
-                    showMenuItemOpenInChannel && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-open-channel',
-                        onClick: function () {
-                            onMoveToParentMessage === null || onMoveToParentMessage === void 0 ? void 0 : onMoveToParentMessage();
-                            closeDropdown();
-                        },
-                        dataSbId: 'ui_message_item_menu_open_in_channel',
-                        text: stringSet.MESSAGE_MENU__OPEN_IN_CHANNEL,
-                    })),
-                    showMenuItemEdit && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-edit',
-                        onClick: function () {
-                            if (!disabled) {
-                                showEdit(true);
-                                closeDropdown();
-                            }
-                        },
-                        dataSbId: 'ui_message_item_menu_edit',
-                        text: stringSet.MESSAGE_MENU__EDIT,
-                    })),
-                    showMenuItemResend && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-resend',
-                        onClick: function () {
-                            if (!disabled) {
-                                resendMessage(message);
-                                closeDropdown();
-                            }
-                        },
-                        dataSbId: 'ui_message_item_menu_resend',
-                        text: stringSet.MESSAGE_MENU__RESEND,
-                    })),
-                    showMenuItemDelete && (renderMenuItem({
-                        className: 'sendbird-message-item-menu__list__menu-item menu-item-delete',
-                        onClick: function () {
-                            if (index.isFailedMessage(message)) {
-                                deleteMessage === null || deleteMessage === void 0 ? void 0 : deleteMessage(message);
-                            }
-                            else if (!disabled) {
-                                showRemove(true);
-                                closeDropdown();
-                            }
-                        },
-                        disable: (typeof disableDeleteMessage === 'boolean'
-                            ? disableDeleteMessage
-                            : ((_a = message === null || message === void 0 ? void 0 : message.threadInfo) === null || _a === void 0 ? void 0 : _a.replyCount) > 0),
-                        dataSbId: 'ui_message_item_menu_delete',
-                        text: stringSet.MESSAGE_MENU__DELETE,
-                    }))));
-            } })));
+function MessageMenu(props) {
+    var _a;
+    var className = props.className, message = props.message, channel = props.channel, _b = props.isByMe, isByMe = _b === void 0 ? false : _b, _c = props.disabled, disabled = _c === void 0 ? false : _c, replyType = props.replyType, _d = props.disableDeleteMessage, disableDeleteMessage = _d === void 0 ? null : _d, showEdit = props.showEdit, showRemove = props.showRemove, deleteMessage = props.deleteMessage, resendMessage = props.resendMessage, setQuoteMessage = props.setQuoteMessage, setSupposedHover = props.setSupposedHover, onReplyInThread = props.onReplyInThread, _e = props.onMoveToParentMessage, onMoveToParentMessage = _e === void 0 ? null : _e;
+    var _f = utils.deleteNullish(props).renderMenuItem, renderMenuItem = _f === void 0 ? function (props) { return React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props), props.text); } : _f;
+    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+    var triggerRef = React.useRef(null);
+    var containerRef = React.useRef(null);
+    var showMenuItemCopy = index.isUserMessage(message);
+    var showMenuItemEdit = (!(channel === null || channel === void 0 ? void 0 : channel.isEphemeral) && index.isUserMessage(message) && index.isSentMessage(message) && isByMe);
+    var showMenuItemResend = (index.isFailedMessage(message) && (message === null || message === void 0 ? void 0 : message.isResendable) && isByMe);
+    var showMenuItemDelete = !(channel === null || channel === void 0 ? void 0 : channel.isEphemeral) && !index.isPendingMessage(message) && isByMe;
+    var showMenuItemOpenInChannel = onMoveToParentMessage !== null;
+    /**
+     * TODO: Manage timing issue
+     * User delete pending message -> Sending message success
+     */
+    var isReplyTypeEnabled = !index.isFailedMessage(message)
+        && !index.isPendingMessage(message)
+        && (((_a = channel === null || channel === void 0 ? void 0 : channel.isGroupChannel) === null || _a === void 0 ? void 0 : _a.call(channel))
+            && !(channel === null || channel === void 0 ? void 0 : channel.isEphemeral)
+            && (((channel === null || channel === void 0 ? void 0 : channel.isBroadcast) && (channel === null || channel === void 0 ? void 0 : channel.myRole) === types.Role.OPERATOR)
+                || !(channel === null || channel === void 0 ? void 0 : channel.isBroadcast)));
+    var showMenuItemReply = isReplyTypeEnabled && replyType === 'QUOTE_REPLY';
+    var showMenuItemThread = isReplyTypeEnabled && replyType === 'THREAD' && !(message === null || message === void 0 ? void 0 : message.parentMessageId) && onReplyInThread;
+    if (!(showMenuItemCopy
+        || showMenuItemReply
+        || showMenuItemThread
+        || showMenuItemOpenInChannel
+        || showMenuItemEdit
+        || showMenuItemResend
+        || showMenuItemDelete)) {
+        return null;
+    }
+    return (React.createElement("div", { className: index.getClassName([className, 'sendbird-message-item-menu']), ref: containerRef },
+        React.createElement(ui_ContextMenu.default, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-message-item-menu__trigger", ref: triggerRef, width: "32px", height: "32px", onClick: function () {
+                    toggleDropdown();
+                    setSupposedHover(true);
+                }, onBlur: function () {
+                    setSupposedHover(false);
+                } },
+                React.createElement(ui_Icon.default, { className: "sendbird-message-item-menu__trigger__icon", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE, width: "24px", height: "24px" }))); }, menuItems: function (close) {
+                var _a;
+                var closeDropdown = function () {
+                    close();
+                    setSupposedHover(false);
+                };
+                return (React.createElement(ui_ContextMenu.MenuItems, { className: "sendbird-message-item-menu__list", parentRef: triggerRef, parentContainRef: containerRef, closeDropdown: closeDropdown, openLeft: isByMe },
+                    showMenuItemCopy && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-copy',
+                        onClick: function () {
+                            index.copyToClipboard(message === null || message === void 0 ? void 0 : message.message);
+                            closeDropdown();
+                        },
+                        dataSbId: 'ui_message_item_menu_copy',
+                        text: stringSet.MESSAGE_MENU__COPY,
+                    })),
+                    showMenuItemReply && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-reply',
+                        onClick: function () {
+                            setQuoteMessage(message);
+                            closeDropdown();
+                        },
+                        disable: (message === null || message === void 0 ? void 0 : message.parentMessageId) > 0,
+                        dataSbId: 'ui_message_item_menu_reply',
+                        text: stringSet.MESSAGE_MENU__REPLY,
+                    })),
+                    showMenuItemThread && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-thread',
+                        onClick: function () {
+                            onReplyInThread === null || onReplyInThread === void 0 ? void 0 : onReplyInThread({ message: message });
+                            closeDropdown();
+                        },
+                        dataSbId: 'ui_message_item_menu_thread',
+                        text: stringSet.MESSAGE_MENU__THREAD,
+                    })),
+                    showMenuItemOpenInChannel && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-open-channel',
+                        onClick: function () {
+                            onMoveToParentMessage === null || onMoveToParentMessage === void 0 ? void 0 : onMoveToParentMessage();
+                            closeDropdown();
+                        },
+                        dataSbId: 'ui_message_item_menu_open_in_channel',
+                        text: stringSet.MESSAGE_MENU__OPEN_IN_CHANNEL,
+                    })),
+                    showMenuItemEdit && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-edit',
+                        onClick: function () {
+                            if (!disabled) {
+                                showEdit(true);
+                                closeDropdown();
+                            }
+                        },
+                        dataSbId: 'ui_message_item_menu_edit',
+                        text: stringSet.MESSAGE_MENU__EDIT,
+                    })),
+                    showMenuItemResend && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-resend',
+                        onClick: function () {
+                            if (!disabled) {
+                                resendMessage(message);
+                                closeDropdown();
+                            }
+                        },
+                        dataSbId: 'ui_message_item_menu_resend',
+                        text: stringSet.MESSAGE_MENU__RESEND,
+                    })),
+                    showMenuItemDelete && (renderMenuItem({
+                        className: 'sendbird-message-item-menu__list__menu-item menu-item-delete',
+                        onClick: function () {
+                            if (index.isFailedMessage(message)) {
+                                deleteMessage === null || deleteMessage === void 0 ? void 0 : deleteMessage(message);
+                            }
+                            else if (!disabled) {
+                                showRemove(true);
+                                closeDropdown();
+                            }
+                        },
+                        disable: (typeof disableDeleteMessage === 'boolean'
+                            ? disableDeleteMessage
+                            : ((_a = message === null || message === void 0 ? void 0 : message.threadInfo) === null || _a === void 0 ? void 0 : _a.replyCount) > 0),
+                        dataSbId: 'ui_message_item_menu_delete',
+                        text: stringSet.MESSAGE_MENU__DELETE,
+                    }))));
+            } })));
 }
 
 exports.MessageMenu = MessageMenu;

package/cjs/ui/MessageItemReactionMenu.js

@@ -8,55 +8,55 @@ var ui_Icon = require('./Icon.js');
 var ui_IconButton = require('./IconButton.js');
 var ui_ImageRenderer = require('./ImageRenderer.js');
 var ui_ReactionButton = require('./ReactionButton.js');
-var index = require('../chunks/bundle-BTEk9dhT.js');
-require('../chunks/bundle-BwzMNAFs.js');
+var index = require('../chunks/bundle-wl1uuzU7.js');
+require('../chunks/bundle-BTU876jx.js');
+require('../chunks/bundle-HGbi-rCv.js');
 require('react-dom');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
 require('./SortByRow.js');
-require('../chunks/bundle-B0Cl8cKp.js');
-require('../chunks/bundle-Cm_quRwQ.js');
-require('../chunks/bundle-DXrpp6AJ.js');
-require('../chunks/bundle-_VH8bxGE.js');
-require('../chunks/bundle-C0Gtok_c.js');
-require('../chunks/bundle-xpQ8gY1k.js');
+require('../chunks/bundle-1XtsxT8L.js');
+require('../chunks/bundle-5_kPn4wU.js');
+require('../chunks/bundle-gtkPlUrw.js');
+require('../chunks/bundle-BoLhr7Ko.js');
+require('../chunks/bundle-miB6ue8g.js');
+require('../chunks/bundle-BwQ4BJif.js');
 require('@sendbird/chat/groupChannel');
 require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-CN-HA7zS.js');
 
-function MessageEmojiMenu(_a) {
-    var className = _a.className, message = _a.message, userId = _a.userId, _b = _a.spaceFromTrigger, spaceFromTrigger = _b === void 0 ? { x: 0, y: 0 } : _b, emojiContainer = _a.emojiContainer, toggleReaction = _a.toggleReaction, setSupposedHover = _a.setSupposedHover;
-    var triggerRef = React.useRef(null);
-    var containerRef = React.useRef(null);
-    if (index.isPendingMessage(message) || index.isFailedMessage(message)) {
-        return null;
-    }
-    return (React.createElement("div", { className: index.getClassName([className, 'sendbird-message-item-reaction-menu']), ref: containerRef },
-        React.createElement(ui_ContextMenu.default, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-message-item-reaction-menu__trigger", ref: triggerRef, width: "32px", height: "32px", onClick: function () {
-                    toggleDropdown();
-                    setSupposedHover(true);
-                }, onBlur: function () {
-                    setSupposedHover(false);
-                } },
-                React.createElement(ui_Icon.default, { className: "sendbird-message-item-reaction-menu__trigger__icon", type: ui_Icon.IconTypes.EMOJI_MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE, width: "24px", height: "24px" }))); }, menuItems: function (close) {
-                var closeDropdown = function () {
-                    close();
-                    setSupposedHover(false);
-                };
-                return (React.createElement(ui_ContextMenu.EmojiListItems, { parentRef: triggerRef, parentContainRef: containerRef, 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 () {
-                            closeDropdown();
-                            toggleReaction(message, emoji.key, isReacted);
-                        }, dataSbId: "ui_emoji_reactions_menu_".concat(emoji.key) },
-                        React.createElement(ui_ImageRenderer.default, { url: emoji.url, width: "28px", height: "28px", placeHolder: function (_a) {
-                                var style = _a.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" })));
-                            } })));
-                })));
-            } })));
+function MessageEmojiMenu(_a) {
+    var className = _a.className, message = _a.message, userId = _a.userId, _b = _a.spaceFromTrigger, spaceFromTrigger = _b === void 0 ? { x: 0, y: 0 } : _b, emojiContainer = _a.emojiContainer, toggleReaction = _a.toggleReaction, setSupposedHover = _a.setSupposedHover;
+    var triggerRef = React.useRef(null);
+    var containerRef = React.useRef(null);
+    if (index.isPendingMessage(message) || index.isFailedMessage(message)) {
+        return null;
+    }
+    return (React.createElement("div", { className: index.getClassName([className, 'sendbird-message-item-reaction-menu']), ref: containerRef },
+        React.createElement(ui_ContextMenu.default, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-message-item-reaction-menu__trigger", ref: triggerRef, width: "32px", height: "32px", onClick: function () {
+                    toggleDropdown();
+                    setSupposedHover(true);
+                }, onBlur: function () {
+                    setSupposedHover(false);
+                } },
+                React.createElement(ui_Icon.default, { className: "sendbird-message-item-reaction-menu__trigger__icon", type: ui_Icon.IconTypes.EMOJI_MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE, width: "24px", height: "24px" }))); }, menuItems: function (close) {
+                var closeDropdown = function () {
+                    close();
+                    setSupposedHover(false);
+                };
+                return (React.createElement(ui_ContextMenu.EmojiListItems, { parentRef: triggerRef, parentContainRef: containerRef, 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 () {
+                            closeDropdown();
+                            toggleReaction(message, emoji.key, isReacted);
+                        }, dataSbId: "ui_emoji_reactions_menu_".concat(emoji.key) },
+                        React.createElement(ui_ImageRenderer.default, { url: emoji.url, width: "28px", height: "28px", placeHolder: function (_a) {
+                                var style = _a.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" })));
+                            } })));
+                })));
+            } })));
 }
 
 exports.MessageEmojiMenu = MessageEmojiMenu;

package/cjs/ui/MessageSearchFileItem.js

@@ -1,91 +1,90 @@
 'use strict';
 
-var _tslib = require('../chunks/bundle-BwzMNAFs.js');
+var _tslib = require('../chunks/bundle-HGbi-rCv.js');
 var React = require('react');
-var ui_Avatar = require('../chunks/bundle-BjHWj0YM.js');
+var ui_Avatar = require('../chunks/bundle-DxSB9NRz.js');
 var ui_Icon = require('./Icon.js');
-var ui_Label = require('../chunks/bundle-Cm_quRwQ.js');
-var LocalizationContext = require('../chunks/bundle-Cg6exdly.js');
-var index$1 = require('../chunks/bundle-BEDFWZBT.js');
-var index = require('../chunks/bundle-tVtQpJ4n.js');
-var index$2 = require('../chunks/bundle-BTEk9dhT.js');
-var utils = require('../chunks/bundle-Amd_tEFX.js');
+var ui_Label = require('../chunks/bundle-5_kPn4wU.js');
+var LocalizationContext = require('../chunks/bundle-oeWNUdCB.js');
+var index$1 = require('../chunks/bundle-DAj-1QVM.js');
+var index = require('../chunks/bundle-B_51Svr9.js');
+var index$2 = require('../chunks/bundle-wl1uuzU7.js');
+var utils = require('../chunks/bundle-DcSTnNI0.js');
 require('./ImageRenderer.js');
-require('../chunks/bundle-_VH8bxGE.js');
-require('../chunks/bundle-D1gE5kRR.js');
-require('../chunks/bundle-DXrpp6AJ.js');
-require('../chunks/bundle-XPPVGabQ.js');
-require('../chunks/bundle-m2yaPSNj.js');
+require('../chunks/bundle-BoLhr7Ko.js');
+require('../chunks/bundle-C93-onMF.js');
+require('../chunks/bundle-gtkPlUrw.js');
+require('../chunks/bundle-BWGOXLHb.js');
+require('../chunks/bundle-wMKhbE3c.js');
 require('@sendbird/chat/groupChannel');
 require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-CN-HA7zS.js');
 
-function getCreatedAt(_a) {
-    var createdAt = _a.createdAt, locale = _a.locale, stringSet = _a.stringSet;
-    var optionalParam = locale ? { locale: locale } : null;
-    if (!createdAt) {
-        return '';
-    }
-    if (index.isToday(createdAt)) {
-        return index$1.format(createdAt, 'p', optionalParam);
-    }
-    if (index.isYesterday(createdAt)) {
-        return (stringSet === null || stringSet === void 0 ? void 0 : stringSet.MESSAGE_STATUS__YESTERDAY) || 'Yesterday';
-    }
-    if (index.isThisYear(createdAt)) {
-        return index$1.format(createdAt, 'MMM d', optionalParam);
-    }
-    return index$1.format(createdAt, 'yyyy/M/d', optionalParam);
-}
-function getIconOfFileType(message) {
-    var _a, _b, _c;
-    var fileMessageUrl = (_a = utils.getMessageFirstFileUrl(message)) !== null && _a !== void 0 ? _a : '';
-    var fileExtension = (_c = (_b = (fileMessageUrl.match(/\.([^.]*?)(?=\?|#|$)/))) === null || _b === void 0 ? void 0 : _b[1]) !== null && _c !== void 0 ? _c : '';
-    if (/(jpg|jpeg|png)$/i.test(fileExtension)) {
-        return ui_Icon.IconTypes.PHOTO;
-    }
-    else if (/mp4$/i.test(fileExtension) || index$2.isVoiceMessage(message)) {
-        return ui_Icon.IconTypes.PLAY;
-    }
-    else if (/mp3/i.test(fileExtension)) {
-        return ui_Icon.IconTypes.FILE_AUDIO;
-    }
-    else if (/gif/i.test(fileExtension)) {
-        return ui_Icon.IconTypes.GIF;
-    }
-    else {
-        return ui_Icon.IconTypes.FILE_DOCUMENT;
-    }
+function getCreatedAt(_a) {
+    var createdAt = _a.createdAt, locale = _a.locale, stringSet = _a.stringSet;
+    var optionalParam = locale ? { locale: locale } : null;
+    if (!createdAt) {
+        return '';
+    }
+    if (index.isToday(createdAt)) {
+        return index$1.format(createdAt, 'p', optionalParam);
+    }
+    if (index.isYesterday(createdAt)) {
+        return (stringSet === null || stringSet === void 0 ? void 0 : stringSet.MESSAGE_STATUS__YESTERDAY) || 'Yesterday';
+    }
+    if (index.isThisYear(createdAt)) {
+        return index$1.format(createdAt, 'MMM d', optionalParam);
+    }
+    return index$1.format(createdAt, 'yyyy/M/d', optionalParam);
+}
+function getIconOfFileType(message) {
+    var _a, _b, _c;
+    var fileMessageUrl = (_a = utils.getMessageFirstFileUrl(message)) !== null && _a !== void 0 ? _a : '';
+    var fileExtension = (_c = (_b = (fileMessageUrl.match(/\.([^.]*?)(?=\?|#|$)/))) === null || _b === void 0 ? void 0 : _b[1]) !== null && _c !== void 0 ? _c : '';
+    if (/(jpg|jpeg|png)$/i.test(fileExtension)) {
+        return ui_Icon.IconTypes.PHOTO;
+    }
+    else if (/mp4$/i.test(fileExtension) || index$2.isVoiceMessage(message)) {
+        return ui_Icon.IconTypes.PLAY;
+    }
+    else if (/mp3/i.test(fileExtension)) {
+        return ui_Icon.IconTypes.FILE_AUDIO;
+    }
+    else if (/gif/i.test(fileExtension)) {
+        return ui_Icon.IconTypes.GIF;
+    }
+    else {
+        return ui_Icon.IconTypes.FILE_DOCUMENT;
+    }
 }
 
-function MessageSearchFileItem(props) {
-    var className = props.className, message = props.message, selected = props.selected, onClick = props.onClick;
-    var createdAt = message.createdAt;
-    var url = utils.getMessageFirstFileUrl(message);
-    var name = utils.getMessageFirstFileName(message);
-    // @ts-ignore
-    var sender = message.sender || message._sender;
-    var profileUrl = sender.profileUrl, nickname = sender.nickname;
-    var _a = LocalizationContext.useLocalization(), stringSet = _a.stringSet, dateLocale = _a.dateLocale;
-    var isVoiceMsg = index$2.isVoiceMessage(message);
-    var prettyFilename = isVoiceMsg ? stringSet.VOICE_MESSAGE : (name || url);
-    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            'sendbird-message-search-file-item',
-            selected ? 'sendbird-message-search-file-item--selected' : '',
-        ], false).join(' '), onClick: function (e) {
-            e.stopPropagation();
-            onClick(message);
-        } },
-        React.createElement("div", { className: "sendbird-message-search-file-item__left" },
-            React.createElement(ui_Avatar.Avatar, { className: "sendbird-message-search-file-item__left__sender-avatar", src: profileUrl, alt: "profile image", width: "56px", height: "56px" })),
-        React.createElement("div", { className: "sendbird-message-search-file-item__right" },
-            React.createElement(ui_Label.Label, { className: "sendbird-message-search-file-item__right__sender-name", type: ui_Label.LabelTypography.SUBTITLE_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, nickname || stringSet.NO_NAME),
-            React.createElement("div", { className: "sendbird-message-search-file-item__right__content" },
-                !isVoiceMsg && (React.createElement("div", { className: 'sendbird-message-search-file-item__right__content__type-icon' },
-                    React.createElement(ui_Icon.default, { type: getIconOfFileType(message), fillColor: ui_Icon.IconColors.PRIMARY, width: "18px", height: "18px" }))),
-                React.createElement(ui_Label.Label, { className: "sendbird-message-search-file-item__right__content__url", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, prettyFilename))),
-        React.createElement(ui_Label.Label, { className: "sendbird-message-search-file-item__message-created-at", type: ui_Label.LabelTypography.CAPTION_3, color: ui_Label.LabelColors.ONBACKGROUND_2 }, getCreatedAt({ createdAt: createdAt, locale: dateLocale, stringSet: stringSet })),
-        React.createElement("div", { className: "sendbird-message-search-file-item__right-footer" })));
+function MessageSearchFileItem(props) {
+    var className = props.className, message = props.message, selected = props.selected, onClick = props.onClick;
+    var createdAt = message.createdAt;
+    var url = utils.getMessageFirstFileUrl(message);
+    var name = utils.getMessageFirstFileName(message);
+    // @ts-ignore
+    var sender = message.sender || message._sender;
+    var profileUrl = sender.profileUrl, nickname = sender.nickname;
+    var _a = LocalizationContext.useLocalization(), stringSet = _a.stringSet, dateLocale = _a.dateLocale;
+    var isVoiceMsg = index$2.isVoiceMessage(message);
+    var prettyFilename = isVoiceMsg ? stringSet.VOICE_MESSAGE : (name || url);
+    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
+            'sendbird-message-search-file-item',
+            selected ? 'sendbird-message-search-file-item--selected' : '',
+        ], false).join(' '), onClick: function (e) {
+            e.stopPropagation();
+            onClick(message);
+        } },
+        React.createElement("div", { className: "sendbird-message-search-file-item__left" },
+            React.createElement(ui_Avatar.Avatar, { className: "sendbird-message-search-file-item__left__sender-avatar", src: profileUrl, alt: "profile image", width: "56px", height: "56px" })),
+        React.createElement("div", { className: "sendbird-message-search-file-item__right" },
+            React.createElement(ui_Label.Label, { className: "sendbird-message-search-file-item__right__sender-name", type: ui_Label.LabelTypography.SUBTITLE_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, nickname || stringSet.NO_NAME),
+            React.createElement("div", { className: "sendbird-message-search-file-item__right__content" },
+                !isVoiceMsg && (React.createElement("div", { className: 'sendbird-message-search-file-item__right__content__type-icon' },
+                    React.createElement(ui_Icon.default, { type: getIconOfFileType(message), fillColor: ui_Icon.IconColors.PRIMARY, width: "18px", height: "18px" }))),
+                React.createElement(ui_Label.Label, { className: "sendbird-message-search-file-item__right__content__url", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, prettyFilename))),
+        React.createElement(ui_Label.Label, { className: "sendbird-message-search-file-item__message-created-at", type: ui_Label.LabelTypography.CAPTION_3, color: ui_Label.LabelColors.ONBACKGROUND_2 }, getCreatedAt({ createdAt: createdAt, locale: dateLocale, stringSet: stringSet })),
+        React.createElement("div", { className: "sendbird-message-search-file-item__right-footer" })));
 }
 
 module.exports = MessageSearchFileItem;

package/cjs/ui/MessageSearchFileItem.js.map

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