@cometchat/chat-uikit-react/dist/index.d.ts

Ready-to-use Chat UI Components for React(Javascript/Web)

import * as React from 'react';
import React__default, { JSX as JSX$1, ReactNode, FC } from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';
import * as _cometchat_chat_sdk_javascript from '@cometchat/chat-sdk-javascript';
import { CometChat as CometChat$1 } from '@cometchat/chat-sdk-javascript';
import { Subject } from 'rxjs';

/**
 * Interface for the props of CometChatToast component
 */
interface CometChatToastProps {
    /** The text to display in the toast message */
    text: string;
    /** Duration (in milliseconds) for which the toast is visible (default is 3000ms) */
    duration?: number;
    /** Optional callback function that executes when the toast closes */
    onClose?: () => void;
}
/**
 * CometChatToast Component
 *
 * This component displays a temporary toast message with a specified text and duration.
 * The toast will automatically disappear after the specified duration and optionally trigger
 * an `onClose` callback if provided.
 *
 * @param {string} text - The message text to display in the toast
 * @param {number} duration - Duration for which the toast is visible
 * @param {function} onClose - Callback function executed when the toast closes
 *
 * @returns {JSX.Element | null} - The JSX element for the toast message or null if no text is provided
 */
declare const CometChatToast: React__default.FC<CometChatToastProps>;

/**
 * It is used for specifying the position of the auxiliary buttons.
 * It is used in CometChatMessageComposer component.
 */
declare enum AuxiliaryButtonAlignment {
    left = 0,
    right = 1
}
/**
 * It is used for specifying the function of enter button
 * It is used in CometChatMessageComposer component.
 */
declare enum EnterKeyBehavior {
    SendMessage = "sendMessage",
    NewLine = "newLine",
    None = "none"
}
/**
 * It is used for describing the position of the element on the UI.
 * It is used in CometChatContextualMenu, CometChatMessageBubble, CometChatUsers and CometChatGroupMembers components.
 */
declare enum Placement$1 {
    top = "top",
    right = "right",
    bottom = "bottom",
    left = "left"
}
/**
 * It is used for specifying the alignment of the message list.
 * It is used in CometChatMessageList component.
 */
declare enum MessageListAlignment {
    left = 0,
    standard = 1
}
/**
 * This is used for specifying the position of the message bubble.
 * It is used in various components where the message bubbles are used.
 */
declare enum MessageBubbleAlignment {
    left = 0,
    right = 1,
    center = 2
}
/**
 * This is used for specifying the position of the document icon.
 * It is used in Decorators like CallingExtension, CollaborativeDocument, CollaborativeWhiteboard.
 */
declare enum DocumentIconAlignment {
    left = 0,
    right = 1
}
/**
 * This is used to specify the alignment of the tabs.
 * It is used in CometChatTabs and CometChatContacts components.
 */
declare enum TabAlignment {
    top = 0,
    bottom = 1,
    left = 2,
    right = 3
}
/**
 * This is used to specify the status of the message delivery.
 * It is used in components related to messages.
 */
declare enum MessageStatus {
    inprogress = 0,
    success = 1,
    error = 2
}
/**
 * This is used to specify the types of the read receipts for the message.
 * It is used in Bubbles, CometChatMessageInformation components.
 */
declare enum Receipts {
    wait = 0,
    sent = 1,
    delivered = 2,
    read = 3,
    error = 4
}
/**
 * This is used for specifying the position of the title.
 */
declare enum TitleAlignment {
    left = 0,
    center = 1
}
/**
 * It is used to specify the mode of selection for the list of items.
 * It is used in components where there is a list of items involed, like users/groups etc.
 */
declare enum SelectionMode {
    single = 0,
    multiple = 1,
    none = 2
}
/**
 * This is used to specify the states of the operation on the UI.
 * It has options like:
 * loading: to be used while waiting for a particular operation,
 * empty: when there is nothing to be displayed,
 * error: when an error occurs in the operation, and
 * loaded: when the operation is completed.
 */
declare enum States {
    loading = 0,
    empty = 1,
    error = 2,
    loaded = 3
}
/**
 * This is used to specify the position for the time-stamp.
 * It is used in CometChatMessageList component.
 */
declare enum TimestampAlignment {
    top = 0,
    bottom = 1
}
/**
 * This is used to specify the alignment for the icon button.
 * It is used in CometChatTabs, CometChatOutgoingCall components.
 */
declare enum IconButtonAlignment {
    top = "column",
    bottom = "column-reverse",
    left = "row",
    right = "row-reverse"
}
/**
 * It is used to specify the type for the recording.
 * It is used in CometChatMessageComposer component.
 */
declare enum RecordingType {
    audio = 0,
    video = 1
}
/**
 * It is used to specify which tabs should be visible amongst user and group.
 * It is used in CometChatContacts component.
 */
declare enum TabsVisibility {
    usersAndGroups = 0,
    users = 1,
    groups = 2
}
/**
 * This is used to specify the type of the call.
 * It is used in CometChatCallLogs, CometChatOngoingCall components.
 */
declare enum CallWorkflow {
    defaultCalling = 0,
    directCalling = 1
}
/**
 * This is used to provide the alignment for the panel.
 * It is used in CometChatMessageList component and AI module components.
 */
declare enum PanelAlignment {
    composerHeader = 0,
    messageListHeader = 1,
    messageListFooter = 2,
    messages = 3
}
/**
 * It is used to provide the alignment for the labels.
 */
declare enum LabelAlignment {
    top = "column",
    bottom = "column-reverse",
    left = "row",
    right = "row-reverse"
}
/**
 * It is used to specify the type of the UI element.
 * It is used in modal components.
 */
