@sendbird/uikit-react 3.14.12-rc.0 → 3.14.13-rc.0

package/cjs/ui/MobileMenu.js

@@ -2,15 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _tslib = require('../chunks/bundle-CJ4C_lQr.js');
+var _tslib = require('../chunks/bundle-DmCOU0rJ.js');
 var React = require('react');
-var index = require('../chunks/bundle-C5OtWVnd.js');
-var utils = require('../chunks/bundle-CxcGHjPH.js');
+var index = require('../chunks/bundle-CRHrNWJp.js');
+var utils = require('../chunks/bundle-CfMyWzdL.js');
 var useSendbirdStateContext = require('../useSendbirdStateContext.js');
-var ui_ContextMenu = require('../chunks/bundle-6P-e5JVH.js');
+var ui_ContextMenu = require('../chunks/bundle-BeTneyYL.js');
 require('./IconButton.js');
-var LocalizationContext = require('../chunks/bundle-DnchMcYp.js');
-var ui_Label = require('../chunks/bundle-Dq9xVvbD.js');
+var LocalizationContext = require('../chunks/bundle-CiMvvzt_.js');
+var ui_Label = require('../chunks/bundle-Cmim7RkF.js');
 require('@sendbird/chat');
 var ui_Icon = require('./Icon.js');
 var ui_BottomSheet = require('./BottomSheet.js');
@@ -18,99 +18,103 @@ var ui_ImageRenderer = require('./ImageRenderer.js');
 var ui_ReactionButton = require('./ReactionButton.js');
 require('@sendbird/chat/groupChannel');
 require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-B30tLxug.js');
-require('../chunks/bundle-CTGjIAK4.js');
+require('../chunks/bundle-BRhKfsSx.js');
+require('../chunks/bundle-rgSWvbRw.js');
 require('../withSendbird.js');
 require('react-dom');
 require('@sendbird/chat/openChannel');
 require('./SortByRow.js');
-require('../chunks/bundle-BThLM1G6.js');
-require('../chunks/bundle-RonggNhW.js');
-require('../chunks/bundle-BR99z-80.js');
-require('../chunks/bundle-BVG8wAfm.js');
-require('../chunks/bundle-QmHmrOIH.js');
+require('../chunks/bundle-Sp2G1sf1.js');
+require('../chunks/bundle-pcWgzSTZ.js');
+require('../chunks/bundle-C0bs5HgC.js');
+require('../chunks/bundle-B2dRfy75.js');
+require('../chunks/bundle-BFb_s1Sk.js');
 require('./Button.js');
 require('@sendbird/uikit-tools');
 require('css-vars-ponyfill');
