Interface MessagesModalOptions

interface MessagesModalOptions {
    isMessagesModalVisible: boolean;
    onMessagesClose: (() => void);
    onSendMessagePress?: ((options: SendMessageOptions) => Promise<void>);
    messages: Message[];
    eventType: EventType;
    member: string;
    islevel: string;
    coHostResponsibility: CoHostResponsibility[];
    coHost: string;
    startDirectMessage: boolean;
    directMessageDetails: null | Participant;
    updateStartDirectMessage: ((start: boolean) => void);
    updateDirectMessageDetails: ((participant: null | Participant) => void);
    showAlert?: ShowAlert;
    roomName: string;
    socket: Socket<DefaultEventsMap, DefaultEventsMap>;
    chatSetting: string;
    position?: string;
    backgroundColor?: string;
    activeTabBackgroundColor?: string;
    title?: ReactNode;
    overlayProps?: HTMLAttributes<HTMLDivElement>;
    contentProps?: HTMLAttributes<HTMLDivElement>;
    headerProps?: HTMLAttributes<HTMLDivElement>;
    titleProps?: HTMLAttributes<HTMLDivElement>;
    tabListProps?: HTMLAttributes<HTMLDivElement>;
    tabButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
    closeButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
    closeIconComponent?: ReactNode;
    bodyProps?: HTMLAttributes<HTMLDivElement>;
    directPanelWrapperProps?: HTMLAttributes<HTMLDivElement>;
    groupPanelWrapperProps?: HTMLAttributes<HTMLDivElement>;
    emptyState?: ReactNode | ((context: {
        type: "group" | "direct";
    }) => ReactNode);
    renderHeader?: ((options: {
        defaultHeader: ReactNode;
        activeTab: "group" | "direct";
        onClose: (() => void);
    }) => ReactNode);
    renderTabs?: ((options: {
        defaultTabs: ReactNode;
        activeTab: "group" | "direct";
        switchToDirect: (() => void);
        switchToGroup: (() => void);
    }) => ReactNode);
    renderTabButton?: ((options: {
        type: "group" | "direct";
        isActive: boolean;
        defaultButton: ReactNode;
        switchTo: (() => void);
    }) => ReactNode);
    renderPanels?: ((options: {
        defaultPanels: ReactNode;
        activeTab: "group" | "direct";
    }) => ReactNode);
    renderBody?: ((options: {
        defaultBody: ReactNode;
        activeTab: "group" | "direct";
    }) => ReactNode);
    renderContent?: ((options: {
        defaultContent: ReactNode;
        activeTab: "group" | "direct";
    }) => ReactNode);
}

Properties

isMessagesModalVisible onMessagesClose onSendMessagePress? messages eventType member islevel coHostResponsibility coHost startDirectMessage directMessageDetails updateStartDirectMessage updateDirectMessageDetails showAlert? roomName socket chatSetting position? backgroundColor? activeTabBackgroundColor? title? overlayProps? contentProps? headerProps? titleProps? tabListProps? tabButtonProps? closeButtonProps? closeIconComponent? bodyProps? directPanelWrapperProps? groupPanelWrapperProps? emptyState? renderHeader? renderTabs? renderTabButton? renderPanels? renderBody? renderContent?

Properties

isMessagesModalVisible

isMessagesModalVisible: boolean

onMessagesClose

onMessagesClose: (() => void)

OptionalonSendMessagePress

onSendMessagePress?: ((options: SendMessageOptions) => Promise<void>)

messages

messages: Message[]

eventType

eventType: EventType

member

member: string

islevel

islevel: string

coHostResponsibility

coHostResponsibility: CoHostResponsibility[]

coHost

coHost: string

startDirectMessage

startDirectMessage: boolean

directMessageDetails

directMessageDetails: null | Participant

updateStartDirectMessage

updateStartDirectMessage: ((start: boolean) => void)

updateDirectMessageDetails

updateDirectMessageDetails: ((participant: null | Participant) => void)

OptionalshowAlert

showAlert?: ShowAlert

roomName

roomName: string

socket

socket: Socket<DefaultEventsMap, DefaultEventsMap>

chatSetting

chatSetting: string

Optionalposition

position?: string

OptionalbackgroundColor

backgroundColor?: string

OptionalactiveTabBackgroundColor

activeTabBackgroundColor?: string

Optionaltitle

title?: ReactNode

OptionaloverlayProps

overlayProps?: HTMLAttributes<HTMLDivElement>

OptionalcontentProps

contentProps?: HTMLAttributes<HTMLDivElement>

OptionalheaderProps

headerProps?: HTMLAttributes<HTMLDivElement>

OptionaltitleProps

titleProps?: HTMLAttributes<HTMLDivElement>

OptionaltabListProps

tabListProps?: HTMLAttributes<HTMLDivElement>

OptionaltabButtonProps

tabButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>

OptionalcloseButtonProps

closeButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>

OptionalcloseIconComponent

closeIconComponent?: ReactNode

OptionalbodyProps

bodyProps?: HTMLAttributes<HTMLDivElement>

OptionaldirectPanelWrapperProps

directPanelWrapperProps?: HTMLAttributes<HTMLDivElement>

OptionalgroupPanelWrapperProps

groupPanelWrapperProps?: HTMLAttributes<HTMLDivElement>

OptionalemptyState

emptyState?: ReactNode | ((context: {
    type: "group" | "direct";
}) => ReactNode)

OptionalrenderHeader

renderHeader?: ((options: {
    defaultHeader: ReactNode;
    activeTab: "group" | "direct";
    onClose: (() => void);
}) => ReactNode)

OptionalrenderTabs

renderTabs?: ((options: {
    defaultTabs: ReactNode;
    activeTab: "group" | "direct";
    switchToDirect: (() => void);
    switchToGroup: (() => void);
}) => ReactNode)

OptionalrenderTabButton

renderTabButton?: ((options: {
    type: "group" | "direct";
    isActive: boolean;
    defaultButton: ReactNode;
    switchTo: (() => void);
}) => ReactNode)

OptionalrenderPanels

renderPanels?: ((options: {
    defaultPanels: ReactNode;
    activeTab: "group" | "direct";
}) => ReactNode)

OptionalrenderBody

renderBody?: ((options: {
    defaultBody: ReactNode;
    activeTab: "group" | "direct";
}) => ReactNode)

OptionalrenderContent

renderContent?: ((options: {
    defaultContent: ReactNode;
    activeTab: "group" | "direct";
}) => ReactNode)

Settings

Member Visibility

On This Page

Properties