declare enum ElementType {
    label = "label",
    text = "textInput",
    dropdown = "dropdown",
    checkbox = "checkbox",
    radio = "radio",
    button = "button",
    singleSelect = "singleSelect",
    dateTime = "dateTime"
}
/**
 * It is used to specify what action a button should perform.
 * It is used in InteractiveMessageUtils function and in modal components.
 */
declare enum ButtonAction {
    apiAction = "apiAction",
    urlNavigation = "urlNavigation",
    custom = "custom"
}
/**
 * It is used to specify the type of the http request call.
 * It is used in InteractiveMessageUtils function and APIAction inside modals.
 */
declare enum HTTPSRequestMethods {
    POST = "POST",
    PUT = "PUT",
    PATCH = "PATCH",
    DELETE = "DELETE"
}
/**
 * It is used to select the mode for date time picker component.
 * It is used in DateTimePickerElement component.
 */
declare enum DateTimePickerMode {
    date = "date",
    dateTime = "dateTime",
    time = "time"
}
/**
 * It is used for specifying the type of user/members list.
 * It is used in CometChatMessageComposer and CometChatUserMemberWrapper components.
 */
declare enum UserMemberListType {
    users = 0,
    groupmembers = 1
}
/**
 * This is used to specify the source for mouse event with mentions information.
 * It is used in CometChatMentionsFormatter util.
 */
declare enum MouseEventSource {
    mentions = 0
}
/**
 * It is used to describe the mode for previewing message.
 * It is used in CometChatMessageComposer component.
 */
declare enum PreviewMessageMode {
    edit = 0,
    none = 1
}
/**
 * It is generally used for formatting the text by providing the required data.
 * It is used in CometChatConversations, CometChatTextFormatter and CometChatMentionsFormatter.
 */
declare enum MentionsTargetElement {
    textinput = 0,
    textbubble = 1,
    conversation = 2
}
/**
 * It is used for providing the value for the mentions visibility.
 * It is used in CometChatMentionsFormatter component.
 */
declare enum MentionsVisibility {
    usersConversationOnly = 0,
    groupConversationOnly = 1,
    both = 2
}

interface MentionsProps {
    userMemberListType?: UserMemberListType;
    onItemClick?: (user: CometChat.User | CometChat.GroupMember) => void;
    itemView?: (item?: CometChat.User | CometChat.GroupMember) => JSX.Element;
    searchKeyword?: string;
    group?: CometChat.Group;
    subtitleView?: (item?: CometChat.User | CometChat.GroupMember) => JSX.Element;
    usersRequestBuilder?: CometChat.UsersRequestBuilder;
    onEmpty?: () => void;
    groupMemberRequestBuilder?: CometChat.GroupMembersRequestBuilder;
    onError?: () => void;
}
declare function CometChatUserMemberWrapper(props: MentionsProps): react_jsx_runtime.JSX.Element;

/**
 * Abstract class representing a data source for extensions.
 * Provides methods to enable and add extensions, and to get the extension ID.
 */
declare abstract class ExtensionsDataSource {
    /**
     * Abstract method to add an extension. Implementations must provide their own logic.
     *
     * @abstract
     */
    abstract addExtension(): void;
    /**
     * Abstract method to get the unique identifier for the extension.
     * Implementations must provide their own logic to return the extension ID.
     *
     * @abstract
     * @returns {string} The unique identifier for the extension.
     */
    abstract getExtensionId(): string;
    /**
     * Enables the extension if it is not already enabled.
     * Checks if the extension is enabled using `CometChat.isExtensionEnabled()` and
     * adds the extension if it is enabled.
     *
     * @returns {void}
     */
    enable(): void;
}

declare var CometChatUIKitCalls: any;

/**
 * Represents the configuration for a calendar object.
 */
declare class CalendarObject {
    /** Custom formatting for dates that fall on the same day. */
    today?: string;
    /** Custom formatting for dates that fall on the previous day. */
    yesterday?: string;
    /** Custom formatting for dates within the last week. */
    lastWeek?: string;
    /** Custom formatting for dates that do not fit other categories. */
    otherDays?: string;
    /**
     * Relative time formatting for specific time units.
     */
    relativeTime?: {
        /** Formatting for minutes (singular). */
        minute?: string;
        /** Formatting for minutes (plural). */
        minutes?: string;
        /** Formatting for hours (singular). */
        hour?: string;
        /** Formatting for hours (plural). */
        hours?: string;
    };
    constructor(calendaObject: CalendarObject);
}

declare class OutgoingCallConfiguration {
    disableSoundForCalls?: boolean;
    customSoundForCalls?: string;
    titleView?: (call: CometChat.Call) => JSX.Element;
    subtitleView?: (call: CometChat.Call) => JSX.Element;
    avatarView?: (call: CometChat.Call) => JSX.Element;
    cancelButtonView?: (call: CometChat.Call) => JSX.Element;
    onError?: (error: CometChat.CometChatException) => void;
    onCallCanceled?: Function;
    constructor(configuration: OutgoingCallConfiguration);
}

declare class CallButtonConfiguration {
    callSettingsBuilder?: (isAudioOnlyCall: boolean, user?: CometChat.User, group?: CometChat.Group) => typeof CometChatUIKitCalls.CallSettingsBuilder;
    onVoiceCallClick?: () => void;
    onVideoCallClick?: () => void;
    onError?: ((error: CometChat.CometChatException) => void) | null;
    outgoingCallConfiguration?: OutgoingCallConfiguration;
    constructor(configuration?: CallButtonConfiguration);
}

declare class CallingConfiguration {
    groupCallSettingsBuilder?: (message: CometChat.CustomMessage) => typeof CometChatUIKitCalls.CallSettingsBuilder;
    callButtonConfiguration?: CallButtonConfiguration;
    callInitiatedDateTimeFormat?: CalendarObject;
    constructor(configuration?: CallingConfiguration);
}