-require('../chunks/bundle-B22Ty9Wl.js');
-require('../chunks/bundle-UZTd4E_b.js');
-require('../chunks/bundle-Bur_syFT.js');
+require('../chunks/bundle-Bfd7tojj.js');
+require('../chunks/bundle-BdulnACZ.js');
+require('../chunks/bundle-CflLBf1e.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 var CopyMenuItem$1 = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             if (index.isUserMessage(message))
                 index.copyToClipboard(message.message);
             hideMenu();
             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__COPY),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.COPY, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__COPY),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.COPY, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 var ReplyMenuItem$1 = function (props) {
     var _a, _b, _c;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _d = ui_ContextMenu.useMessageMenuContext(), message = _d.message, hideMenu = _d.hideMenu, setQuoteMessage = _d.setQuoteMessage;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { disabled: message.parentMessageId > 0, onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { disabled: message.parentMessageId > 0, onClick: function (e) {
             var _a;
             setQuoteMessage(message);
             hideMenu();
             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ((_b = message.parentMessageId) !== null && _b !== void 0 ? _b : 0) > 0 ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__REPLY),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REPLY, fillColor: ((_c = message.parentMessageId) !== null && _c !== void 0 ? _c : 0) > 0 ? ui_Icon.IconColors.ON_BACKGROUND_4 : ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ((_b = message.parentMessageId) !== null && _b !== void 0 ? _b : 0) > 0 ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__REPLY),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REPLY, fillColor: ((_c = message.parentMessageId) !== null && _c !== void 0 ? _c : 0) > 0 ? ui_Icon.IconColors.ON_BACKGROUND_4 : ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 var ThreadMenuItem$1 = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu, onReplyInThread = _b.onReplyInThread;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             onReplyInThread({ message: message });
             hideMenu();
             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__THREAD),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.THREAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__THREAD),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.THREAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 var EditMenuItem$1 = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), hideMenu = _b.hideMenu, showEdit = _b.showEdit, isOnline = _b.isOnline;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             if (isOnline) {
                 showEdit(true);
                 hideMenu();
                 (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__EDIT),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EDIT, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__EDIT),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EDIT, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 var ResendMenuItem$1 = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu, resendMessage = _b.resendMessage, isOnline = _b.isOnline;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             if (isOnline) {
                 resendMessage(message);
                 hideMenu();
                 (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__RESEND),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REFRESH, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__RESEND),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REFRESH, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 var DeleteMenuItem$1 = function (props) {
     var _a, _b, _c;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _d = ui_ContextMenu.useMessageMenuContext(), message = _d.message, hideMenu = _d.hideMenu, deleteMessage = _d.deleteMessage, showRemove = _d.showRemove, isOnline = _d.isOnline, disableDeleteMessage = _d.disableDeleteMessage;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { disabled: typeof disableDeleteMessage === 'boolean'
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { disabled: typeof disableDeleteMessage === 'boolean'
             ? disableDeleteMessage
             : ((_b = (_a = message.threadInfo) === null || _a === void 0 ? void 0 : _a.replyCount) !== null && _b !== void 0 ? _b : 0) > 0, onClick: function (e) {
             var _a;
@@ -122,20 +126,20 @@ var DeleteMenuItem$1 = function (props) {
                 hideMenu();
                 (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }
-        } }), (_c = props.children) !== null && _c !== void 0 ? _c : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: disableDeleteMessage ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__DELETE),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DELETE, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_c = props.children) !== null && _c !== void 0 ? _c : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: disableDeleteMessage ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__DELETE),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DELETE, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 var DownloadMenuItem$1 = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), hideMenu = _b.hideMenu, message = _b.message, onDownloadClick = _b.onDownloadClick;
     var url = message.url;
