stream-chat-react 11.20.0 → 12.0.0-rc.1

package/dist/components/Message/utils.js

@@ -1,11 +1,10 @@
-import { __spreadArray } from "tslib";
 import deepequal from 'react-fast-compare';
 import emojiRegex from 'emoji-regex';
 /**
  * Following function validates a function which returns notification message.
  * It validates if the first parameter is function and also if return value of function is string or no.
  */
-export var validateAndGetMessage = function (func, args) {
+export const validateAndGetMessage = (func, args) => {
     if (!func || typeof func !== 'function')
         return null;
     // below is due to tests passing a single argument
@@ -14,7 +13,7 @@ export var validateAndGetMessage = function (func, args) {
         // @ts-expect-error
         args = [args];
     }
-    var returnValue = func.apply(void 0, args);
+    const returnValue = func(...args);
     if (typeof returnValue !== 'string')
         return null;
     return returnValue;
@@ -22,13 +21,13 @@ export var validateAndGetMessage = function (func, args) {
 /**
  * Tell if the owner of the current message is muted
  */
-export var isUserMuted = function (message, mutes) {
+export const isUserMuted = (message, mutes) => {
     if (!mutes || !message)
         return false;
-    var userMuted = mutes.filter(function (el) { var _a; return el.target.id === ((_a = message.user) === null || _a === void 0 ? void 0 : _a.id); });
+    const userMuted = mutes.filter((el) => el.target.id === message.user?.id);
     return !!userMuted.length;
 };
-export var MESSAGE_ACTIONS = {
+export const MESSAGE_ACTIONS = {
     delete: 'delete',
     edit: 'edit',
     flag: 'flag',
@@ -40,7 +39,7 @@ export var MESSAGE_ACTIONS = {
     reply: 'reply',
 };
 // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
-export var defaultPinPermissions = {
+export const defaultPinPermissions = {
     commerce: {
         admin: true,
         anonymous: false,
@@ -97,16 +96,15 @@ export var defaultPinPermissions = {
         user: false,
     },
 };
-export var getMessageActions = function (actions, _a) {
-    var canDelete = _a.canDelete, canEdit = _a.canEdit, canFlag = _a.canFlag, canMarkUnread = _a.canMarkUnread, canMute = _a.canMute, canPin = _a.canPin, canQuote = _a.canQuote, canReact = _a.canReact, canReply = _a.canReply;
-    var messageActionsAfterPermission = [];
-    var messageActions = [];
+export const getMessageActions = (actions, { canDelete, canEdit, canFlag, canMarkUnread, canMute, canPin, canQuote, canReact, canReply, }) => {
+    const messageActionsAfterPermission = [];
+    let messageActions = [];
     if (actions && typeof actions === 'boolean') {
         // If value of actions is true, then populate all the possible values
         messageActions = Object.keys(MESSAGE_ACTIONS);
     }
     else if (actions && actions.length > 0) {
-        messageActions = __spreadArray([], actions, true);
+        messageActions = [...actions];
     }
     else {
         return [];
@@ -140,18 +138,18 @@ export var getMessageActions = function (actions, _a) {
     }
     return messageActionsAfterPermission;
 };
-export var ACTIONS_NOT_WORKING_IN_THREAD = [
+export const ACTIONS_NOT_WORKING_IN_THREAD = [
     MESSAGE_ACTIONS.pin,
     MESSAGE_ACTIONS.react,
     MESSAGE_ACTIONS.reply,
     MESSAGE_ACTIONS.markUnread,
 ];
-export var showMessageActionsBox = function (actions, inThread) {
+export const showMessageActionsBox = (actions, inThread) => {
     if (actions.length === 0) {
         return false;
     }
     if (inThread &&
-        actions.filter(function (action) { return !ACTIONS_NOT_WORKING_IN_THREAD.includes(action); }).length === 0) {
+        actions.filter((action) => !ACTIONS_NOT_WORKING_IN_THREAD.includes(action)).length === 0) {
         return false;
     }
     if (actions.length === 1 && (actions.includes('react') || actions.includes('reply'))) {
@@ -163,24 +161,23 @@ export var showMessageActionsBox = function (actions, inThread) {
     return true;
 };
 function areMessagesEqual(prevMessage, nextMessage) {
-    var _a, _b, _c, _d, _e, _f;
     return (prevMessage.deleted_at === nextMessage.deleted_at &&
-        ((_a = prevMessage.latest_reactions) === null || _a === void 0 ? void 0 : _a.length) === ((_b = nextMessage.latest_reactions) === null || _b === void 0 ? void 0 : _b.length) &&
-        ((_c = prevMessage.own_reactions) === null || _c === void 0 ? void 0 : _c.length) === ((_d = nextMessage.own_reactions) === null || _d === void 0 ? void 0 : _d.length) &&
+        prevMessage.latest_reactions?.length === nextMessage.latest_reactions?.length &&
+        prevMessage.own_reactions?.length === nextMessage.own_reactions?.length &&
         prevMessage.pinned === nextMessage.pinned &&
         prevMessage.reply_count === nextMessage.reply_count &&
         prevMessage.status === nextMessage.status &&
         prevMessage.text === nextMessage.text &&
         prevMessage.type === nextMessage.type &&
         prevMessage.updated_at === nextMessage.updated_at &&
-        ((_e = prevMessage.user) === null || _e === void 0 ? void 0 : _e.updated_at) === ((_f = nextMessage.user) === null || _f === void 0 ? void 0 : _f.updated_at) &&
+        prevMessage.user?.updated_at === nextMessage.user?.updated_at &&
         Boolean(prevMessage.quoted_message) === Boolean(nextMessage.quoted_message) &&
         (!prevMessage.quoted_message ||
             areMessagesEqual(prevMessage.quoted_message, nextMessage.quoted_message)));
 }
-export var areMessagePropsEqual = function (prevProps, nextProps) {
-    var prevMessage = prevProps.message, prevMessageUI = prevProps.Message;
-    var nextMessage = nextProps.message, nextMessageUI = nextProps.Message;
+export const areMessagePropsEqual = (prevProps, nextProps) => {
+    const { message: prevMessage, Message: prevMessageUI } = prevProps;
+    const { message: nextMessage, Message: nextMessageUI } = nextProps;
     if (prevMessageUI !== nextMessageUI)
         return false;
     if (prevProps.endOfGroup !== nextProps.endOfGroup)
@@ -188,10 +185,10 @@ export var areMessagePropsEqual = function (prevProps, nextProps) {
     if (nextProps.showDetailedReactions !== prevProps.showDetailedReactions) {
         return false;
     }
-    var messagesAreEqual = areMessagesEqual(prevMessage, nextMessage);
+    const messagesAreEqual = areMessagesEqual(prevMessage, nextMessage);
     if (!messagesAreEqual)
         return false;
-    var deepEqualProps = deepequal(nextProps.messageActions, prevProps.messageActions) &&
+    const deepEqualProps = deepequal(nextProps.messageActions, prevProps.messageActions) &&
         deepequal(nextProps.readBy, prevProps.readBy) &&
         deepequal(nextProps.highlighted, prevProps.highlighted) &&
         deepequal(nextProps.groupStyles, prevProps.groupStyles) && // last 3 messages can have different group styles
@@ -202,19 +199,18 @@ export var areMessagePropsEqual = function (prevProps, nextProps) {
     return (prevProps.messageListRect === nextProps.messageListRect // MessageList wrapper layout changes
     );
 };
-export var areMessageUIPropsEqual = function (prevProps, nextProps) {
-    var _a, _b, _c, _d;
-    var prevLastReceivedId = prevProps.lastReceivedId, prevMessage = prevProps.message;
-    var nextLastReceivedId = nextProps.lastReceivedId, nextMessage = nextProps.message;
+export const areMessageUIPropsEqual = (prevProps, nextProps) => {
+    const { lastReceivedId: prevLastReceivedId, message: prevMessage } = prevProps;
+    const { lastReceivedId: nextLastReceivedId, message: nextMessage } = nextProps;
     if (prevProps.editing !== nextProps.editing)
         return false;
     if (prevProps.highlighted !== nextProps.highlighted)
         return false;
     if (prevProps.endOfGroup !== nextProps.endOfGroup)
         return false;
-    if (((_a = prevProps.mutes) === null || _a === void 0 ? void 0 : _a.length) !== ((_b = nextProps.mutes) === null || _b === void 0 ? void 0 : _b.length))
+    if (prevProps.mutes?.length !== nextProps.mutes?.length)
         return false;
-    if (((_c = prevProps.readBy) === null || _c === void 0 ? void 0 : _c.length) !== ((_d = nextProps.readBy) === null || _d === void 0 ? void 0 : _d.length))
+    if (prevProps.readBy?.length !== nextProps.readBy?.length)
         return false;
     if (prevProps.showDetailedReactions !== nextProps.showDetailedReactions) {
         return false;
@@ -225,31 +221,28 @@ export var areMessageUIPropsEqual = function (prevProps, nextProps) {
     }
     return areMessagesEqual(prevMessage, nextMessage);
 };
-export var messageHasReactions = function (message) { var _a; return Object.values((_a = message === null || message === void 0 ? void 0 : message.reaction_groups) !== null && _a !== void 0 ? _a : {}).some(function (_a) {
-    var count = _a.count;
-    return count > 0;
-}); };
-export var messageHasAttachments = function (message) { return !!(message === null || message === void 0 ? void 0 : message.attachments) && !!message.attachments.length; };
-export var getImages = function (message) {
-    if (!(message === null || message === void 0 ? void 0 : message.attachments)) {
+export const messageHasReactions = (message) => Object.values(message?.reaction_groups ?? {}).some(({ count }) => count > 0);
+export const messageHasAttachments = (message) => !!message?.attachments && !!message.attachments.length;
+export const getImages = (message) => {
+    if (!message?.attachments) {
         return [];
     }
-    return message.attachments.filter(function (item) { return item.type === 'image'; });
+    return message.attachments.filter((item) => item.type === 'image');
 };
-export var getNonImageAttachments = function (message) {
-    if (!(message === null || message === void 0 ? void 0 : message.attachments)) {
+export const getNonImageAttachments = (message) => {
+    if (!message?.attachments) {
         return [];
     }
-    return message.attachments.filter(function (item) { return item.type !== 'image'; });
+    return message.attachments.filter((item) => item.type !== 'image');
 };
 /**
  * Default Tooltip Username mapper implementation.
  *
  * @param user the user.
  */
-export var mapToUserNameOrId = function (user) { return user.name || user.id; };
-export var getReadByTooltipText = function (users, t, client, tooltipUserNameMapper) {
-    var outStr = '';
+export const mapToUserNameOrId = (user) => user.name || user.id;
+export const getReadByTooltipText = (users, t, client, tooltipUserNameMapper) => {
+    let outStr = '';
     if (!t) {
         throw new Error('getReadByTooltipText was called, but translation function is not available');
     }
@@ -257,13 +250,13 @@ export var getReadByTooltipText = function (users, t, client, tooltipUserNameMap
         throw new Error('getReadByTooltipText was called, but tooltipUserNameMapper function is not available');
     }
     // first filter out client user, so restLength won't count it
-    var otherUsers = users
-        .filter(function (item) { return item && (client === null || client === void 0 ? void 0 : client.user) && item.id !== client.user.id; })
+    const otherUsers = users
+        .filter((item) => item && client?.user && item.id !== client.user.id)
         .map(tooltipUserNameMapper);
-    var slicedArr = otherUsers.slice(0, 5);
-    var restLength = otherUsers.length - slicedArr.length;
+    const slicedArr = otherUsers.slice(0, 5);
+    const restLength = otherUsers.length - slicedArr.length;
     if (slicedArr.length === 1) {
-        outStr = "".concat(slicedArr[0], " ");
+        outStr = `${slicedArr[0]} `;
     }
     else if (slicedArr.length === 2) {
         // joins all with "and" but =no commas
@@ -278,10 +271,10 @@ export var getReadByTooltipText = function (users, t, client, tooltipUserNameMap
         // example: "bob, joe, sam and 4 more"
         if (restLength === 0) {
             // mutate slicedArr to remove last user to display it separately
-            var lastUser = slicedArr.splice(slicedArr.length - 1, 1);
+            const lastUser = slicedArr.splice(slicedArr.length - 1, 1);
             outStr = t('{{ commaSeparatedUsers }}, and {{ lastUser }}', {
                 commaSeparatedUsers: slicedArr.join(', '),
-                lastUser: lastUser,
+                lastUser,
             });
         }
         else {
@@ -293,16 +286,13 @@ export var getReadByTooltipText = function (users, t, client, tooltipUserNameMap
     }
     return outStr;
 };
-export var isOnlyEmojis = function (text) {
+export const isOnlyEmojis = (text) => {
     if (!text)
         return false;
-    var noEmojis = text.replace(emojiRegex(), '');
-    var noSpace = noEmojis.replace(/[\s\n]/gm, '');
+    const noEmojis = text.replace(emojiRegex(), '');
+    const noSpace = noEmojis.replace(/[\s\n]/gm, '');
     return !noSpace;
 };
-export var isMessageBounced = function (message) {
-    var _a;
-    return message.type === 'error' &&
-        ((_a = message.moderation_details) === null || _a === void 0 ? void 0 : _a.action) === 'MESSAGE_RESPONSE_ACTION_BOUNCE';
-};
-export var isMessageEdited = function (message) { return !!message.message_text_updated_at; };
+export const isMessageBounced = (message) => message.type === 'error' &&
+    message.moderation_details?.action === 'MESSAGE_RESPONSE_ACTION_BOUNCE';
+export const isMessageEdited = (message) => !!message.message_text_updated_at;

package/dist/components/MessageActions/CustomMessageActionsList.d.ts

@@ -6,9 +6,4 @@ export type CustomMessageActionsListProps<StreamChatGenerics extends DefaultStre
     message: StreamMessage<StreamChatGenerics>;
     customMessageActions?: CustomMessageActions<StreamChatGenerics>;
 };
-/**
- * @deprecated alias for `CustomMessageActionsListProps`, will be removed in the next major release
- */
-export type CustomMessageActionsType<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = CustomMessageActionsListProps<StreamChatGenerics>;
 export declare const CustomMessageActionsList: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(props: CustomMessageActionsListProps<StreamChatGenerics>) => React.JSX.Element | null;
-//# sourceMappingURL=CustomMessageActionsList.d.ts.map

package/dist/components/MessageActions/CustomMessageActionsList.js

@@ -1,11 +1,11 @@
 import React from 'react';
-export var CustomMessageActionsList = function (props) {
-    var customMessageActions = props.customMessageActions, message = props.message;
+export const CustomMessageActionsList = (props) => {
+    const { customMessageActions, message } = props;
     if (!customMessageActions)
         return null;
-    var customActionsArray = Object.keys(customMessageActions);
-    return (React.createElement(React.Fragment, null, customActionsArray.map(function (customAction) {
-        var customHandler = customMessageActions[customAction];
-        return (React.createElement("button", { "aria-selected": 'false', className: 'str-chat__message-actions-list-item str-chat__message-actions-list-item-button', key: customAction, onClick: function (event) { return customHandler(message, event); }, role: 'option' }, customAction));
+    const customActionsArray = Object.keys(customMessageActions);
+    return (React.createElement(React.Fragment, null, customActionsArray.map((customAction) => {
+        const customHandler = customMessageActions[customAction];
+        return (React.createElement("button", { "aria-selected": 'false', className: 'str-chat__message-actions-list-item str-chat__message-actions-list-item-button', key: customAction, onClick: (event) => customHandler(message, event), role: 'option' }, customAction));
     })));
 };

package/dist/components/MessageActions/MessageActions.d.ts

@@ -16,4 +16,3 @@ export type MessageActionsWrapperProps = {
     inline?: boolean;
 };
 export {};
-//# sourceMappingURL=MessageActions.d.ts.map

package/dist/components/MessageActions/MessageActions.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 import React, { useCallback, useEffect, useRef, useState, } from 'react';
 import { MessageActionsBox } from './MessageActionsBox';
 import { ActionsIcon as DefaultActionsIcon } from '../Message/icons';
@@ -7,76 +6,79 @@ import { useChatContext } from '../../context/ChatContext';
 import { useMessageContext } from '../../context/MessageContext';
 import { useMessageActionsBoxPopper } from './hooks';
 import { useTranslationContext } from '../../context';
-export var MessageActions = function (props) {
-    var _a = props.ActionsIcon, ActionsIcon = _a === void 0 ? DefaultActionsIcon : _a, _b = props.customWrapperClass, customWrapperClass = _b === void 0 ? '' : _b, propGetMessageActions = props.getMessageActions, propHandleDelete = props.handleDelete, propHandleFlag = props.handleFlag, propHandleMarkUnread = props.handleMarkUnread, propHandleMute = props.handleMute, propHandlePin = props.handlePin, inline = props.inline, propMessage = props.message, messageWrapperRef = props.messageWrapperRef, mine = props.mine;
-    var mutes = useChatContext('MessageActions').mutes;
-    var _c = useMessageContext('MessageActions'), customMessageActions = _c.customMessageActions, contextGetMessageActions = _c.getMessageActions, contextHandleDelete = _c.handleDelete, contextHandleFlag = _c.handleFlag, contextHandleMarkUnread = _c.handleMarkUnread, contextHandleMute = _c.handleMute, contextHandlePin = _c.handlePin, isMyMessage = _c.isMyMessage, contextMessage = _c.message, setEditingState = _c.setEditingState;
-    var t = useTranslationContext('MessageActions').t;
-    var getMessageActions = propGetMessageActions || contextGetMessageActions;
-    var handleDelete = propHandleDelete || contextHandleDelete;
-    var handleFlag = propHandleFlag || contextHandleFlag;
-    var handleMarkUnread = propHandleMarkUnread || contextHandleMarkUnread;
-    var handleMute = propHandleMute || contextHandleMute;
-    var handlePin = propHandlePin || contextHandlePin;
-    var message = propMessage || contextMessage;
-    var isMine = mine ? mine() : isMyMessage();
-    var _d = useState(false), actionsBoxOpen = _d[0], setActionsBoxOpen = _d[1];
-    var isMuted = useCallback(function () { return isUserMuted(message, mutes); }, [message, mutes]);
-    var hideOptions = useCallback(function (event) {
+export const MessageActions = (props) => {
+    const { ActionsIcon = DefaultActionsIcon, customWrapperClass = '', getMessageActions: propGetMessageActions, handleDelete: propHandleDelete, handleFlag: propHandleFlag, handleMarkUnread: propHandleMarkUnread, handleMute: propHandleMute, handlePin: propHandlePin, inline, message: propMessage, messageWrapperRef, mine, } = props;
+    const { mutes } = useChatContext('MessageActions');
+    const { customMessageActions, getMessageActions: contextGetMessageActions, handleDelete: contextHandleDelete, handleFlag: contextHandleFlag, handleMarkUnread: contextHandleMarkUnread, handleMute: contextHandleMute, handlePin: contextHandlePin, isMyMessage, message: contextMessage, setEditingState, } = useMessageContext('MessageActions');
+    const { t } = useTranslationContext('MessageActions');
+    const getMessageActions = propGetMessageActions || contextGetMessageActions;
+    const handleDelete = propHandleDelete || contextHandleDelete;
+    const handleFlag = propHandleFlag || contextHandleFlag;
+    const handleMarkUnread = propHandleMarkUnread || contextHandleMarkUnread;
+    const handleMute = propHandleMute || contextHandleMute;
+    const handlePin = propHandlePin || contextHandlePin;
+    const message = propMessage || contextMessage;
+    const isMine = mine ? mine() : isMyMessage();
+    const [actionsBoxOpen, setActionsBoxOpen] = useState(false);
+    const isMuted = useCallback(() => isUserMuted(message, mutes), [message, mutes]);
+    const hideOptions = useCallback((event) => {
         if (event instanceof KeyboardEvent && event.key !== 'Escape') {
             return;
         }
         setActionsBoxOpen(false);
     }, []);
-    var messageActions = getMessageActions();
-    var messageDeletedAt = !!(message === null || message === void 0 ? void 0 : message.deleted_at);
-    useEffect(function () {
-        if (messageWrapperRef === null || messageWrapperRef === void 0 ? void 0 : messageWrapperRef.current) {
+    const messageActions = getMessageActions();
+    const messageDeletedAt = !!message?.deleted_at;
+    useEffect(() => {
+        if (messageWrapperRef?.current) {
             messageWrapperRef.current.addEventListener('mouseleave', hideOptions);
         }
     }, [hideOptions, messageWrapperRef]);
-    useEffect(function () {
+    useEffect(() => {
         if (messageDeletedAt) {
             document.removeEventListener('click', hideOptions);
         }
     }, [hideOptions, messageDeletedAt]);
-    useEffect(function () {
+    useEffect(() => {
         if (!actionsBoxOpen)
             return;
         document.addEventListener('click', hideOptions);
         document.addEventListener('keyup', hideOptions);
-        return function () {
+        return () => {
             document.removeEventListener('click', hideOptions);
             document.removeEventListener('keyup', hideOptions);
         };
     }, [actionsBoxOpen, hideOptions]);
-    var actionsBoxButtonRef = useRef(null);
-    var _e = useMessageActionsBoxPopper({
+    const actionsBoxButtonRef = useRef(null);
+    const { attributes, popperElementRef, styles } = useMessageActionsBoxPopper({
         open: actionsBoxOpen,
         placement: isMine ? 'top-end' : 'top-start',
         referenceElement: actionsBoxButtonRef.current,
-    }), attributes = _e.attributes, popperElementRef = _e.popperElementRef, styles = _e.styles;
+    });
     if (!messageActions.length && !customMessageActions)
         return null;
     return (React.createElement(MessageActionsWrapper, { customWrapperClass: customWrapperClass, inline: inline, setActionsBoxOpen: setActionsBoxOpen },
-        React.createElement(MessageActionsBox, __assign({}, attributes.popper, { getMessageActions: getMessageActions, handleDelete: handleDelete, handleEdit: setEditingState, handleFlag: handleFlag, handleMarkUnread: handleMarkUnread, handleMute: handleMute, handlePin: handlePin, isUserMuted: isMuted, mine: isMine, open: actionsBoxOpen, ref: popperElementRef, style: styles.popper })),
+        React.createElement(MessageActionsBox, { ...attributes.popper, getMessageActions: getMessageActions, handleDelete: handleDelete, handleEdit: setEditingState, handleFlag: handleFlag, handleMarkUnread: handleMarkUnread, handleMute: handleMute, handlePin: handlePin, isUserMuted: isMuted, mine: isMine, open: actionsBoxOpen, ref: popperElementRef, style: styles.popper }),
         React.createElement("button", { "aria-expanded": actionsBoxOpen, "aria-haspopup": 'true', "aria-label": t('aria/Open Message Actions Menu'), className: 'str-chat__message-actions-box-button', ref: actionsBoxButtonRef },
             React.createElement(ActionsIcon, { className: 'str-chat__message-action-icon' }))));
 };
-var MessageActionsWrapper = function (props) {
-    var children = props.children, customWrapperClass = props.customWrapperClass, inline = props.inline, setActionsBoxOpen = props.setActionsBoxOpen;
-    var defaultWrapperClass = "\n  str-chat__message-simple__actions__action\n  str-chat__message-simple__actions__action--options\n  str-chat__message-actions-container";
-    var wrapperClass = customWrapperClass || defaultWrapperClass;
-    var onClickOptionsAction = function (event) {
+const MessageActionsWrapper = (props) => {
+    const { children, customWrapperClass, inline, setActionsBoxOpen } = props;
+    const defaultWrapperClass = `
+  str-chat__message-simple__actions__action
+  str-chat__message-simple__actions__action--options
+  str-chat__message-actions-container`;
+    const wrapperClass = customWrapperClass || defaultWrapperClass;
+    const onClickOptionsAction = (event) => {
         event.stopPropagation();
-        setActionsBoxOpen(function (prev) { return !prev; });
+        setActionsBoxOpen((prev) => !prev);
     };
-    var wrapperProps = {
+    const wrapperProps = {
         className: wrapperClass,
         'data-testid': 'message-actions',
         onClick: onClickOptionsAction,
     };
     if (inline)
-        return React.createElement("span", __assign({}, wrapperProps), children);
-    return React.createElement("div", __assign({}, wrapperProps), children);
+        return React.createElement("span", { ...wrapperProps }, children);
+    return React.createElement("div", { ...wrapperProps }, children);
 };

package/dist/components/MessageActions/MessageActionsBox.d.ts

@@ -12,4 +12,3 @@ export type MessageActionsBoxProps<StreamChatGenerics extends DefaultStreamChatG
  */
 export declare const MessageActionsBox: React.ForwardRefExoticComponent<Omit<MessageActionsBoxProps<DefaultStreamChatGenerics>, "ref"> & React.RefAttributes<HTMLDivElement | null>>;
 export {};
-//# sourceMappingURL=MessageActionsBox.d.ts.map

package/dist/components/MessageActions/MessageActionsBox.js

@@ -1,31 +1,30 @@
-import { __assign, __rest } from "tslib";
 import React from 'react';
 import clsx from 'clsx';
 import { MESSAGE_ACTIONS } from '../Message/utils';
 import { useChannelActionContext, useComponentContext, useMessageContext, useTranslationContext, } from '../../context';
 import { CustomMessageActionsList as DefaultCustomMessageActionsList } from './CustomMessageActionsList';
-var UnMemoizedMessageActionsBox = React.forwardRef(function (props, ref) {
-    var getMessageActions = props.getMessageActions, handleDelete = props.handleDelete, handleEdit = props.handleEdit, handleFlag = props.handleFlag, handleMarkUnread = props.handleMarkUnread, handleMute = props.handleMute, handlePin = props.handlePin, isUserMuted = props.isUserMuted, mine = props.mine, _a = props.open, open = _a === void 0 ? false : _a, restDivProps = __rest(props, ["getMessageActions", "handleDelete", "handleEdit", "handleFlag", "handleMarkUnread", "handleMute", "handlePin", "isUserMuted", "mine", "open"]);
-    var _b = useComponentContext('MessageActionsBox').CustomMessageActionsList, CustomMessageActionsList = _b === void 0 ? DefaultCustomMessageActionsList : _b;
-    var setQuotedMessage = useChannelActionContext('MessageActionsBox').setQuotedMessage;
-    var _c = useMessageContext('MessageActionsBox'), customMessageActions = _c.customMessageActions, message = _c.message, threadList = _c.threadList;
-    var t = useTranslationContext('MessageActionsBox').t;
-    var messageActions = getMessageActions();
-    var handleQuote = function () {
+const UnMemoizedMessageActionsBox = React.forwardRef((props, ref) => {
+    const { getMessageActions, handleDelete, handleEdit, handleFlag, handleMarkUnread, handleMute, handlePin, isUserMuted, mine, open = false, ...restDivProps } = props;
+    const { CustomMessageActionsList = DefaultCustomMessageActionsList, } = useComponentContext('MessageActionsBox');
+    const { setQuotedMessage } = useChannelActionContext('MessageActionsBox');
+    const { customMessageActions, message, threadList } = useMessageContext('MessageActionsBox');
+    const { t } = useTranslationContext('MessageActionsBox');
+    const messageActions = getMessageActions();
+    const handleQuote = () => {
         setQuotedMessage(message);
-        var elements = message.parent_id
+        const elements = message.parent_id
             ? document.querySelectorAll('.str-chat__thread .str-chat__textarea__textarea')
             : document.getElementsByClassName('str-chat__textarea__textarea');
-        var textarea = elements.item(0);
+        const textarea = elements.item(0);
         if (textarea instanceof HTMLTextAreaElement) {
             textarea.focus();
         }
     };
-    var rootClassName = clsx('str-chat__message-actions-box', {
+    const rootClassName = clsx('str-chat__message-actions-box', {
         'str-chat__message-actions-box--open': open,
     });
-    var buttonClassName = 'str-chat__message-actions-list-item str-chat__message-actions-list-item-button';
-    return (React.createElement("div", __assign({}, restDivProps, { className: rootClassName, "data-testid": 'message-actions-box', ref: ref }),
+    const buttonClassName = 'str-chat__message-actions-list-item str-chat__message-actions-list-item-button';
+    return (React.createElement("div", { ...restDivProps, className: rootClassName, "data-testid": 'message-actions-box', ref: ref },
         React.createElement("div", { "aria-label": t('aria/Message Options'), className: 'str-chat__message-actions-list', role: 'listbox' },
             React.createElement(CustomMessageActionsList, { customMessageActions: customMessageActions, message: message }),
             messageActions.indexOf(MESSAGE_ACTIONS.quote) > -1 && (React.createElement("button", { "aria-selected": 'false', className: buttonClassName, onClick: handleQuote, role: 'option' }, t('Reply'))),
@@ -39,4 +38,4 @@ var UnMemoizedMessageActionsBox = React.forwardRef(function (props, ref) {
 /**
  * A popup box that displays the available actions on a message, such as edit, delete, pin, etc.
  */
-export var MessageActionsBox = React.memo(UnMemoizedMessageActionsBox);
+export const MessageActionsBox = React.memo(UnMemoizedMessageActionsBox);

package/dist/components/MessageActions/hooks/index.d.ts

@@ -1,2 +1 @@
 export * from './useMessageActionsBoxPopper';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/MessageActions/hooks/useMessageActionsBoxPopper.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { Placement } from '@popperjs/core';
 export interface MessageActionsBoxPopperOptions {
     open: boolean;
@@ -15,4 +16,3 @@ export declare function useMessageActionsBoxPopper<T extends HTMLElement>({ open
         [key: string]: import("react").CSSProperties;
     };
 };
-//# sourceMappingURL=useMessageActionsBoxPopper.d.ts.map

package/dist/components/MessageActions/hooks/useMessageActionsBoxPopper.js

@@ -1,9 +1,8 @@
 import { useEffect, useRef } from 'react';
 import { usePopper } from 'react-popper';
-export function useMessageActionsBoxPopper(_a) {
-    var open = _a.open, placement = _a.placement, referenceElement = _a.referenceElement;
-    var popperElementRef = useRef(null);
-    var _b = usePopper(referenceElement, popperElementRef.current, {
+export function useMessageActionsBoxPopper({ open, placement, referenceElement, }) {
+    const popperElementRef = useRef(null);
+    const { attributes, styles, update } = usePopper(referenceElement, popperElementRef.current, {
         modifiers: [
             {
                 name: 'eventListeners',
@@ -15,18 +14,18 @@ export function useMessageActionsBoxPopper(_a) {
                 },
             },
         ],
-        placement: placement,
-    }), attributes = _b.attributes, styles = _b.styles, update = _b.update;
-    useEffect(function () {
+        placement,
+    });
+    useEffect(() => {
         if (open) {
             // Since the popper's reference element might not be (and usually is not) visible
             // all the time, it's safer to force popper update before showing it.
-            update === null || update === void 0 ? void 0 : update();
+            update?.();
         }
     }, [open, update]);
     return {
-        attributes: attributes,
-        popperElementRef: popperElementRef,
-        styles: styles,
+        attributes,
+        popperElementRef,
+        styles,
     };
 }

package/dist/components/MessageActions/index.d.ts

@@ -1,4 +1,3 @@
 export * from './MessageActions';
 export * from './MessageActionsBox';
 export * from './CustomMessageActionsList';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/MessageBounce/MessageBounceModal.d.ts

@@ -5,4 +5,3 @@ export type MessageBounceModalProps = PropsWithChildren<ModalProps & {
     MessageBouncePrompt: ComponentType<MessageBouncePromptProps>;
 }>;
 export declare function MessageBounceModal({ MessageBouncePrompt, ...modalProps }: MessageBounceModalProps): React.JSX.Element;
-//# sourceMappingURL=MessageBounceModal.d.ts.map

package/dist/components/MessageBounce/MessageBounceModal.js

@@ -1,10 +1,8 @@
-import { __assign, __rest } from "tslib";
 import React from 'react';
 import { Modal } from '../Modal';
 import { MessageBounceProvider } from '../../context';
-export function MessageBounceModal(_a) {
-    var MessageBouncePrompt = _a.MessageBouncePrompt, modalProps = __rest(_a, ["MessageBouncePrompt"]);
-    return (React.createElement(Modal, __assign({ className: 'str-chat__message-bounce-modal' }, modalProps),
+export function MessageBounceModal({ MessageBouncePrompt, ...modalProps }) {
+    return (React.createElement(Modal, { className: 'str-chat__message-bounce-modal', ...modalProps },
         React.createElement(MessageBounceProvider, null,
             React.createElement(MessageBouncePrompt, { onClose: modalProps.onClose }))));
 }

package/dist/components/MessageBounce/MessageBouncePrompt.d.ts

@@ -4,4 +4,3 @@ import type { DefaultStreamChatGenerics } from '../../types/types';
 import type { ModalProps } from '../Modal';
 export type MessageBouncePromptProps = PropsWithChildren<Pick<ModalProps, 'onClose'>>;
 export declare function MessageBouncePrompt<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ children, onClose }: MessageBouncePromptProps): React.JSX.Element;
-//# sourceMappingURL=MessageBouncePrompt.d.ts.map

package/dist/components/MessageBounce/MessageBouncePrompt.js

@@ -1,17 +1,16 @@
 import React from 'react';
 import { useMessageBounceContext, useTranslationContext } from '../../context';
-export function MessageBouncePrompt(_a) {
-    var children = _a.children, onClose = _a.onClose;
-    var _b = useMessageBounceContext('MessageBouncePrompt'), handleDelete = _b.handleDelete, handleEdit = _b.handleEdit, handleRetry = _b.handleRetry;
-    var t = useTranslationContext('MessageBouncePrompt').t;
+export function MessageBouncePrompt({ children, onClose }) {
+    const { handleDelete, handleEdit, handleRetry } = useMessageBounceContext('MessageBouncePrompt');
+    const { t } = useTranslationContext('MessageBouncePrompt');
     function createHandler(handle) {
-        return function (e) {
+        return (e) => {
             handle(e);
-            onClose === null || onClose === void 0 ? void 0 : onClose(e);
+            onClose?.(e);
         };
     }
     return (React.createElement("div", { className: 'str-chat__message-bounce-prompt', "data-testid": 'message-bounce-prompt' },
-        React.createElement("div", { className: 'str-chat__message-bounce-prompt-header' }, children !== null && children !== void 0 ? children : t('This message did not meet our content guidelines')),
+        React.createElement("div", { className: 'str-chat__message-bounce-prompt-header' }, children ?? t('This message did not meet our content guidelines')),
         React.createElement("div", { className: 'str-chat__message-bounce-actions' },
             React.createElement("button", { className: 'str-chat__message-bounce-edit', "data-testid": 'message-bounce-edit', onClick: createHandler(handleEdit), type: 'button' }, t('Edit Message')),
             React.createElement("button", { className: 'str-chat__message-bounce-send', "data-testid": 'message-bounce-send', onClick: createHandler(handleRetry) }, t('Send Anyway')),

package/dist/components/MessageBounce/index.d.ts

@@ -1,3 +1,2 @@
 export * from './MessageBounceModal';
 export * from './MessageBouncePrompt';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/MessageInput/AttachmentPreviewList/AttachmentPreviewList.d.ts

@@ -13,4 +13,3 @@ export type AttachmentPreviewListProps<StreamChatGenerics extends DefaultStreamC
     VoiceRecordingPreview?: ComponentType<VoiceRecordingPreviewProps<StreamChatGenerics>>;
 };
 export declare const AttachmentPreviewList: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ AudioAttachmentPreview, FileAttachmentPreview, ImageAttachmentPreview, UnsupportedAttachmentPreview, VideoAttachmentPreview, VoiceRecordingPreview, }: AttachmentPreviewListProps<StreamChatGenerics>) => React.JSX.Element;
-//# sourceMappingURL=AttachmentPreviewList.d.ts.map