declare class CallingExtension extends ExtensionsDataSource {
    private configuration?;
    constructor(configuration?: CallingConfiguration);
    enable(): void;
    addExtension(): void;
    getExtensionId(): string;
}

/**
 * Represents the localization settings for an application or component.
 */
interface LocalizationSettings {
    /** The language code (e.g., 'en', 'fr') for the current localization. */
    language?: string;
    /** Object containing key-value pairs for translations in the current language. */
    translationsForLanguage?: {
        [key: string]: any;
    };
    /** Whether to disable automatic language detection. */
    disableAutoDetection?: boolean;
    /** The fallback language code to use if the primary language is not available. */
    fallbackLanguage?: string;
    /** Whether to disable localization for date and time values. */
    disableDateTimeLocalization?: boolean;
    /** The timezone for date and time formatting. */
    timezone?: string;
    /** Custom calendar formatting defined using a CalendarObject. */
    calendarObject?: CalendarObject;
    /** Function to handle missing translation keys. */
    missingKeyHandler?: (key: string) => void;
}

/**
 * The `CometChatLocalize` class handles localization for the CometChat application.
 * It provides functionality to detect the user's browser language settings and
 * set the application's language accordingly.
 */
declare class CometChatLocalize {
    /** Properties and constants */
    static language: string;
    static fallbackLanguage: string;
    static timezone: string;
    static translations: {
        [key: string]: any;
    };
    static localizationSettings: LocalizationSettings;
    static calendarObject: CalendarObject;
    static disableAutoDetection: boolean;
    static disableDateTimeLocalization: boolean;
    private static defaultTimezones;
    /**
     * Adds custom translations to the default translations.
     * @param {object} resources - Custom translations object.
     */
    static addTranslation(resources: object): void;
    /**
     * Returns the browser language.
     * @returns {string} Browser language (e.g., "en-US").
     */
    static getBrowserLanguage(): string;
    /**
     * Localizes a given string based on the active language.
     * @param {string} str - String to localize.
     * @returns {string} Localized string.
     */
    static getLocalizedString: (str: string) => any;
    private static getDefaultTimeZone;
    /**
     * Initializes localization settings (v2).
     * @param {LocalizationSettings} settings - Localization settings.
     */
    static init(settings: LocalizationSettings): void;
    /**
     * Gets the current language.
     * @returns {string} Current language.
     */
    static getCurrentLanguage(): string;
    /**
     * Sets the current language.
     * @param {string} language - Language code to set.
     */
    static setCurrentLanguage(language: string): void;
    /**
     * @Returns the current language.
     */
    static getDefaultLanguage(): string;
    /**
     * @Returns the language to localize date.
     */
    static getDateLocaleLanguage(): string;
    /**
     * Formats a date using a given pattern.
     * @param {Date} date - Date to format.
     * @param {string} format - Format pattern.
     * @returns {string} Formatted date.
     */
    private static formatDateFromPattern;
    /**
     * Formats a timestamp based on the provided calendar configuration.
     * @param {number} timestamp - Timestamp to format.
     * @param {CalendarObject} calendarObject - Calendar configuration.
     * @returns {string} Formatted date string.
     */
    static formatDate(timestamp: number, calendarObject: CalendarObject): string;
    private static isYesterday;
}
declare const getLocalizedString: (str: string) => any;

/**
 * Represents the settings required to initialize the CometChat SDK.
 * This class holds various configuration options, such as app credentials, socket connection settings, and feature toggles.
 *
 * @class UIKitSettings
 */