-    return (React.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function () {
+    return (React__default.default.createElement(ui_ContextMenu.MenuItem, _tslib.__assign({}, props, { onClick: function () {
             hideMenu();
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement("a", { className: "sendbird-message__contextmenu--hyperlink", rel: "noopener noreferrer", href: url, target: "_blank", onClick: onDownloadClick },
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__SAVE),
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DOWNLOAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement("a", { className: "sendbird-message__contextmenu--hyperlink", rel: "noopener noreferrer", href: url, target: "_blank", onClick: onDownloadClick },
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__SAVE),
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DOWNLOAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
 
 var MobileContextMenu = function (props) {
@@ -171,8 +175,8 @@ var MobileContextMenu = function (props) {
         containerRef: parentRef,
         onDownloadClick: onDownloadClick,
     };
-    return (React.createElement(ui_ContextMenu.MessageMenuProvider, { value: contextValue },
-        React.createElement(ui_ContextMenu.MenuItems, { className: "sendbird-message__mobile-context-menu", parentRef: parentRef, parentContainRef: parentRef, closeDropdown: hideMobileMenu }, (_d = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
+    return (React__default.default.createElement(ui_ContextMenu.MessageMenuProvider, { value: contextValue },
+        React__default.default.createElement(ui_ContextMenu.MenuItems, { className: "sendbird-message__mobile-context-menu", parentRef: parentRef, parentContainRef: parentRef, closeDropdown: hideMobileMenu }, (_d = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
             items: {
                 CopyMenuItem: CopyMenuItem$1,
                 ReplyMenuItem: ReplyMenuItem$1,
@@ -181,91 +185,91 @@ var MobileContextMenu = function (props) {
                 ResendMenuItem: ResendMenuItem$1,
                 DeleteMenuItem: DeleteMenuItem$1,
             },
-        })) !== null && _d !== void 0 ? _d : (React.createElement(React.Fragment, null,
-            showMenuItemCopy && React.createElement(CopyMenuItem$1, null),
-            showMenuItemReply && React.createElement(ReplyMenuItem$1, null),
-            showMenuItemThread && React.createElement(ThreadMenuItem$1, null),
-            showMenuItemEdit && React.createElement(EditMenuItem$1, null),
-            showMenuItemResend && React.createElement(ResendMenuItem$1, null),
-            showMenuItemDeleteFinal && React.createElement(DeleteMenuItem$1, null),
-            showMenuItemDownload && React.createElement(DownloadMenuItem$1, null))))));
+        })) !== null && _d !== void 0 ? _d : (React__default.default.createElement(React__default.default.Fragment, null,
+            showMenuItemCopy && React__default.default.createElement(CopyMenuItem$1, null),
+            showMenuItemReply && React__default.default.createElement(ReplyMenuItem$1, null),
+            showMenuItemThread && React__default.default.createElement(ThreadMenuItem$1, null),
+            showMenuItemEdit && React__default.default.createElement(EditMenuItem$1, null),
+            showMenuItemResend && React__default.default.createElement(ResendMenuItem$1, null),
+            showMenuItemDeleteFinal && React__default.default.createElement(DeleteMenuItem$1, null),
+            showMenuItemDownload && React__default.default.createElement(DownloadMenuItem$1, null))))));
 };
 
 var CopyMenuItem = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             if (index.isUserMessage(message))
                 index.copyToClipboard(message.message);
             hideMenu();
             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.COPY, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__COPY)))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.COPY, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__COPY)))));
 };
 var EditMenuItem = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), hideMenu = _b.hideMenu, showEdit = _b.showEdit, isOnline = _b.isOnline;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             if (isOnline) {
                 showEdit(true);
                 hideMenu();
                 (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EDIT, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__EDIT)))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EDIT, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__EDIT)))));
 };
 var ResendMenuItem = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu, resendMessage = _b.resendMessage, isOnline = _b.isOnline;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             if (isOnline) {
                 resendMessage(message);
                 hideMenu();
                 (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REFRESH, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__RESEND)))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REFRESH, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__RESEND)))));
 };
 var ReplyMenuItem = function (props) {
     var _a, _b, _c;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _d = ui_ContextMenu.useMessageMenuContext(), message = _d.message, hideMenu = _d.hideMenu, setQuoteMessage = _d.setQuoteMessage;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { disabled: message.parentMessageId > 0, onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { disabled: message.parentMessageId > 0, onClick: function (e) {
             var _a;
             setQuoteMessage(message);
             hideMenu();
             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REPLY, fillColor: ((_b = message.parentMessageId) !== null && _b !== void 0 ? _b : 0) > 0 ? ui_Icon.IconColors.ON_BACKGROUND_3 : ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ((_c = message.parentMessageId) !== null && _c !== void 0 ? _c : 0) > 0 ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__REPLY)))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.REPLY, fillColor: ((_b = message.parentMessageId) !== null && _b !== void 0 ? _b : 0) > 0 ? ui_Icon.IconColors.ON_BACKGROUND_3 : ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ((_c = message.parentMessageId) !== null && _c !== void 0 ? _c : 0) > 0 ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__REPLY)))));
 };
 var ThreadMenuItem = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu, onReplyInThread = _b.onReplyInThread;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { onClick: function (e) {
             var _a;
             onReplyInThread({ message: message });
             hideMenu();
             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.THREAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__THREAD)))));
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.THREAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__THREAD)))));
 };
 var DeleteMenuItem = function (props) {
     var _a, _b, _c;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _d = ui_ContextMenu.useMessageMenuContext(), message = _d.message, hideMenu = _d.hideMenu, deleteMessage = _d.deleteMessage, showRemove = _d.showRemove, isOnline = _d.isOnline, disableDeleteMessage = _d.disableDeleteMessage;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { disabled: typeof disableDeleteMessage === 'boolean'
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, _tslib.__assign({}, props, { disabled: typeof disableDeleteMessage === 'boolean'
             ? disableDeleteMessage
             : ((_b = (_a = message.threadInfo) === null || _a === void 0 ? void 0 : _a.replyCount) !== null && _b !== void 0 ? _b : 0) > 0, onClick: function (e) {
             var _a;
@@ -277,18 +281,18 @@ var DeleteMenuItem = function (props) {
                 hideMenu();
                 (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }
-        } }), (_c = props.children) !== null && _c !== void 0 ? _c : (React.createElement(React.Fragment, null,
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DELETE, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: disableDeleteMessage ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__DELETE)))));
+        } }), (_c = props.children) !== null && _c !== void 0 ? _c : (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DELETE, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: disableDeleteMessage ? ui_Label.LabelColors.ONBACKGROUND_4 : ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__DELETE)))));
 };
 var DownloadMenuItem = function (props) {
     var _a;
     var stringSet = LocalizationContext.useLocalization().stringSet;
     var _b = ui_ContextMenu.useMessageMenuContext(), hideMenu = _b.hideMenu, message = _b.message, onDownloadClick = _b.onDownloadClick;
     var url = message.url;
-    return (React.createElement(ui_ContextMenu.BottomSheetMenuItem, { onClick: function () { return hideMenu(); } }, (_a = props.children) !== null && _a !== void 0 ? _a : (React.createElement("a", { className: "sendbird-message__bottomsheet--hyperlink", rel: "noopener noreferrer", href: url, target: "_blank", onClick: onDownloadClick },
-        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DOWNLOAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-        React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__SAVE)))));
+    return (React__default.default.createElement(ui_ContextMenu.BottomSheetMenuItem, { onClick: function () { return hideMenu(); } }, (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.default.createElement("a", { className: "sendbird-message__bottomsheet--hyperlink", rel: "noopener noreferrer", href: url, target: "_blank", onClick: onDownloadClick },
+        React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DOWNLOAD, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__SAVE)))));
 };
 
 var EMOJI_SIZE = 38;
