stream-chat-react 13.14.3 → 14.0.0-beta.2

package/dist/components/MessageInput/hooks/useCreateMessageInputContext.js

@@ -1,41 +0,0 @@
-import { useMemo } from 'react';
-export const useCreateMessageInputContext = (value) => {
-    const { additionalTextareaProps, asyncMessagesMultiSendEnabled, audioRecordingEnabled, clearEditingState, cooldownInterval, cooldownRemaining, emojiSearchIndex, focus, handleSubmit, hideSendButton, isThreadInput, maxRows, minRows, onPaste, parent, recordingController, setCooldownRemaining, shouldSubmit, textareaRef, } = value;
-    const parentId = parent?.id;
-    const messageInputContext = useMemo(() => ({
-        additionalTextareaProps,
-        asyncMessagesMultiSendEnabled,
-        audioRecordingEnabled,
-        clearEditingState,
-        cooldownInterval,
-        cooldownRemaining,
-        emojiSearchIndex,
-        focus,
-        handleSubmit,
-        hideSendButton,
-        isThreadInput,
-        maxRows,
-        minRows,
-        onPaste,
-        parent,
-        recordingController,
-        setCooldownRemaining,
-        shouldSubmit,
-        textareaRef,
-    }), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        asyncMessagesMultiSendEnabled,
-        audioRecordingEnabled,
-        cooldownInterval,
-        cooldownRemaining,
-        emojiSearchIndex,
-        handleSubmit,
-        hideSendButton,
-        isThreadInput,
-        minRows,
-        parentId,
-        recordingController,
-    ]);
-    return messageInputContext;
-};

package/dist/components/MessageInput/hooks/useMessageComposer.d.ts

@@ -1,2 +0,0 @@
-import { MessageComposer } from 'stream-chat';
-export declare const useMessageComposer: () => MessageComposer;

package/dist/components/MessageInput/hooks/useMessageComposer.js