declare class UIKitSettings {
    /**
     * Unique ID for the app, available on the CometChat dashboard.
     * @type {string}
     */
    readonly appId?: string;
    /**
     * Region for the app, such as "us" or "eu".
     * @type {string}
     */
    readonly region?: string;
    /**
     * Sets the subscription type for presence.
     * @type {string}
     */
    readonly subscriptionType?: string;
    /**
     * Configures WebSocket connections. When set to true, establishes connection automatically on app initialization.
     * @type {boolean}
     * @default true
     */
    readonly autoEstablishSocketConnection?: boolean;
    /**
     * Authentication key for the app, available on the CometChat dashboard.
     * @type {string}
     */
    readonly authKey?: string;
    /**
     * Token representing the device, used for push notifications.
     * @type {string}
     */
    readonly deviceToken?: string;
    /**
     * API key for Google services.
     * @type {string}
     */
    readonly googleApiKey?: string;
    /**
     * Flag to disable the calling feature.
     * @type {boolean}
     * @default false
     */
    readonly disableCalling: boolean;
    /**
     * Subscribes to user presence for users having the specified roles.
     * @type {string[]}
     */
    readonly roles?: string[];
    /**
     * Custom admin URL, used instead of the default admin URL for dedicated deployments.
     * @type {string}
     */
    readonly adminHost?: string;
    /**
     * Custom client URL, used instead of the default client URL for dedicated deployments.
     * @type {string}
     */
    readonly clientHost?: string;
    /**
     * Data source for managing UI extensions.
     * @type {ExtensionsDataSource[]}
     */
    readonly extensions?: ExtensionsDataSource[];
    /**
   * Data source for managing  calls.
   * @type {ExtensionsDataSource}
   */
    readonly callingExtension?: CallingExtension;
    /**
     * Private constructor to initialize the settings using the provided builder.
     * @param {UIKitSettingsBuilder} builder - The builder instance containing the settings configuration.
     */
    private constructor();
    /**
     * Creates an instance of UIKitSettings from the provided builder.
     * @param {UIKitSettingsBuilder} builder - The builder instance containing the settings configuration.
     * @returns {UIKitSettings} A new instance of UIKitSettings.
     */
    static fromBuilder(builder: UIKitSettingsBuilder): UIKitSettings;
    /**
      * Retrieves the app ID.
      * @returns {string} The unique ID of the app.
      */
    getAppId(): string;
    /**
    * Retrieves the region.
    * @returns {string} The region of the app.
    */
    getRegion(): string;
    /**
     * Retrieves the roles for presence subscription.
     * @returns {string[]} The list of roles subscribed to presence.
     */
    getRoles(): string[];
    /**
     * Retrieves the subscription type for presence.
     * @returns {string} The subscription type.
     */
    getSubscriptionType(): string;
    /**
     * Retrieves the authentication key.
     * @returns {string} The authentication key.
     */
    getAuthKey(): string;
    /**
     * Checks if auto-establish socket connection is enabled.
     * @returns {boolean} True if auto-establish is enabled, otherwise false.
     */
    isAutoEstablishSocketConnection(): boolean;
    /**
     * Retrieves the custom admin host URL.
     * @returns {string} The admin host URL.
     */
    getAdminHost(): string;
    /**
     * Retrieves the custom client host URL.
     * @returns {string} The client host URL.
     */
    getClientHost(): string;
    /**
     * Retrieves the list of UI extensions.
     * @returns {ExtensionsDataSource[]} The list of UI extensions.
     */
    getExtensions(): ExtensionsDataSource[];
    /**
   * Retrieves the calling extension.
   * @returns {ExtensionsDataSource[]}
   */
    getCallsExtension(): ExtensionsDataSource;
}
declare class UIKitSettingsBuilder {
    /**
     * Unique ID for the app, available on the CometChat dashboard.
     * @type {string}
     */
    appId?: string;
    /**
     * Region for the app, such as "us" or "eu".
     * @type {string}
     */
    region?: string;
    /**
     * Sets the subscription type for presence.
     * @type {string}
     */
    subscriptionType?: string;
    /**
     * Subscribes to user presence for users having the specified roles.
     * @type {string[]}
     */
    roles?: string[];
    /**
     * Configures WebSocket connections.
     * @type {boolean}
     */
    autoEstablishSocketConnection?: boolean;
    /**
     * Authentication key for the app, available on the CometChat dashboard.
     * @type {string}
     */
    authKey?: string;
    /**
     * Token representing the device, used for push notifications.
     * @type {string}
     */
    deviceToken?: string;
    /**
     * API key for Google services.
     * @type {string}
     */
    googleApiKey?: string;
    /**
     * Data source for managing UI extensions.
     * @type {ExtensionsDataSource[]}
     */
    extensions?: ExtensionsDataSource[];
    /**
   * Data source for managing calls extension.
   * @type {CallingExtension}
   */
    callingExtension?: CallingExtension;
    /**
     * Flag to disable the calling feature.
     * @type {boolean}
     * @default false
     */
    disableCalling: boolean;
    /**
     * Custom admin URL, used instead of the default admin URL for dedicated deployments.
     * @type {string}
     */
    adminHost?: string;
    /**
     * Custom client URL, used instead of the default client URL for dedicated deployments.
     * @type {string}
     */
    clientHost?: string;
    /**
    * Builds and returns an instance of UIKitSettings.
    * @returns {UIKitSettings} A new instance of UIKitSettings with the specified configuration.
    */
    build(): UIKitSettings;
    /**
    * Sets the app ID.
    * @param {string} appId - The unique ID of the app.
    * @returns {UIKitSettingsBuilder} The builder instance.
    */
    setAppId(appId: string): UIKitSettingsBuilder;
    /**
     * Sets the region.
     * @param {string} region - The region of the app.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setRegion(region: string): UIKitSettingsBuilder;
    /**
     * Subscribes to presence updates for all users.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    subscribePresenceForAllUsers(): UIKitSettingsBuilder;
    /**
     * Subscribes to presence updates for specific roles.
     * @param {string[]} roles - The roles to subscribe to.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    subscribePresenceForRoles(roles: string[]): UIKitSettingsBuilder;
    /**
     * Subscribes to presence updates for specific roles.
     * @param {string[]} roles - The roles to subscribe to.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    subscribePresenceForFriends(): UIKitSettingsBuilder;
    /**
     * Sets the roles for presence subscription.
     * @param {string[]} roles - The roles to subscribe to.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setRoles(roles: string[]): UIKitSettingsBuilder;
    /**
     * Enables or disables the auto-establish socket connection.
     * @param {boolean} autoEstablishSocketConnection - True to enable, false to disable.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setAutoEstablishSocketConnection(autoEstablishSocketConnection: boolean): UIKitSettingsBuilder;
    /**
     * Sets the authentication key.
     * @param {string} authKey - The authentication key.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setAuthKey(authKey: string): UIKitSettingsBuilder;
    /**
     * Sets the custom admin host URL.
     * @param {string} adminHost - The admin host URL.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setAdminHost(adminHost: string): UIKitSettingsBuilder;
    /**
     * Sets the custom client host URL.
     * @param {string} clientHost - The client host URL.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setClientHost(clientHost: string): UIKitSettingsBuilder;
    /**
     * Sets the list of UI extensions.
     * @param {ExtensionsDataSource[]} extensions - The list of UI extensions.
     * @returns {UIKitSettingsBuilder} The builder instance.
     */
    setExtensions(extensions: ExtensionsDataSource[]): UIKitSettingsBuilder;
    /**
   * Sets the calling extension.
   * @param {ExtensionsDataSource} calling.
   * @returns {UIKitSettingsBuilder} The builder instance.
   */
    setCallsExtension(callingExtension: CallingExtension): UIKitSettingsBuilder;
}

