import { CommunicationParticipant , MessageRenderer , MessageProps } from '@internal/react-components' ; import React from 'react' ; import { BaseComposite , BaseCompositeProps } from '../common/BaseComposite' ; import { ChatCompositeIcons } from '../common/icons' ; import { ChatAdapter } from './adapter/ChatAdapter' ; import { ChatAdapterProvider } from './adapter/ChatAdapterProvider' ; import { chatScreenContainerStyle } from './styles/Chat.styles' ; import { ChatScreen } from './ChatScreen' ; /**
 * Props for  ChatComposite .
 *
 *  public export interface ChatCompositeProps extends BaseCompositeProps < ChatCompositeIcons > { /**
     * An adapter provides logic and data to the composite.
     * Composite can also be controlled using the adapter.
     */ adapter : ChatAdapter ; /**
     * `(messageProps: MessageProps, defaultOnRender?: MessageRenderer) => JSX.Element`
     * A callback for customizing the message renderer.
     */ onRenderMessage ? : ( messageProps : MessageProps , defaultOnRender ? : MessageRenderer ) => JSX . Element ; /**
     * `(typingUsers: CommunicationParticipant[]) => JSX.Element`
     * A callback for customizing the typing indicator renderer.
     */ onRenderTypingIndicator ? : ( typingUsers : CommunicationParticipant [ ] ) => JSX . Element ; /**
     * Flags to enable/disable visual elements of the  ChatComposite .
      options ? : ChatCompositeOptions ; } /**
 * Optional features of the  ChatComposite .
 *
 *  public export type ChatCompositeOptions = { /**
     * Surface Azure Communication Services backend errors in the UI with  {@link @azure/communication-react#ErrorBar} .
     * Hide or show the error bar.
     *  defaultValue errorBar ? : boolean ; defaultValue beta participantPane ? : boolean ; defaultValue topic ? : boolean ; /**
     * Set focus on the composite when the composite first mounts.
     */ autoFocus ? : 'sendBoxTextField' | false ; } ; remarks public export const ChatComposite = ( props ) : JSX . Element => { const { adapter , options , onFetchAvatarPersonaData , onRenderTypingIndicator , onRenderMessage , onFetchParticipantMenuItems } = props ; return ( < div className = { chatScreenContainerStyle } > < BaseComposite { ... props } > < ChatAdapterProvider adapter = { adapter } > < ChatScreen options = { options } onFetchAvatarPersonaData = { onFetchAvatarPersonaData } onRenderTypingIndicator = { onRenderTypingIndicator } onRenderMessage = { onRenderMessage } onFetchParticipantMenuItems = { onFetchParticipantMenuItems } / > < /ChatAdapterProvider> < /BaseComposite> < /div>); } ;