@cometchat/chat-uikit-react-native/lib/shared/views/CometChatMessageBubble/CometChatMessageBubble.d.ts

Ready-to-use Chat UI Components for React Native

import React, { JSX } from "react";
import { BubbleStyles } from "../../../theme/type";
import { MessageBubbleAlignmentType } from "../../base/Types";
/**
 * Props for the CometChatMessageBubble component.
 */
export interface CometChatMessageBubbleInterface {
    /**
     * The unique identifier of the message bubble.
     *
     * @type {string}
     */
    id: string;
    /**
     * The leading view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    LeadingView?: JSX.Element | null;
    /**
     * The header view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    HeaderView?: JSX.Element | null;
    /**
     * The status info view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    StatusInfoView?: JSX.Element | null;
    /**
     * The reply view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    ReplyView?: JSX.Element | null;
    /**
     * The bottom view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    BottomView?: JSX.Element | null;
    /**
     * The content view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    ContentView?: JSX.Element | null;
    /**
     * The thread view of the message bubble.
     *
     * @type {JSX.Element | null}
     */
    ThreadView?: JSX.Element | null;
    /**
     * The footer view of the message bubble. Can be a JSX element or a function returning a JSX element.
     *
     * @type {JSX.Element | ((params: { maxContentWidth: number }) => JSX.Element) | null}
     */
    FooterView?: JSX.Element | ((params: {
        maxContentWidth: number;
    }) => JSX.Element) | null;
    /**
     * The alignment of the message bubble.
     *
     * @type {MessageBubbleAlignmentType}
     */
    alignment?: MessageBubbleAlignmentType;
    /**
     * Custom styles for the message bubble.
     *
     * @type {BubbleStyles}
     */
    style?: BubbleStyles;
}
/**
 * CometChatMessageBubble renders a customizable message bubble with optional header, content, footer,
 * and additional views such as leading, bottom, and thread views. The component adjusts its alignment
 * based on the provided `alignment` prop.
 *
 * @param {CometChatMessageBubbleInterface} props - Props for configuring the message bubble.
 * @returns {JSX.Element} The rendered message bubble.
 */
export declare const CometChatMessageBubble: React.MemoExoticComponent<({ HeaderView, StatusInfoView, ReplyView, ContentView, FooterView, LeadingView, BottomView, ThreadView, alignment, id, style, }: CometChatMessageBubbleInterface) => JSX.Element>;