/**
 * Manages and plays various types of audio for CometChat events.
 * The class provides methods to play sounds for incoming and outgoing messages and calls.
 * It is used in CometChatCallButtons, CometChatIncomingCall, CometChatConversations, CometChatMessageComposer components.
 */
declare class CometChatSoundManager {
    static audio: string | null | HTMLAudioElement;
    static Sound: sounds;
    /**
     * Plays the sound for an incoming message.
     * @param {string|null} customSound - The custom sound URL or null to use the default.
     *
     * @example
     * // Trigger the audio sound for an incoming message
     * CometChatSoundManager.onIncomingMessage();
     *
     * @example
     * // Trigger the audio sound of your choice for an incoming message
     * CometChatSoundManager.onIncomingMessage("MP3_FILE_ASSET_PATH");
     */
    static onIncomingMessage: (customSound?: string | null) => void;
    /**
     * Plays the sound for an incoming message from another user.
     * @param {string|null} customSound - The custom sound URL or null to use the default.
     *
     * @example
     * // Trigger the audio sound for an incoming message from another user
     * CometChatSoundManager.onIncomingOtherMessage();
     *
     * @example
     * // Trigger the audio sound of your choice for an incoming message from another user
     * CometChatSoundManager.onIncomingOtherMessage("MP3_FILE_ASSET_PATH");
     */
    static onIncomingOtherMessage: (customSound?: string | null) => void;
    /**
     * Plays the sound for an outgoing message.
     * @param {string|null} customSound - The custom sound URL or null to use the default.
     *
     * @example
     * // Trigger the audio sound for an outgoing message
     * CometChatSoundManager.onOutgoingMessage();
     *
     * @example
     * // Trigger the audio sound of your choice for an outgoing message
     * CometChatSoundManager.onOutgoingMessage("MP3_FILE_ASSET_PATH");
     */
    static onOutgoingMessage: (customSound?: string | null) => void;
    /**
     * Plays the sound for an incoming call.
     * @param {string|null} customSound - The custom sound URL or null to use the default.
     *
     * @example
     * // Trigger the audio sound for an incoming call
     * CometChatSoundManager.onIncomingCall();
     *
     * @example
     * // Trigger the audio sound of your choice for an incoming call
     * CometChatSoundManager.onIncomingCall("MP3_FILE_ASSET_PATH");
     */
    static onIncomingCall: (customSound?: string | null) => void;
    /**
     * Plays the sound for an outgoing call.
     * @param {string|null} customSound - The custom sound URL or null to use the default.
     *
     * @example
     * // Trigger the audio sound for an outgoing call
     * CometChatSoundManager.onOutgoingCall();
     *
     * @example
     * // Trigger the audio sound of your choice for an outgoing call
     * CometChatSoundManager.onOutgoingCall("MP3_FILE_ASSET_PATH");
     */
    static onOutgoingCall: (customSound?: string | null) => void;
    /**
     * Contains mappings of sound types to their respective handler functions.
     *
     * The handlers are functions that trigger the playback of sounds for different events.
     *
     * @type {Object}
     * @property {Function} incomingCall - Handler function for playing the incoming call sound.
     * @property {Function} outgoingCall - Handler function for playing the outgoing call sound.
     * @property {Function} incomingMessage - Handler function for playing the incoming message sound.
     * @property {Function} incomingMessageFromOther - Handler function for playing the incoming message from other sound.
     * @property {Function} outgoingMessage - Handler function for playing the outgoing message sound.
     */
    static handlers: {
        incomingCall: (customSound?: string | null) => void;
        outgoingCall: (customSound?: string | null) => void;
        incomingMessage: (customSound?: string | null) => void;
        incomingMessageFromOther: (customSound?: string | null) => void;
        outgoingMessage: (customSound?: string | null) => void;
    };
    /**
    * Plays a predefined sound based on the provided sound type.
    * @param {"incomingCall" | "incomingMessage" | "incomingMessageFromOther" | "outgoingCall" | "outgoingMessage"} sound - The sound type to play.
    * @param {string|null} customSound - The custom sound URL or null to use the default.
    * @returns {boolean} - Returns false if the sound handler is not found.
    *
    * @example
    * // Play the sound for incoming messages
    * CometChatSoundManager.play("incomingMessage");
    *
    * @example
    * // Play a custom sound for outgoing messages
    * CometChatSoundManager.play("outgoingMessage", "MP3_FILE_ASSET_PATH");
    */
    static play(sound: "incomingCall" | "incomingMessage" | "incomingMessageFromOther" | "outgoingCall" | "outgoingMessage", customSound?: string | null): false | void;
    /**
     * Pauses the currently playing sound and resets its position.
     *
     * @example
     * // Pause the ongoing audio sound
     * CometChatSoundManager.pause();
     */
    static pause(): void;
    /**
     * Checks if the user has interacted with the page.
     * @returns {boolean} True if the user has interacted, false otherwise.
     */
    static hasInteracted(): boolean;
}
interface sounds {
    incomingCall?: "incomingCall";
    incomingMessage?: "incomingMessage";
    incomingMessageFromOther: "incomingMessageFromOther";
    outgoingCall?: "outgoingCall";
    outgoingMessage?: "outgoingMessage";
}

/**
 * CometChatActions is a pre-defined structure for creating actions
 * that the user can perform on a message, with properties to customize
 * the appearance and behavior of the action.
 * It is used in CometChatActionsIcon and CometChatActionsView components.
 */
