@cometchat/chat-uikit-react-native/lib/extensions/MessageTranslation/MessageTranslationBubble.d.ts

Ready-to-use Chat UI Components for React Native

import React from "react";
import { TextStyle, ViewStyle } from "react-native";
import { CometChatMentionsFormatter, CometChatTextFormatter, CometChatUrlsFormatter } from "../../shared";
/**
 * Props for MessageTranslationBubble component.
 */
export interface MessageTranslationBubbleProps {
    /** The translated version of the original text. */
    translatedText?: string;
    /** The original text message. */
    text?: string;
    /** Styling for the original text. */
    textStyle?: TextStyle;
    /** Container style for the original text. */
    textContainerStyle?: ViewStyle;
    /** Styling for the translated text. */
    translatedTextStyle?: TextStyle;
    /** Container style for the translated text. */
    translatedTextContainerStyle?: ViewStyle;
    /** Style for the divider between original and translated text. */
    translatedTextDividerStyle?: ViewStyle;
    /** Alignment of the text bubble. */
    alignment?: string;
    /** An array of text formatters to process the text. */
    textFormatters?: Array<CometChatMentionsFormatter | CometChatUrlsFormatter | CometChatTextFormatter>;
}
/**
 * MessageTranslationBubble component renders a text bubble that displays both
 * the original text and its translated version.
 *
 * If a translated text is provided, it displays:
 * - The formatted original text.
 * - A divider.
 * - The formatted translated text.
 * - A label indicating the text has been translated.
 *
 * If no translated text is provided, it falls back to rendering the standard
 * CometChatTextBubble.
 *
 * @param {MessageTranslationBubbleProps} props - The props for configuring the text bubble.
 *
 * @returns {JSX.Element} A React element representing the message translation bubble.
 */
export declare const MessageTranslationBubble: React.FC<MessageTranslationBubbleProps>;