@@ -1,82 +0,0 @@
-import { useEffect, useMemo } from 'react';
-import { FixedSizeQueueCache, MessageComposer } from 'stream-chat';
-import { useThreadContext } from '../../Threads';
-import { useChannelStateContext, useChatContext, useMessageContext, } from '../../../context';
-import { useLegacyThreadContext } from '../../Thread';
-const queueCache = new FixedSizeQueueCache(64);
-export const useMessageComposer = () => {
-    const { client } = useChatContext();
-    const { channel } = useChannelStateContext();
-    const { editing, message: editedMessage } = useMessageContext();
-    // legacy thread will receive new composer
-    const { legacyThread: parentMessage } = useLegacyThreadContext();
-    const threadInstance = useThreadContext();
-    const cachedEditedMessage = useMemo(() => {
-        if (!editedMessage)
-            return undefined;
-        return editedMessage;
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [editedMessage?.id]);
-    const cachedParentMessage = useMemo(() => {
-        if (!parentMessage)
-            return undefined;
-        return parentMessage;
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [parentMessage?.id]);
-    // composer hierarchy
-    // edited message (always new) -> thread instance (own) -> thread message (always new) -> channel (own)
-    // editedMessage ?? thread ?? parentMessage ?? channel;
-    const messageComposer = useMemo(() => {
-        if (editing && cachedEditedMessage) {
-            const tag = MessageComposer.constructTag(cachedEditedMessage);
-            const cachedComposer = queueCache.get(tag);
-            if (cachedComposer) {
-                cachedComposer.editedMessage = cachedEditedMessage;
-                return cachedComposer;
-            }
-            return new MessageComposer({
-                client,
-                composition: cachedEditedMessage,
-                compositionContext: cachedEditedMessage,
-            });
-        }
-        else if (threadInstance) {
-            return threadInstance.messageComposer;
-        }
-        else if (cachedParentMessage) {
-            const compositionContext = {
-                ...cachedParentMessage,
-                legacyThreadId: cachedParentMessage.id,
-            };
-            const tag = MessageComposer.constructTag(compositionContext);
-            const cachedComposer = queueCache.get(tag);
-            if (cachedComposer)
-                return cachedComposer;
-            return new MessageComposer({
-                client,
-                compositionContext,
-            });
-        }
-        else {
-            return channel.messageComposer;
-        }
-    }, [
-        cachedEditedMessage,
-        cachedParentMessage,
-        channel,
-        client,
-        editing,
-        threadInstance,
-    ]);
-    if (['legacy_thread', 'message'].includes(messageComposer.contextType) &&
-        !queueCache.peek(messageComposer.tag)) {
-        queueCache.add(messageComposer.tag, messageComposer);
-    }
-    useEffect(() => {
-        const unsubscribe = messageComposer.registerSubscriptions();
-        return () => {
-            unsubscribe();
-        };
-    }, [messageComposer]);
-    return messageComposer;
-};

package/dist/components/MessageInput/hooks/useMessageComposerHasSendableData.d.ts

@@ -1 +0,0 @@
-export declare const useMessageComposerHasSendableData: () => boolean;

package/dist/components/MessageInput/hooks/useMessageComposerHasSendableData.js

@@ -1,8 +0,0 @@
-import { useMessageComposer } from './useMessageComposer';
-import { useStateStore } from '../../../store';
-const editingAuditStateStateSelector = (state) => state;
-export const useMessageComposerHasSendableData = () => {
-    const messageComposer = useMessageComposer();
-    useStateStore(messageComposer.editingAuditState, editingAuditStateStateSelector);
-    return messageComposer.hasSendableData;
-};

package/dist/components/MessageInput/hooks/useMessageInputControls.d.ts

@@ -1,10 +0,0 @@
-import type React from 'react';
-import type { RecordingController } from '../../MediaRecorder/hooks/useMediaRecorder';
-import type { MessageInputProps } from '../MessageInput';
-export type MessageInputHookProps = {
-    handleSubmit: (event?: React.BaseSyntheticEvent) => void;
-    onPaste: (event: React.ClipboardEvent<HTMLTextAreaElement>) => void;
-    recordingController: RecordingController;
-    textareaRef: React.MutableRefObject<HTMLTextAreaElement | null | undefined>;
-};
-export declare const useMessageInputControls: (props: MessageInputProps) => MessageInputHookProps;

package/dist/components/MessageInput/hooks/useMessageInputControls.js

@@ -1,22 +0,0 @@
-import { useTextareaRef } from './useTextareaRef';
-import { useSubmitHandler } from './useSubmitHandler';
-import { usePasteHandler } from './usePasteHandler';
-import { useMediaRecorder } from '../../MediaRecorder/hooks/useMediaRecorder';
-export const useMessageInputControls = (props) => {
-    const { asyncMessagesMultiSendEnabled, audioRecordingConfig, audioRecordingEnabled } = props;
-    const { textareaRef } = useTextareaRef(props);
-    const { handleSubmit } = useSubmitHandler(props);
-    const recordingController = useMediaRecorder({
-        asyncMessagesMultiSendEnabled,
-        enabled: !!audioRecordingEnabled,
-        handleSubmit,
-        recordingConfig: audioRecordingConfig,
-    });
-    const { onPaste } = usePasteHandler();
-    return {
-        handleSubmit,
-        onPaste,
-        recordingController,
-        textareaRef,
-    };
-};

package/dist/components/MessageInput/hooks/usePasteHandler.d.ts

@@ -1,3 +0,0 @@
-export declare const usePasteHandler: () => {
-    onPaste: (clipboardEvent: React.ClipboardEvent<HTMLTextAreaElement>) => void;
-};

package/dist/components/MessageInput/hooks/usePasteHandler.js

@@ -1,36 +0,0 @@
-import { useCallback } from 'react';
-import { useMessageComposer } from './useMessageComposer';
-import { dataTransferItemsToFiles } from '../../ReactFileUtilities';
-export const usePasteHandler = () => {
-    const { attachmentManager, textComposer } = useMessageComposer();
-    const onPaste = useCallback((clipboardEvent) => {
-        (async (event) => {
-            const { items } = event.clipboardData;
-            event.preventDefault();
-            // Get a promise for the plain text in case no files are
-            // found. This needs to be done here because chrome cleans
-            // up the DataTransferItems after resolving of a promise.
-            let plainTextPromise = undefined;
-            for (let i = 0; i < items.length; i++) {
-                const item = items[i];
-                if (item.kind === 'string' && item.type === 'text/plain') {
-                    plainTextPromise = new Promise((resolve) => {
-                        item.getAsString((string) => {
-                            resolve(string);
-                        });
-                    });
-                    break;
-                }
-            }
-            const fileLikes = await dataTransferItemsToFiles(Array.from(items));
-            if (plainTextPromise) {
-                const pastedText = await plainTextPromise;
-                textComposer.insertText({ text: pastedText });
-            }
-            else {
-                attachmentManager.uploadFiles(fileLikes);
-            }
-        })(clipboardEvent);
-    }, [attachmentManager, textComposer]);
-    return { onPaste };
-};

package/dist/components/MessageInput/hooks/useSubmitHandler.d.ts

@@ -1,4 +0,0 @@
-import type { MessageInputProps } from '../MessageInput';
-export declare const useSubmitHandler: (props: MessageInputProps) => {
-    handleSubmit: (event?: React.BaseSyntheticEvent) => Promise<void>;
-};

package/dist/components/MessageInput/hooks/useSubmitHandler.js

@@ -1,87 +0,0 @@
-import { useCallback } from 'react';
-import { MessageComposer } from 'stream-chat';
-import { useMessageComposer } from './useMessageComposer';
-import { useChannelActionContext } from '../../../context/ChannelActionContext';
-import { useTranslationContext } from '../../../context/TranslationContext';
-const takeStateSnapshot = (messageComposer) => {
-    const textComposerState = messageComposer.textComposer.state.getLatestValue();
-    const attachmentManagerState = messageComposer.attachmentManager.state.getLatestValue();
-    const linkPreviewsManagerState = messageComposer.linkPreviewsManager.state.getLatestValue();
-    const pollComposerState = messageComposer.pollComposer.state.getLatestValue();
-    const customDataManagerState = messageComposer.customDataManager.state.getLatestValue();
-    const state = messageComposer.state.getLatestValue();
-    return () => {
-        messageComposer.state.next(state);
-        messageComposer.textComposer.state.next(textComposerState);
-        messageComposer.attachmentManager.state.next(attachmentManagerState);
-        messageComposer.linkPreviewsManager.state.next(linkPreviewsManagerState);
-        messageComposer.pollComposer.state.next(pollComposerState);
-        messageComposer.customDataManager.state.next(customDataManagerState);
-    };
-};
-export const useSubmitHandler = (props) => {
-    const { clearEditingState, overrideSubmitHandler } = props;
-    const { addNotification, editMessage, sendMessage } = useChannelActionContext('useSubmitHandler');
-    const { t } = useTranslationContext('useSubmitHandler');
-    const messageComposer = useMessageComposer();
-    const handleSubmit = useCallback(async (event) => {
-        event?.preventDefault();
-        const composition = await messageComposer.compose();
-        if (!composition || !composition.message)
-            return;
-        const { localMessage, message, sendOptions } = composition;
-        if (messageComposer.editedMessage && localMessage.type !== 'error') {
-            try {
-                await editMessage(localMessage, sendOptions);
-                clearEditingState?.();
-            }
-            catch (err) {
-                addNotification(t('Edit message request failed'), 'error');
-            }
-        }
-        else {
-            const restoreComposerStateSnapshot = takeStateSnapshot(messageComposer);
-            try {
-                // FIXME: once MessageComposer has sendMessage method, then the following condition should be encapsulated by it
-                // keep attachments, text, quoted message (treat them as draft) ... if sending a poll
-                const sentPollMessage = !!message.poll_id;
-                if (sentPollMessage) {
-                    messageComposer.state.partialNext({
-                        id: MessageComposer.generateId(),
-                        pollId: null,
-                    });
-                }
-                else {
-                    messageComposer.clear();
-                }
-                // todo: get rid of overrideSubmitHandler once MessageComposer supports submission flow
-                if (overrideSubmitHandler) {
-                    await overrideSubmitHandler({
-                        cid: messageComposer.channel.cid,
-                        localMessage,
-                        message,
-                        sendOptions,
-                    });
-                }
-                else {
-                    await sendMessage({ localMessage, message, options: sendOptions });
-                }
-                if (messageComposer.config.text.publishTypingEvents)
-                    await messageComposer.channel.stopTyping();
-            }
-            catch (err) {
-                restoreComposerStateSnapshot();
-                addNotification(t('Send message request failed'), 'error');
-            }
-        }
-    }, [
-        addNotification,
-        clearEditingState,
-        editMessage,
-        messageComposer,
-        overrideSubmitHandler,
-        sendMessage,
-        t,
-    ]);
-    return { handleSubmit };
-};

package/dist/components/MessageInput/hooks/useTextareaRef.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import type { MessageInputProps } from '../MessageInput';
-export declare const useTextareaRef: (props: MessageInputProps) => {
-    textareaRef: import("react").RefObject<HTMLTextAreaElement | undefined>;
-};

package/dist/components/MessageInput/hooks/useTextareaRef.js

@@ -1,14 +0,0 @@
-import { useEffect, useRef } from 'react';
-export const useTextareaRef = (props) => {
-    const { focus } = props;
-    const textareaRef = useRef(undefined);
-    // Focus
-    useEffect(() => {
-        if (focus && textareaRef.current) {
-            textareaRef.current.focus();
-        }
-    }, [focus]);
-    return {
-        textareaRef,
-    };
-};

package/dist/components/MessageInput/hooks/useTimer.d.ts

@@ -1,3 +0,0 @@
-export declare const useTimer: ({ startFrom }: {
-    startFrom: number;
-}) => number | undefined;

package/dist/components/MessageInput/hooks/useTimer.js

@@ -1,19 +0,0 @@
-import { useEffect, useState } from 'react';
-export const useTimer = ({ startFrom }) => {
-    const [secondsLeft, setSecondsLeft] = useState();
-    useEffect(() => {
-        let countdownTimeout;
-        if (typeof secondsLeft === 'number' && secondsLeft > 0) {
-            countdownTimeout = setTimeout(() => {
-                setSecondsLeft(secondsLeft - 1);
-            }, 1000);
-        }
-        return () => {
-            clearTimeout(countdownTimeout);
-        };
-    }, [secondsLeft]);
-    useEffect(() => {
-        setSecondsLeft(startFrom ?? 0);
-    }, [startFrom]);
-    return secondsLeft;
-};

package/dist/components/MessageInput/hooks/utils.d.ts

@@ -1 +0,0 @@
-export declare function prettifyFileSize(bytes: number, precision?: number): string;

package/dist/components/MessageInput/hooks/utils.js

@@ -1,7 +0,0 @@
-export function prettifyFileSize(bytes, precision = 3) {
-    const units = ['B', 'kB', 'MB', 'GB'];
-    const exponent = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
-    const mantissa = bytes / 1024 ** exponent;
-    const formattedMantissa = precision === 0 ? Math.round(mantissa).toString() : mantissa.toPrecision(precision);
-    return `${formattedMantissa} ${units[exponent]}`;
-}

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

@@ -1,15 +0,0 @@
-import React from 'react';
-export declare const LoadingIndicatorIcon: ({ size }: {
-    size?: number;
-}) => React.JSX.Element;
-export declare const UploadIcon: () => React.JSX.Element;
-export declare const CloseIcon: () => React.JSX.Element;
-export declare const RetryIcon: () => React.JSX.Element;
-export declare const DownloadIcon: () => React.JSX.Element;
-export declare const LinkIcon: () => React.JSX.Element;
-export declare const SendIcon: () => React.JSX.Element;
-export declare const MicIcon: () => React.JSX.Element;
-export declare const BinIcon: () => React.JSX.Element;
-export declare const PauseIcon: () => React.JSX.Element;
-export declare const PlayIcon: () => React.JSX.Element;
-export declare const CheckSignIcon: () => React.JSX.Element;

package/dist/components/MessageInput/icons.js

@@ -1,48 +0,0 @@
-import React, { useMemo } from 'react';
-import { nanoid } from 'nanoid';
-import { useTranslationContext } from '../../context/TranslationContext';
-export const LoadingIndicatorIcon = ({ size = 20 }) => {
-    const id = useMemo(() => nanoid(), []);
-    return (React.createElement("div", { className: 'str-chat__loading-indicator' },
-        React.createElement("svg", { "data-testid": 'loading-indicator', height: size, viewBox: '0 0 30 30', width: size, xmlns: 'http://www.w3.org/2000/svg' },
-            React.createElement("defs", null,
-                React.createElement("linearGradient", { id: `${id}-linear-gradient`, x1: '50%', x2: '50%', y1: '0%', y2: '100%' },
-                    React.createElement("stop", { offset: '0%', stopColor: '#FFF', stopOpacity: '0' }),
-                    React.createElement("stop", { "data-testid": 'stop-color', offset: '100%', stopOpacity: '1' }))),
-            React.createElement("path", { d: 'M2.518 23.321l1.664-1.11A12.988 12.988 0 0 0 15 28c7.18 0 13-5.82 13-13S22.18 2 15 2V0c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15-5.206 0-9.792-2.652-12.482-6.679z', fill: `url(#${id}-linear-gradient)`, fillRule: 'evenodd' }))));
-};
-export const UploadIcon = () => {
-    const { t } = useTranslationContext('UploadIcon');
-    return (React.createElement("svg", { "data-testid": 'attach-icon', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-        React.createElement("title", null, t('Attach files')),
-        React.createElement("g", { clipPath: 'url(#clip0_10878_5)' },
-            React.createElement("path", { d: 'M12.9997 6.99993L10.9997 6.99993L10.9997 10.9999L6.99972 10.9999L6.99972 12.9999L10.9997 12.9999L10.9997 16.9999L12.9997 16.9999L12.9997 12.9999L16.9997 12.9999L16.9997 10.9999L12.9997 10.9999L12.9997 6.99993ZM11.9997 1.99992C6.47972 1.99992 1.99972 6.47993 1.99972 11.9999C1.99972 17.5199 6.47972 21.9999 11.9997 21.9999C17.5197 21.9999 21.9997 17.5199 21.9997 11.9999C21.9997 6.47993 17.5197 1.99992 11.9997 1.99992ZM11.9997 19.9999C7.58972 19.9999 3.99972 16.4099 3.99972 11.9999C3.99972 7.58993 7.58972 3.99993 11.9997 3.99993C16.4097 3.99993 19.9997 7.58993 19.9997 11.9999C19.9997 16.4099 16.4097 19.9999 11.9997 19.9999Z', fill: 'black' })),
-        React.createElement("defs", null,
-            React.createElement("clipPath", { id: 'clip0_10878_5' },
-                React.createElement("rect", { fill: 'white', height: '24', width: '24' })))));
-};
-export const CloseIcon = () => (React.createElement("svg", { "data-testid": 'close-no-outline', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z', fill: 'black' })));
-export const RetryIcon = () => (React.createElement("svg", { "data-testid": 'retry', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M17.6449 6.35C16.1949 4.9 14.2049 4 11.9949 4C7.57488 4 4.00488 7.58 4.00488 12C4.00488 16.42 7.57488 20 11.9949 20C15.7249 20 18.8349 17.45 19.7249 14H17.6449C16.8249 16.33 14.6049 18 11.9949 18C8.68488 18 5.99488 15.31 5.99488 12C5.99488 8.69 8.68488 6 11.9949 6C13.6549 6 15.1349 6.69 16.2149 7.78L12.9949 11H19.9949V4L17.6449 6.35Z', fill: 'black' })));
-export const DownloadIcon = () => (React.createElement("svg", { "data-testid": 'download', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM19 18H6C3.79 18 2 16.21 2 14C2 11.95 3.53 10.24 5.56 10.03L6.63 9.92L7.13 8.97C8.08 7.14 9.94 6 12 6C14.62 6 16.88 7.86 17.39 10.43L17.69 11.93L19.22 12.04C20.78 12.14 22 13.45 22 15C22 16.65 20.65 18 19 18ZM13.45 10H10.55V13H8L12 17L16 13H13.45V10Z', fill: 'black' })));
-export const LinkIcon = () => (React.createElement("svg", { fill: 'none', height: '11', viewBox: '0 0 20 11', width: '20', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { clipRule: 'evenodd', d: 'M1.9 5.5C1.9 3.79 3.29 2.4 5 2.4H8.05C8.57467 2.4 9 1.97467 9 1.45C9 0.925329 8.57467 0.5 8.05 0.5H5C2.24 0.5 0 2.74 0 5.5C0 8.26 2.24 10.5 5 10.5H8.05C8.57467 10.5 9 10.0747 9 9.55C9 9.02533 8.57467 8.6 8.05 8.6H5C3.29 8.6 1.9 7.21 1.9 5.5ZM6 5.5C6 6.05228 6.44772 6.5 7 6.5H13C13.5523 6.5 14 6.05228 14 5.5C14 4.94772 13.5523 4.5 13 4.5H7C6.44772 4.5 6 4.94772 6 5.5ZM15 0.5H11.95C11.4253 0.5 11 0.925329 11 1.45C11 1.97467 11.4253 2.4 11.95 2.4H15C16.71 2.4 18.1 3.79 18.1 5.5C18.1 7.21 16.71 8.6 15 8.6H11.95C11.4253 8.6 11 9.02533 11 9.55C11 10.0747 11.4253 10.5 11.95 10.5H15C17.76 10.5 20 8.26 20 5.5C20 2.74 17.76 0.5 15 0.5Z', fill: '#005DFF', fillRule: 'evenodd' })));
-export const SendIcon = () => {
-    const { t } = useTranslationContext('SendButton');
-    return (React.createElement("svg", { "data-testid": 'send', fill: 'currentColor', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-        React.createElement("title", null, t('Send')),
-        React.createElement("path", { d: 'M4.00952 22L24 12L4.00952 2L4 9.77778L18.2857 12L4 14.2222L4.00952 22Z' })));
-};
-export const MicIcon = () => (React.createElement("svg", { fill: 'currentColor', viewBox: '0 0 14 20', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M7 12.5C8.66 12.5 10 11.16 10 9.5V3.5C10 1.84 8.66 0.5 7 0.5C5.34 0.5 4 1.84 4 3.5V9.5C4 11.16 5.34 12.5 7 12.5Z' }),
-    React.createElement("path", { d: 'M12 9.5C12 12.26 9.76 14.5 7 14.5C4.24 14.5 2 12.26 2 9.5H0C0 13.03 2.61 15.93 6 16.42V19.5H8V16.42C11.39 15.93 14 13.03 14 9.5H12Z' })));
-export const BinIcon = () => (React.createElement("svg", { fill: 'currentColor', viewBox: '0 0 32 32', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M8.00033 25.3333C8.00033 26.8 9.20033 28 10.667 28H21.3337C22.8003 28 24.0003 26.8 24.0003 25.3333V12C24.0003 10.5333 22.8003 9.33333 21.3337 9.33333H10.667C9.20033 9.33333 8.00033 10.5333 8.00033 12V25.3333ZM24.0003 5.33333H20.667L19.7203 4.38667C19.4803 4.14667 19.1337 4 18.787 4H13.2137C12.867 4 12.5203 4.14667 12.2803 4.38667L11.3337 5.33333H8.00033C7.26699 5.33333 6.66699 5.93333 6.66699 6.66667C6.66699 7.4 7.26699 8 8.00033 8H24.0003C24.7337 8 25.3337 7.4 25.3337 6.66667C25.3337 5.93333 24.7337 5.33333 24.0003 5.33333Z' })));
-export const PauseIcon = () => (React.createElement("svg", { "data-testid": 'str-chat__pause-icon', fill: 'currentColor', viewBox: '0 0 16 20', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M0 19.3333H5.33333V0.666626H0V19.3333ZM10.6667 0.666626V19.3333H16V0.666626H10.6667Z' })));
-export const PlayIcon = () => (React.createElement("svg", { "data-testid": 'str-chat__play-icon', fill: 'currentColor', viewBox: '0 0 14 18', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M0.236328 2.09338V15.9067C0.236328 16.9601 1.39633 17.6001 2.28966 17.0267L13.143 10.1201C13.9697 9.60005 13.9697 8.40005 13.143 7.86672L2.28966 0.973385C1.39633 0.400051 0.236328 1.04005 0.236328 2.09338Z' })));
-export const CheckSignIcon = () => (React.createElement("svg", { fill: 'currentColor', viewBox: '0 0 18 14', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M5.79457 10.875L2.32457 7.40502C1.93457 7.01502 1.30457 7.01502 0.91457 7.40502C0.52457 7.79502 0.52457 8.42502 0.91457 8.81502L5.09457 12.995C5.48457 13.385 6.11457 13.385 6.50457 12.995L17.0846 2.41502C17.4746 2.02502 17.4746 1.39502 17.0846 1.00502C16.6946 0.615024 16.0646 0.615024 15.6746 1.00502L5.79457 10.875Z' })));

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

@@ -1,13 +0,0 @@
-export * from './AttachmentSelector';
-export { AttachmentPreviewList } from './AttachmentPreviewList';
-export type { AttachmentPreviewListProps, FileAttachmentPreviewProps, GeolocationPreviewProps, ImageAttachmentPreviewProps, AttachmentPreviewProps, UnsupportedAttachmentPreviewProps, VoiceRecordingPreviewProps, } from './AttachmentPreviewList';
-export * from './CooldownTimer';
-export * from './EditMessageForm';
-export * from './hooks';
-export * from './icons';
-export * from './LinkPreviewList';
-export * from './MessageInput';
-export * from './MessageInputFlat';
-export * from './QuotedMessagePreview';
-export * from './SendButton';
-export { WithDragAndDropUpload } from './WithDragAndDropUpload';

package/dist/components/MessageInput/index.js

@@ -1,12 +0,0 @@
-export * from './AttachmentSelector';
-export { AttachmentPreviewList } from './AttachmentPreviewList';
-export * from './CooldownTimer';
-export * from './EditMessageForm';
-export * from './hooks';
-export * from './icons';
-export * from './LinkPreviewList';
-export * from './MessageInput';
-export * from './MessageInputFlat';
-export * from './QuotedMessagePreview';
-export * from './SendButton';
-export { WithDragAndDropUpload } from './WithDragAndDropUpload';

package/dist/components/MessageList/ConnectionStatus.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const ConnectionStatus: React.MemoExoticComponent<() => React.JSX.Element>;

package/dist/components/MessageList/ConnectionStatus.js

@@ -1,19 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { CustomNotification } from './CustomNotification';
-import { useChatContext, useTranslationContext } from '../../context';
-const UnMemoizedConnectionStatus = () => {
-    const { client } = useChatContext('ConnectionStatus');
-    const { t } = useTranslationContext('ConnectionStatus');
-    const [online, setOnline] = useState(true);
-    useEffect(() => {
-        const connectionChanged = ({ online: onlineStatus = false }) => {
-            if (online !== onlineStatus) {
-                setOnline(onlineStatus);
-            }
-        };
-        client.on('connection.changed', connectionChanged);
-        return () => client.off('connection.changed', connectionChanged);
-    }, [client, online]);
-    return (React.createElement(CustomNotification, { active: !online, className: 'str-chat__connection-status-notification', type: 'error' }, t('Connection failure, reconnecting now...')));
-};
-export const ConnectionStatus = React.memo(UnMemoizedConnectionStatus);

package/dist/components/MessageList/CustomNotification.d.ts

@@ -1,9 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-import type { NotificationSeverity } from 'stream-chat';
-export type CustomNotificationProps = {
-    type?: NotificationSeverity | string;
-    active?: boolean;
-    className?: string;
-};
-export declare const CustomNotification: (props: PropsWithChildren<CustomNotificationProps>) => React.JSX.Element | null;

package/dist/components/MessageList/CustomNotification.js

@@ -1,9 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-const UnMemoizedCustomNotification = (props) => {
-    const { active, children, className, type } = props;
-    if (!active)
-        return null;
-    return (React.createElement("div", { "aria-live": 'polite', className: clsx(`str-chat__custom-notification`, `str-chat__notification`, `str-chat-react__notification`, { [`notification-${type}`]: type }, className), "data-testid": 'custom-notification' }, children));
-};
-export const CustomNotification = React.memo(UnMemoizedCustomNotification);

package/dist/components/MessageList/GiphyPreviewMessage.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { LocalMessage } from 'stream-chat';
-export type GiphyPreviewMessageProps = {
-    message: LocalMessage;
-};
-export declare const GiphyPreviewMessage: (props: GiphyPreviewMessageProps) => React.JSX.Element;

package/dist/components/MessageList/GiphyPreviewMessage.js

@@ -1,7 +0,0 @@
-import React from 'react';
-import { Message } from '../Message/Message';
-export const GiphyPreviewMessage = (props) => {
-    const { message } = props;
-    return (React.createElement("div", { className: 'giphy-preview-message' },
-        React.createElement(Message, { message: message })));
-};

package/dist/components/MessageList/MessageList.d.ts

@@ -1,77 +0,0 @@
-import React from 'react';
-import type { ChannelActionContextValue } from '../../context/ChannelActionContext';
-import type { InfiniteScrollProps } from '../InfiniteScrollPaginator/InfiniteScroll';
-import type { LocalMessage } from 'stream-chat';
-import type { MessageRenderer } from './renderMessages';
-import type { GroupStyle, ProcessMessagesParams, RenderedMessage } from './utils';
-import type { MessageProps } from '../Message/types';
-type PropsDrilledToMessage = 'additionalMessageInputProps' | 'closeReactionSelectorOnClick' | 'customMessageActions' | 'disableQuotedMessages' | 'formatDate' | 'getDeleteMessageErrorNotification' | 'getFlagMessageErrorNotification' | 'getFlagMessageSuccessNotification' | 'getMarkMessageUnreadErrorNotification' | 'getMarkMessageUnreadSuccessNotification' | 'getMuteUserErrorNotification' | 'getMuteUserSuccessNotification' | 'getPinMessageErrorNotification' | 'Message' | 'messageActions' | 'onlySenderCanEdit' | 'onMentionsClick' | 'onMentionsHover' | 'onUserClick' | 'onUserHover' | 'openThread' | 'pinPermissions' | 'reactionDetailsSort' | 'renderText' | 'retrySendMessage' | 'sortReactions' | 'sortReactionDetails' | 'unsafeHTML';
-export type MessageListProps = Partial<Pick<MessageProps, PropsDrilledToMessage>> & {
-    /** Disables the injection of date separator components in MessageList, defaults to `false` */
-    disableDateSeparator?: boolean;
-    /** Callback function to set group styles for each message */
-    groupStyles?: (message: RenderedMessage, previousMessage: RenderedMessage, nextMessage: RenderedMessage, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle;
-    /** Whether the list has more items to load */
-    hasMore?: boolean;
-    /** Element to be rendered at the top of the thread message list. By default, these are the Message and ThreadStart components */
-    head?: React.ReactElement;
-    /** Position to render HeaderComponent */
-    headerPosition?: number;
-    /** Hides the MessageDeleted components from the list, defaults to `false` */
-    hideDeletedMessages?: boolean;
-    /** Hides the DateSeparator component when new messages are received in a channel that's watched but not active, defaults to false */
-    hideNewMessageSeparator?: boolean;
-    /** Overrides the default props passed to [InfiniteScroll](https://github.com/GetStream/stream-chat-react/blob/master/src/components/InfiniteScrollPaginator/InfiniteScroll.tsx) */
-    internalInfiniteScrollProps?: Partial<InfiniteScrollProps>;
-    /** Function called when latest messages should be loaded, after the list has jumped at an earlier message set */
-    jumpToLatestMessage?: () => Promise<void>;
-    /** Whether or not the list is currently loading more items */
-    loadingMore?: boolean;
-    /** Whether or not the list is currently loading newer items */
-    loadingMoreNewer?: boolean;
-    /** Function called when more messages are to be loaded, defaults to function stored in [ChannelActionContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_action_context/) */
-    loadMore?: ChannelActionContextValue['loadMore'] | (() => Promise<void>);
-    /** Function called when newer messages are to be loaded, defaults to function stored in [ChannelActionContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_action_context/) */
-    loadMoreNewer?: ChannelActionContextValue['loadMoreNewer'] | (() => Promise<void>);
-    /** Maximum time in milliseconds that should occur between messages to still consider them grouped together */
-    maxTimeBetweenGroupedMessages?: number;
-    /** The limit to use when paginating messages */
-    messageLimit?: number;
-    /** The messages to render in the list, defaults to messages stored in [ChannelStateContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_state_context/) */
-    messages?: LocalMessage[];
-    /** If true, turns off message UI grouping by user */
-    noGroupByUser?: boolean;
-    /** Overrides the way MessageList renders messages */
-    renderMessages?: MessageRenderer;
-    /** If true, `readBy` data supplied to the `Message` components will include all user read states per sent message */
-    returnAllReadData?: boolean;
-    /**
-     * Allows to review changes introduced to messages array on per message basis (e.g. date separator injection before a message).
-     * The array returned from the function is appended to the array of messages that are later rendered into React elements in the `MessageList`.
-     */
-    reviewProcessedMessage?: ProcessMessagesParams['reviewProcessedMessage'];
-    /**
-     * The pixel threshold under which the message list is considered to be so near to the bottom,
-     * so that if a new message is delivered, the list will be scrolled to the absolute bottom.
-     * Defaults to 200px
-     */
-    scrolledUpThreshold?: number;
-    /**
-     * The floating notification informing about unread messages will be shown when the
-     * UnreadMessagesSeparator is not visible. The default is false, that means the notification
-     * is shown only when viewing unread messages.
-     */
-    showUnreadNotificationAlways?: boolean;
-    /** If true, indicates the message list is a thread  */
-    threadList?: boolean;
-};
-/**
- * The MessageList component renders a list of Messages.
- * It is a consumer of the following contexts:
- * - [ChannelStateContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_state_context/)
- * - [ChannelActionContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_action_context/)
- * - [ComponentContext](https://getstream.io/chat/docs/sdk/react/contexts/component_context/)
- * - [TypingContext](https://getstream.io/chat/docs/sdk/react/contexts/typing_context/)
- */
-export declare const MessageList: (props: MessageListProps) => React.JSX.Element;
-export {};