declare class CometChatActions {
    /**
     * Unique identifier for the message action.
     * @type {string}
     */
    id: string;
    /**
     * Heading text for the message action.
     * @type {string}
     */
    title: string;
    /**
     * Asset URL for the icon to symbolize a message action.
     * @type {string | undefined}
     */
    iconURL?: string;
    /**
     * Creates an instance of CometChatActions.
     *
     * @param {Object} options - Options to initialize the action.
     * @param {string} options.id - Unique identifier for the message action.
     * @param {string} options.title - Heading text for the message action.
     * @param {string} [options.iconURL] - Asset URL for the icon to symbolize a message action.
     */
    constructor(options: {
        id: string;
        title: string;
        iconURL?: string;
    });
}

/**
 * CometChatActionsIcon is a pre-defined structure for creating actions
 * that the user can perform on a message with an icon representation.
 * It is used in CometChatContextMenu, CometChatMessageBubble, CometChatMessageList components.
 */
declare class CometChatActionsIcon extends CometChatActions {
    /**
     * Function invoked when the user clicks on the message action.
     * @type {(id: number) => void}
     */
    onClick: (id: number) => void;
    /**
     * Creates an instance of CometChatActionsIcon.
     */
    constructor(options: {
        /**
         * Unique identifier for the message action.
         * @type {string}
         */
        id: string;
        /**
         * Heading text for the message action.
         * @type {string}
         */
        title: string;
        /**
         * Asset URL for the icon to symbolize a message action.
         * @type {string}
         */
        iconURL: string;
        /**
         * Function invoked when the user clicks on the message action. This function should handle the action related to the provided message id.
         * @type {(id: number) => void}
         */
        onClick: (id: number) => void;
    });
}

/**
 * CometChatActionsView is a pre-defined structure for creating actions
 * that the user can perform on a message with a customized UI view representation.
 * It is used in AI module, CometChatMessageBubble, CometChatMessageComposer, CometChatMessageList components.
 */
declare class CometChatActionsView extends CometChatActions {
    /**
     * User-defined component to customize the action view for each option in the template.
     * @type {callbacks: any) => Element | JSX.Element | undefined}
     */
    customView?: (callbacks: any) => Element | JSX.Element;
    /**
     * Creates an instance of CometChatActionsView.
     */
    constructor(options: {
        /**
        * Unique identifier for the message action.
        * @type {string}
        */
        id: string;
        /**
         * Heading text for the message action.
         * @type {string}
         */
        title: string;
        /**
         * Asset URL for the icon to symbolize a message action. This is optional and can be omitted.
         * @type {string}
         */
        iconURL?: string;
        /**
         * User-defined component to customize the action view. This is optional and can be omitted.
         * @type {Element | JSX.Element}
         */
        customView?: (callbacks: any) => Element | JSX.Element;
    });
}

/**
 * CometChatMessageComposerAction is a pre-defined structure for creating an attachment option
 * in the CometChatMessageComposer component that the user can perform in addition to composing a message.
 * It is used in AI module, CometChatMessageComposer component and Poll extension.
 */
declare class CometChatMessageComposerAction {
    /**
      * Unique identifier for the attachment option.
      * @type {string}
      */
    id: string;
    /**
     * Asset URL for the icon to symbolize an attachment option.
     * @type {string}
     */
    iconURL: string;
    /**
     * Function invoked when the user clicks on the attachment option.
     * @type {(() => void) | null}
     */
    onClick: (() => void) | null;
    /**
    * Heading text for the attachment option.
    * @type {string}
    */
    title?: string;
    /**
     * Creates an instance of CometChatMessageComposerAction.
     *
     * @param {Partial<CometChatMessageComposerAction>} props - Partial properties to initialize the action item.
     */
    constructor(props: Partial<CometChatMessageComposerAction>);
}

/**
 * Defines an option for message actions like edit or delete.
 * Allows customization of text, icon, and click behavior.
 * It is used in CometChatConversations, CometChatGroupMembers, CometChatGroups, CometChatUsers components.
 */
declare class CometChatOption {
    /** Unique identifier for the option. */
    id?: string;
    /** Text label for the option. */
    title?: string;
    /** URL of the icon representing the option. */
    iconURL?: string;
    /** Function to be called when the option is clicked. */
    onClick?: any;
    /**
     * Creates a new CometChatOption instance.
     * @param {Partial<CometChatOption>} props - Properties to initialize the option.
     */
    constructor(props: Partial<CometChatOption>);
}

/**
 * CometChatMessageOption is a pre-defined structure for creating an option
 * that can be used to perform an action on a message, such as edit, delete, etc.
 * It is used in CometChatMessageTemplate of modal.
 */
declare class CometChatMessageOption extends CometChatOption {
    /**
     * Creates an instance of CometChatMessageOption.
     */
    constructor({ 
    /**
      * Unique identifier for each option.
      * @type {string}
      */
    id, 
    /**
     * Heading text for each option.
     * @type {string}
     */
    title, 
    /**
     * Sets the asset URL of the icon for each option.
     * @type {string}
     */
    iconURL, 
    /**
     * Method to be invoked when user clicks on each option.
     * @type {(any) => void}
     */
    onClick, }: {
        id?: string | undefined;
        title?: string | undefined;
        iconURL?: string | undefined;
        onClick?: null | undefined;
    });
}

/**
 * CometChatMessageTemplate is a pre-defined structure for creating message views
 * that can be used as a starting point or blueprint for creating message views,
 * often known as message bubbles.
 * It is used in CometChatMessageInformation, CometChatMessageList components and extensions like Polls, Stickers.
 */
