stream-chat-react/dist/components/Channel/Channel.d.ts

React components to create chat conversations or livestream style chat

import React, { PropsWithChildren } from 'react';
import { OnMentionAction } from './hooks/useMentionsHandlers';
import { LoadingErrorIndicatorProps } from '../Loading';
import { ComponentContextValue, StreamMessage } from '../../context';
import type { ChannelQueryOptions, EventAPIResponse, Message, MessageResponse, Channel as StreamChannel, StreamChat, UpdatedMessage } from 'stream-chat';
import type { MessageInputProps } from '../MessageInput';
import type { ChannelUnreadUiState, CustomTrigger, DefaultStreamChatGenerics, GiphyVersions, ImageAttachmentSizeHandler, SendMessageOptions, UpdateMessageOptions, VideoAttachmentSizeHandler } from '../../types/types';
import type { URLEnrichmentConfig } from '../MessageInput/hooks/useLinkPreviews';
type ChannelPropsForwardedToComponentContext<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = Pick<ComponentContextValue<StreamChatGenerics>, 'Attachment' | 'AttachmentPreviewList' | 'AttachmentSelector' | 'AttachmentSelectorInitiationButtonContents' | 'AudioRecorder' | 'AutocompleteSuggestionItem' | 'AutocompleteSuggestionList' | 'Avatar' | 'BaseImage' | 'CooldownTimer' | 'CustomMessageActionsList' | 'DateSeparator' | 'EditMessageInput' | 'EmojiPicker' | 'emojiSearchIndex' | 'EmptyStateIndicator' | 'FileUploadIcon' | 'GiphyPreviewMessage' | 'HeaderComponent' | 'Input' | 'LinkPreviewList' | 'LoadingIndicator' | 'Message' | 'MessageActions' | 'MessageBouncePrompt' | 'MessageBlocked' | 'MessageDeleted' | 'MessageListNotifications' | 'MessageListMainPanel' | 'MessageNotification' | 'MessageOptions' | 'MessageRepliesCountButton' | 'MessageStatus' | 'MessageSystem' | 'MessageTimestamp' | 'ModalGallery' | 'PinIndicator' | 'PollActions' | 'PollContent' | 'PollCreationDialog' | 'PollHeader' | 'PollOptionSelector' | 'QuotedMessage' | 'QuotedMessagePreview' | 'QuotedPoll' | 'reactionOptions' | 'ReactionSelector' | 'ReactionsList' | 'ReactionsListModal' | 'SendButton' | 'StartRecordingAudioButton' | 'ThreadHead' | 'ThreadHeader' | 'ThreadStart' | 'Timestamp' | 'TriggerProvider' | 'TypingIndicator' | 'UnreadMessagesNotification' | 'UnreadMessagesSeparator' | 'VirtualMessage' | 'StopAIGenerationButton' | 'StreamedMessageText'>;
export type ChannelProps<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger> = ChannelPropsForwardedToComponentContext<StreamChatGenerics> & {
    /** List of accepted file types */
    acceptedFiles?: string[];
    /** Custom handler function that runs when the active channel has unread messages and the app is running on a separate browser tab */
    activeUnreadHandler?: (unread: number, documentTitle: string) => void;
    /** The connected and active channel */
    channel?: StreamChannel<StreamChatGenerics>;
    /**
     * Optional configuration parameters used for the initial channel query.
     * Applied only if the value of channel.initialized is false.
     * If the channel instance has already been initialized (channel has been queried),
     * then the channel query will be skipped and channelQueryOptions will not be applied.
     */
    channelQueryOptions?: ChannelQueryOptions<StreamChatGenerics>;
    /** Custom action handler to override the default `client.deleteMessage(message.id)` function */
    doDeleteMessageRequest?: (message: StreamMessage<StreamChatGenerics>) => Promise<MessageResponse<StreamChatGenerics>>;
    /** Custom action handler to override the default `channel.markRead` request function (advanced usage only) */
    doMarkReadRequest?: (channel: StreamChannel<StreamChatGenerics>, setChannelUnreadUiState?: (state: ChannelUnreadUiState) => void) => Promise<EventAPIResponse<StreamChatGenerics>> | void;
    /** Custom action handler to override the default `channel.sendMessage` request function (advanced usage only) */
    doSendMessageRequest?: (channel: StreamChannel<StreamChatGenerics>, message: Message<StreamChatGenerics>, options?: SendMessageOptions) => ReturnType<StreamChannel<StreamChatGenerics>['sendMessage']> | void;
    /** Custom action handler to override the default `client.updateMessage` request function (advanced usage only) */
    doUpdateMessageRequest?: (cid: string, updatedMessage: UpdatedMessage<StreamChatGenerics>, options?: UpdateMessageOptions) => ReturnType<StreamChat<StreamChatGenerics>['updateMessage']>;
    /** If true, chat users will be able to drag and drop file uploads to the entire channel window */
    dragAndDropWindow?: boolean;
    /** Custom UI component to be shown if no active channel is set, defaults to null and skips rendering the Channel component */
    EmptyPlaceholder?: React.ReactElement;
    /**
     * A global flag to toggle the URL enrichment and link previews in `MessageInput` components.
     * By default, the feature is disabled. Can be overridden on Thread, MessageList level through additionalMessageInputProps
     * or directly on MessageInput level through urlEnrichmentConfig.
     */
    enrichURLForPreview?: URLEnrichmentConfig['enrichURLForPreview'];
    /** Global configuration for link preview generation in all the MessageInput components */
    enrichURLForPreviewConfig?: Omit<URLEnrichmentConfig, 'enrichURLForPreview'>;
    /** The giphy version to render - check the keys of the [Image Object](https://developers.giphy.com/docs/api/schema#image-object) for possible values. Uses 'fixed_height' by default */
    giphyVersion?: GiphyVersions;
    /** A custom function to provide size configuration for image attachments */
    imageAttachmentSizeHandler?: ImageAttachmentSizeHandler;
    /**
     * Allows to prevent triggering the channel.watch() call when mounting the component.
     * That means that no channel data from the back-end will be received neither channel WS events will be delivered to the client.
     * Preventing to initialize the channel on mount allows us to postpone the channel creation to a later point in time.
     */
    initializeOnMount?: boolean;
    /** Custom UI component to be shown if the channel query fails, defaults to and accepts same props as: [LoadingErrorIndicator](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Loading/LoadingErrorIndicator.tsx) */
    LoadingErrorIndicator?: React.ComponentType<LoadingErrorIndicatorProps>;
    /** Configuration parameter to mark the active channel as read when mounted (opened). By default, the channel is marked read on mount. */
    markReadOnMount?: boolean;
    /** Maximum number of attachments allowed per message */
    maxNumberOfFiles?: number;
    /** Whether to allow multiple attachment uploads */
    multipleUploads?: boolean;
    /** Custom action handler function to run on click of an @mention in a message */
    onMentionsClick?: OnMentionAction<StreamChatGenerics>;
    /** Custom action handler function to run on hover of an @mention in a message */
    onMentionsHover?: OnMentionAction<StreamChatGenerics>;
    /** If `dragAndDropWindow` prop is true, the props to pass to the MessageInput component (overrides props placed directly on MessageInput) */
    optionalMessageInputProps?: MessageInputProps<StreamChatGenerics, V>;
    /** You can turn on/off thumbnail generation for video attachments */
    shouldGenerateVideoThumbnail?: boolean;
    /** If true, skips the message data string comparison used to memoize the current channel messages (helpful for channels with 1000s of messages) */
    skipMessageDataMemoization?: boolean;
    /** A custom function to provide size configuration for video attachments */
    videoAttachmentSizeHandler?: VideoAttachmentSizeHandler;
};
/**
 * A wrapper component that provides channel data and renders children.
 * The Channel component provides 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 Channel: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: PropsWithChildren<ChannelProps<StreamChatGenerics, V>>) => React.JSX.Element;
export {};