@@ -338,32 +342,32 @@ var MobileBottomSheet = function (props) {
         containerRef: null,
         onDownloadClick: onDownloadClick,
     };
-    return (React.createElement(ui_ContextMenu.MessageMenuProvider, { value: contextValue },
-        React.createElement(ui_BottomSheet, { onBackdropClick: hideMenu },
-            React.createElement("div", { className: "sendbird-message__bottomsheet" },
-                showReaction && (React.createElement("div", { className: "sendbird-message__bottomsheet-reactions" },
-                    React.createElement("ul", { className: "sendbird-message__bottomsheet-reaction-bar" },
-                        React.createElement("div", { className: utils.classnames('sendbird-message__bottomsheet-reaction-bar__row', showEmojisOnly && 'sendbird-message__bottomsheet-reaction-bar__all') },
+    return (React__default.default.createElement(ui_ContextMenu.MessageMenuProvider, { value: contextValue },
+        React__default.default.createElement(ui_BottomSheet, { onBackdropClick: hideMenu },
+            React__default.default.createElement("div", { className: "sendbird-message__bottomsheet" },
+                showReaction && (React__default.default.createElement("div", { className: "sendbird-message__bottomsheet-reactions" },
+                    React__default.default.createElement("ul", { className: "sendbird-message__bottomsheet-reaction-bar" },
+                        React__default.default.createElement("div", { className: utils.classnames('sendbird-message__bottomsheet-reaction-bar__row', showEmojisOnly && 'sendbird-message__bottomsheet-reaction-bar__all') },
                             visibleEmojis.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.filter(function (reaction) { return reaction.key === emoji.key; })[0]) === null || _b === void 0 ? void 0 : _b.userIds) === null || _c === void 0 ? void 0 : _c.some(function (reactorId) { return reactorId === userId; });
-                                return (React.createElement(ui_ReactionButton, { key: emoji.key, width: "".concat(EMOJI_SIZE, "px"), height: "".concat(EMOJI_SIZE, "px"), selected: isReacted, onClick: function () {
+                                return (React__default.default.createElement(ui_ReactionButton, { key: emoji.key, width: "".concat(EMOJI_SIZE, "px"), height: "".concat(EMOJI_SIZE, "px"), selected: isReacted, onClick: function () {
                                         hideMenu();
                                         toggleReaction === null || toggleReaction === void 0 ? void 0 : toggleReaction(message, emoji.key, isReacted);
                                     }, testID: "ui_mobile_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 (_a) {
+                                    React__default.default.createElement(ui_ImageRenderer.default, { url: (emoji === null || emoji === void 0 ? void 0 : 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" })));
+                                            return (React__default.default.createElement("div", { style: style },
+                                                React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.QUESTION, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" })));
                                         } })));
                             }),
-                            canShowMoreEmojis && !showEmojisOnly && (React.createElement(ui_ReactionButton, { key: "emoji_more", width: "38px", height: "38px", onClick: function () { return setShowEmojisOnly(true); }, testID: "ui_mobile_emoji_reactions_menu_emojiadd" },
-                                React.createElement(ui_ImageRenderer.default, { url: '', width: "28px", height: "28px", placeHolder: function (_a) {
+                            canShowMoreEmojis && !showEmojisOnly && (React__default.default.createElement(ui_ReactionButton, { key: "emoji_more", width: "38px", height: "38px", onClick: function () { return setShowEmojisOnly(true); }, testID: "ui_mobile_emoji_reactions_menu_emojiadd" },
+                                React__default.default.createElement(ui_ImageRenderer.default, { 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.EMOJI_MORE, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" })));
+                                        return (React__default.default.createElement("div", { style: style },
+                                            React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.EMOJI_MORE, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" })));
                                     } }))))))),
-                !showEmojisOnly && (React.createElement("div", { className: "sendbird-message__bottomsheet--actions" }, (_d = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
+                !showEmojisOnly && (React__default.default.createElement("div", { className: "sendbird-message__bottomsheet--actions" }, (_d = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
                     items: {
                         CopyMenuItem: CopyMenuItem,
                         EditMenuItem: EditMenuItem,
@@ -372,18 +376,18 @@ var MobileBottomSheet = function (props) {
                         ThreadMenuItem: ThreadMenuItem,
                         DeleteMenuItem: DeleteMenuItem,
                     },
-                })) !== null && _d !== void 0 ? _d : (React.createElement(React.Fragment, null,
-                    showMenuItemCopy && React.createElement(CopyMenuItem, null),
-                    showMenuItemEdit && React.createElement(EditMenuItem, null),
-                    showMenuItemResend && React.createElement(ResendMenuItem, null),
-                    showMenuItemReply && React.createElement(ReplyMenuItem, null),
-                    showMenuItemThread && React.createElement(ThreadMenuItem, null),
-                    showMenuItemDeleteFinal && React.createElement(DeleteMenuItem, null),
-                    showMenuItemDownload && React.createElement(DownloadMenuItem, null)))))))));
+                })) !== null && _d !== void 0 ? _d : (React__default.default.createElement(React__default.default.Fragment, null,
+                    showMenuItemCopy && React__default.default.createElement(CopyMenuItem, null),
+                    showMenuItemEdit && React__default.default.createElement(EditMenuItem, null),
+                    showMenuItemResend && React__default.default.createElement(ResendMenuItem, null),
+                    showMenuItemReply && React__default.default.createElement(ReplyMenuItem, null),
+                    showMenuItemThread && React__default.default.createElement(ThreadMenuItem, null),
+                    showMenuItemDeleteFinal && React__default.default.createElement(DeleteMenuItem, null),
+                    showMenuItemDownload && React__default.default.createElement(DownloadMenuItem, null)))))))));
 };
 
 var MobileMenu = function (props) {
-    return (React.createElement(React.Fragment, null, (props === null || props === void 0 ? void 0 : props.isReactionEnabled) ? React.createElement(MobileBottomSheet, _tslib.__assign({}, props)) : React.createElement(MobileContextMenu, _tslib.__assign({}, props))));
+    return (React__default.default.createElement(React__default.default.Fragment, null, (props === null || props === void 0 ? void 0 : props.isReactionEnabled) ? React__default.default.createElement(MobileBottomSheet, _tslib.__assign({}, props)) : React__default.default.createElement(MobileContextMenu, _tslib.__assign({}, props))));
 };
 
 exports.MobileBottomSheet = MobileBottomSheet;

package/cjs/ui/MobileMenu.js.map

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

package/cjs/ui/Modal.js

@@ -2,34 +2,34 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../chunks/bundle-CJ4C_lQr.js');
+require('../chunks/bundle-DmCOU0rJ.js');
 require('react');
 require('react-dom');
-require('../chunks/bundle-CxcGHjPH.js');
-var ui_Modal = require('../chunks/bundle-BVG8wAfm.js');
-require('../chunks/bundle-DnchMcYp.js');
-require('../chunks/bundle-QmHmrOIH.js');
+require('../chunks/bundle-CfMyWzdL.js');
+var ui_Modal = require('../chunks/bundle-B2dRfy75.js');
+require('../chunks/bundle-CiMvvzt_.js');
+require('../chunks/bundle-BFb_s1Sk.js');
 require('./IconButton.js');
 require('./Button.js');
 require('./Icon.js');
-require('../chunks/bundle-Dq9xVvbD.js');
+require('../chunks/bundle-Cmim7RkF.js');
 require('@sendbird/uikit-tools');
 require('../withSendbird.js');
 require('css-vars-ponyfill');
-require('../chunks/bundle-C5OtWVnd.js');
+require('../chunks/bundle-CRHrNWJp.js');
 require('@sendbird/chat');
-require('../chunks/bundle-BThLM1G6.js');
+require('../chunks/bundle-Sp2G1sf1.js');
 require('@sendbird/chat/openChannel');
 require('@sendbird/chat/groupChannel');
-require('../chunks/bundle-B22Ty9Wl.js');
-require('../chunks/bundle-6P-e5JVH.js');
+require('../chunks/bundle-Bfd7tojj.js');
+require('../chunks/bundle-BeTneyYL.js');
 require('../useSendbirdStateContext.js');
-require('../chunks/bundle-UZTd4E_b.js');
-require('../chunks/bundle-RonggNhW.js');
-require('../chunks/bundle-BR99z-80.js');
+require('../chunks/bundle-BdulnACZ.js');
+require('../chunks/bundle-pcWgzSTZ.js');
+require('../chunks/bundle-C0bs5HgC.js');
 require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-B30tLxug.js');
-require('../chunks/bundle-CTGjIAK4.js');
+require('../chunks/bundle-BRhKfsSx.js');
+require('../chunks/bundle-rgSWvbRw.js');
 require('./SortByRow.js');
 
 

package/cjs/ui/MutedAvatarOverlay.js

@@ -2,21 +2,25 @@
 
 var React = require('react');
 var ui_Icon = require('./Icon.js');
-require('../chunks/bundle-CJ4C_lQr.js');
-require('../chunks/bundle-CxcGHjPH.js');
+require('../chunks/bundle-DmCOU0rJ.js');
+require('../chunks/bundle-CfMyWzdL.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 function MutedAvatarOverlay(props) {
     var _a = props.height, height = _a === void 0 ? 24 : _a, _b = props.width, width = _b === void 0 ? 24 : _b;
-    return (React.createElement("div", { className: "sendbird-muted-avatar", style: {
+    return (React__default.default.createElement("div", { className: "sendbird-muted-avatar", style: {
             height: "".concat(height, "px"),
             width: "".concat(width, "px"),
         } },
-        React.createElement("div", { className: "sendbird-muted-avatar__icon" },
-            React.createElement("div", { className: "sendbird-muted-avatar__bg", style: {
+        React__default.default.createElement("div", { className: "sendbird-muted-avatar__icon" },
+            React__default.default.createElement("div", { className: "sendbird-muted-avatar__bg", style: {
                     height: "".concat(height, "px"),
                     width: "".concat(width, "px"),
                 } }),
-            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.MUTE, fillColor: ui_Icon.IconColors.WHITE, width: "".concat(height - 8, "px"), height: "".concat(width - 8, "px") }))));
+            React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.MUTE, fillColor: ui_Icon.IconColors.WHITE, width: "".concat(height - 8, "px"), height: "".concat(width - 8, "px") }))));
 }
 
 module.exports = MutedAvatarOverlay;

package/cjs/ui/MutedAvatarOverlay.js.map

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