declare class CometChatMessageTemplate {
    /**
     * Type of the CometChat message.
     * @type {string}
     */
    type: string;
    /**
     * Custom component to customize the content section for each message bubble.
     * By default, it displays the Text bubble, Image bubble, File bubble, Audio bubble,
     * and Video bubble based on the type of the message.
     * @type {(message:CometChat.BaseMessage,alignment:MessageBubbleAlignment)=> Element | JSX.Element | null}
     */
    contentView: ((message: CometChat.BaseMessage, alignment: MessageBubbleAlignment) => Element | JSX.Element | null) | null;
    /**
     * Custom component to customize the complete message bubble.
     * By default, headerView, contentView and footerView collectively form a message bubble.
     * @type {(message:CometChat.BaseMessage,alignment:MessageBubbleAlignment)=> Element | JSX.Element | null}
     */
    bubbleView: ((message: CometChat.BaseMessage, alignment: MessageBubbleAlignment) => Element | JSX.Element | null) | null;
    /**
     * Custom component to customize the header section for each message bubble.
     * By default, it displays the message sender's name.
     * @type {(message:CometChat.BaseMessage,alignment:MessageBubbleAlignment)=> Element | JSX.Element | null}
     */
    headerView: ((message: CometChat.BaseMessage, alignment: MessageBubbleAlignment) => Element | JSX.Element | null) | null;
    /**
     * Custom component to customize the footer section for each message bubble.
     * By default, it displays the reactions.
     * @type {(message:CometChat.BaseMessage,alignment:MessageBubbleAlignment)=> Element | JSX.Element | null}
     */
    footerView: ((message: CometChat.BaseMessage, alignment: MessageBubbleAlignment) => Element | JSX.Element | null) | null;
    /**
     * Custom component to customize the bottom view section for each message bubble.
     * @type {(message:CometChat.BaseMessage,alignment:MessageBubbleAlignment)=> Element | JSX.Element | null}
     */
    bottomView: ((message: CometChat.BaseMessage, alignment: MessageBubbleAlignment) => Element | JSX.Element | null) | null;
    /**
     * Custom component to customize the status info section for each message bubble.
     * By default, it displays the receipt and the timestamp.
     * @type {(message:CometChat.BaseMessage,alignment:MessageBubbleAlignment)=> Element | JSX.Element | null}
     */
    statusInfoView: ((message: CometChat.BaseMessage, alignment: MessageBubbleAlignment, hideReceipt?: boolean, messageSentAtDateTimeFormat?: CalendarObject) => Element | JSX.Element | null) | null;
    /**
     * List of available actions that any user can perform on a message, like reacting,
     * editing or deleting a message.
     * @type {(loggedInUser: CometChat.User, message: CometChat.BaseMessage) => CometChatMessageOption[]}
     */
    options: (loggedInUser: CometChat.User, message: CometChat.BaseMessage, group?: CometChat.Group) => CometChatMessageOption[];
    /**
     * Category of the CometChat message.
     * @type {string}
     */
    category: string;
    /**
     * Creates an instance of CometChatMessageTemplate.
     *
     * @param {Partial<CometChatMessageTemplate>} props - Properties to initialize the message template.
     */
    constructor(props: Partial<CometChatMessageTemplate>);
}

interface additionalParams {
    disableMentions?: boolean;
    mentionsTargetElement?: number;
    textFormatters?: [];
    alignment?: MessageBubbleAlignment;
    textFormattersList?: CometChatTextFormatter[];
}
interface lastConversationParams {
    textFormatters: CometChatMentionsFormatter[];
    disableMentions?: boolean;
    mentionsTargetElement?: number;
    alignment?: MessageBubbleAlignment;
    textFormattersList?: CometChatTextFormatter[];
}
/**
 * Utility class for handling conversations in CometChat.
 * It is used in CometChatConversations component and dataSource utils.
 */
declare class ConversationUtils {
    private static additionalParams?;
    /**
     * Returns the default conversation options.
     *
     * @returns {CometChatOption[]} - An array of default conversation options.
     */
    static getDefaultOptions(): CometChatOption[];
    /**
     * Retrieves the last conversation message for a given conversation object.
     *
     * @param {CometChat.Conversation} conversationObject - The conversation object.
     * @param {CometChat.User} loggedInUser - The logged-in user.
     * @param {additionalParams} [additionalParams] - Additional parameters for message formatting.
     * @returns {string} - The last conversation message as a string.
     */
    static getLastConversationMessage(conversationObject: CometChat.Conversation, loggedInUser: CometChat.User, additionalParams?: lastConversationParams): string;
    /**
     * Retrieves the last message for a given conversation.
     *
     * @param {CometChat.Conversation} conversation - The conversation object.
     * @returns {string} - The last message as a string.
     */
    static getLastMessage(conversation: CometChat.Conversation): string;
    /**
     * Retrieves the last custom message for a given conversation.
     *
     * @param {CometChat.Conversation} conversation - The conversation object.
     * @returns {string} - The custom message type as a string.
     */
    static getLastMessageCustom(conversation: CometChat.Conversation): string;
    /**
    * Retrieves the last action message for a given conversation.
    *
    * @param {CometChat.Conversation} conversation - The conversation object.
    * @returns {string} - The action message as a string.
    */
    static getLastMessageAction(conversation: CometChat.Conversation): string;
    /**
     * Retrieves the last call message from a conversation.
     * Differentiates between audio and video calls.
     *
     * @param {CometChat.Conversation} conversation - The conversation object to retrieve the last call message from.
     * @returns {string} - A localized string indicating the type of call (audio or video).
     */
    static getLastMessageCall(conversation: CometChat.Conversation): any;
}

/**
 * Class that handles the text formatting for URLs in CometChat.
 * CometChatUrlsFormatter is a child class of CometChatTextFormatter.
 * It extends the functionality of text formatting to specifically handle URLs.
 * It is used in extension decorators like  link preview, message translation, and dataSource utils.
 */
declare class CometChatUrlsFormatter extends CometChatTextFormatter {
    constructor(regexPatterns: Array<RegExp>);
    protected onRegexMatch(inputText?: string | null): string;
    registerEventListeners(element: HTMLElement, classList: DOMTokenList): HTMLElement;
}

type ComposerId = {
    parentMessageId: number | null;
    user: string | null;
    group: string | null;
};
/**
 * Utility class that extends DataSource and provides getters for message options.
 * It is used in message and dataSource utils.
 */
interface additionalParamsOptions {
    hideReplyInThreadOption?: boolean;
    hideTranslateMessageOption?: boolean;
    hideReactionOption?: boolean;
    hideEditMessageOption?: boolean;
    hideDeleteMessageOption?: boolean;
    hideMessagePrivatelyOption?: boolean;
    hideCopyMessageOption?: boolean;
    hideMessageInfoOption?: boolean;
}
declare class MessagesDataSource implements DataSource {
    getEditOption(): CometChatActionsIcon;
    getDeleteOption(): CometChatActionsIcon;
    getReactionOption(): CometChatActionsView;
    getReplyInThreadOption(): CometChatActionsIcon;
    getSendMessagePrivatelyOption(): CometChatActionsIcon;
    getCopyOption(): CometChatActionsIcon;
    getMessageInfoOption(): CometChatActionsIcon;
    isSentByMe(loggedInUser: CometChat$1.User, message: CometChat$1.BaseMessage): boolean;
    getTextMessageOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: additionalParamsOptions): Array<CometChatActionsIcon | CometChatActionsView>;
    getIsSentByMe(message: CometChat$1.BaseMessage): boolean;
    getImageMessageOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
    getVideoMessageOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
    getAudioMessageOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
    getFileMessageOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
    getReceiptClass(status?: number): "error" | "read" | "delivered" | "sent" | "wait" | undefined;
    /**
  * Function to get receipt for message bubble
  * @param {CometChat.BaseMessage} item - The message bubble for which the receipt needs to be fetched
  * @returns {JSX.Element | null} Returns JSX.Element for receipt of a message bubble or null
  */
    getBubbleStatusInfoReceipt: (item: CometChat$1.BaseMessage, hideReceipt?: boolean) => JSX.Element | null;
    /**
* Function for displaying the timestamp  next to messages.
* @returns CalendarObject
*/
    getMessageSentAtDateFormat(messageSentAtDateTimeFormat?: CalendarObject): {
        today: string;
        yesterday: string;
        lastWeek?: string | undefined;
        otherDays: string;
        relativeTime?: {
            minute?: string | undefined;
            minutes?: string | undefined;
            hour?: string | undefined;
            hours?: string | undefined;
        } | undefined;
    };
    /**
  * Function to get status and date for message bubble
  * @param {CometChat.BaseMessage} item - The message bubble for which the information needs to be fetched
  * @returns {JSX.Element | null} Returns JSX.Element for status and date of a message bubble or null
  */
    getBubbleStatusInfoDate: (item: CometChat$1.BaseMessage, messageSentAtDateTimeFormat?: CalendarObject) => JSX.Element | null;
    getStatusInfoView: (_messageObject: CometChat$1.BaseMessage, _alignment: MessageBubbleAlignment, hideReceipt?: boolean, messageSentAtDateTimeFormat?: CalendarObject) => react_jsx_runtime.JSX.Element | null;
    getBottomView(_messageObject: CometChat$1.BaseMessage, _alignment: MessageBubbleAlignment): null;
    getTextMessageTemplate(additionalConfigurations?: additionalParams): CometChatMessageTemplate;
    getAudioMessageTemplate(): CometChatMessageTemplate;
    getVideoMessageTemplate(): CometChatMessageTemplate;
    getImageMessageTemplate(): CometChatMessageTemplate;
    getGroupActionTemplate(additionalConfigurations?: {
        hideGroupActionMessages?: boolean;
    }): CometChatMessageTemplate;
    getFileMessageTemplate(): CometChatMessageTemplate;
    getAllMessageTemplates(additionalConfigurations?: additionalParams): Array<CometChatMessageTemplate>;
    getMessageTemplate(messageType: string, messageCategory: string, additionalConfigurations?: additionalParams): CometChatMessageTemplate | null;
    getMessageOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: additionalParamsOptions): Array<CometChatActionsIcon | CometChatActionsView>;
    getCommonOptions(loggedInUser: CometChat$1.User, messageObject: CometChat$1.BaseMessage, group?: CometChat$1.Group, additionalParams?: additionalParamsOptions): Array<CometChatActionsIcon | CometChatActionsView>;
    getAllMessageTypes(): Array<string>;
    addList(): string;
    getAllMessageCategories(additionalConfigurations?: {
        hideGroupActionMessages?: boolean;
    }): Array<string>;
    getStickerButton(id: ComposerId, user?: CometChat$1.User, group?: CometChat$1.Group): JSX.Element | undefined;
    getId(): string;
    getTextMessageContentView(message: CometChat$1.TextMessage, _alignment: MessageBubbleAlignment, additionalConfigurations?: additionalParams): JSX.Element | Element;
    getAudioMessageContentView(message: CometChat$1.MediaMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
    getFileMessageContentView(message: CometChat$1.MediaMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
    getImageMessageContentView(message: CometChat$1.MediaMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
    getVideoMessageContentView(message: CometChat$1.MediaMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
    getActionMessage(message: any): string;
    getDeleteMessageBubble(message: CometChat$1.BaseMessage, text?: string, alignment?: MessageBubbleAlignment): react_jsx_runtime.JSX.Element;
    getGroupActionBubble(message: CometChat$1.BaseMessage): react_jsx_runtime.JSX.Element;
    getTextMessageBub