react-components.api.md

API Report File for "@internal/react-components"

Do not edit this file. It is a report generated by API Extractor.

/// <reference types="react" />

import { ComponentSlotStyle } from '@fluentui/react-northstar';
import { IButtonProps } from '@fluentui/react';
import { IButtonStyles } from '@fluentui/react';
import { IContextualMenuItem } from '@fluentui/react';
import { IContextualMenuItemStyles } from '@fluentui/react';
import { IContextualMenuStyles } from '@fluentui/react';
import { IIconProps } from '@fluentui/react';
import { IMessageBarProps } from '@fluentui/react';
import { IPersonaStyleProps } from '@fluentui/react';
import { IPersonaStyles } from '@fluentui/react';
import { IRenderFunction } from '@fluentui/react';
import { IStyle } from '@fluentui/react';
import { IStyleFunctionOrObject } from '@fluentui/react';
import { MessageStatus } from '@internal/acs-ui-common';
import { PartialTheme } from '@fluentui/react';
import { PersonaPresence } from '@fluentui/react';
import { PersonaSize } from '@fluentui/react';
import { default as React_2 } from 'react';
import { Theme } from '@fluentui/react';

// @public
export interface ActiveErrorMessage {
    timestamp?: Date;
    type: ErrorType;
}

// @public
export interface BaseCustomStyles {
    root?: IStyle;
}

// @public
export interface CallingTheme {
    // (undocumented)
    callingPalette: {
        callRed: string;
        callRedDark: string;
        callRedDarker: string;
        iconWhite: string;
    };
}

// @public
export type CallParticipantListParticipant = ParticipantListParticipant & {
    state: 'Idle' | 'Connecting' | 'Ringing' | 'Connected' | 'Hold' | 'InLobby' | 'EarlyMedia' | 'Disconnected';
    isScreenSharing?: boolean;
    isMuted?: boolean;
    isSpeaking?: boolean;
};

// @public
export const CameraButton: (props: CameraButtonProps) => JSX.Element;

// @public
export interface CameraButtonProps extends ControlBarButtonProps {
    localVideoViewOptions?: VideoStreamOptions;
    onToggleCamera?: (options?: VideoStreamOptions) => Promise<void>;
    strings?: Partial<CameraButtonStrings>;
}

// @public
export interface CameraButtonStrings {
    offLabel: string;
    onLabel: string;
    tooltipDisabledContent?: string;
    tooltipOffContent?: string;
    tooltipOnContent?: string;
    tooltipVideoLoadingContent?: string;
}

// @public
export interface ChatMessage extends MessageCommon {
    // (undocumented)
    attached?: MessageAttachedStatus;
    // (undocumented)
    clientMessageId?: string;
    // (undocumented)
    content?: string;
    // (undocumented)
    contentType: MessageContentType;
    // (undocumented)
    deletedOn?: Date;
    // (undocumented)
    editedOn?: Date;
    // (undocumented)
    messageType: 'chat';
    metadata?: Record<string, string>;
    // (undocumented)
    mine?: boolean;
    // (undocumented)
    readBy?: {
        id: string;
        name: string;
    }[];
    // (undocumented)
    readNumber?: number;
    // (undocumented)
    senderDisplayName?: string;
    // (undocumented)
    senderId?: string;
    // (undocumented)
    status?: MessageStatus;
}

// @public
export type CommunicationParticipant = {
    userId: string;
    displayName?: string;
};

// @public
export const COMPONENT_LOCALE_DE_DE: ComponentLocale;

// @public
export const COMPONENT_LOCALE_EN_GB: ComponentLocale;

// @public
export const COMPONENT_LOCALE_EN_US: ComponentLocale;

// @public
export const COMPONENT_LOCALE_ES_ES: ComponentLocale;

// @public
export const COMPONENT_LOCALE_FR_FR: ComponentLocale;

// @public
export const COMPONENT_LOCALE_IT_IT: ComponentLocale;

// @public
export const COMPONENT_LOCALE_JA_JP: ComponentLocale;

// @public
export const COMPONENT_LOCALE_KO_KR: ComponentLocale;

// @public
export const COMPONENT_LOCALE_NL_NL: ComponentLocale;

// @public
export const COMPONENT_LOCALE_PT_BR: ComponentLocale;

// @public
export const COMPONENT_LOCALE_RU_RU: ComponentLocale;

// @public
export const COMPONENT_LOCALE_TR_TR: ComponentLocale;

// @public
export const COMPONENT_LOCALE_ZH_CN: ComponentLocale;

// @public
export const COMPONENT_LOCALE_ZH_TW: ComponentLocale;

// @public
export type ComponentIcons = Record<keyof typeof DEFAULT_COMPONENT_ICONS, JSX.Element>;

// @public
export interface ComponentLocale {
    strings: ComponentStrings;
}

// @public
export interface ComponentStrings {
    cameraButton: CameraButtonStrings;
    devicesButton: DevicesButtonStrings;
    endCallButton: EndCallButtonStrings;
    errorBar: ErrorBarStrings;
    messageStatusIndicator: MessageStatusIndicatorStrings;
    messageThread: MessageThreadStrings;
    microphoneButton: MicrophoneButtonStrings;
    participantItem: ParticipantItemStrings;
    participantsButton: ParticipantsButtonStrings;
    screenShareButton: ScreenShareButtonStrings;
    sendBox: SendBoxStrings;
    typingIndicator: TypingIndicatorStrings;
    videoGallery: VideoGalleryStrings;
}

// @public
export interface ContentSystemMessage extends SystemMessageCommon {
    // (undocumented)
    content: string;
    // (undocumented)
    systemMessageType: 'content';
}

// @public
export const ControlBar: (props: ControlBarProps) => JSX.Element;

// @public
export const ControlBarButton: (props: ControlBarButtonProps) => JSX.Element;

// @public
export interface ControlBarButtonProps extends IButtonProps {
    labelKey?: string;
    onRenderOffIcon?: IRenderFunction<IButtonProps>;
    onRenderOnIcon?: IRenderFunction<IButtonProps>;
    showLabel?: boolean;
    strings?: ControlBarButtonStrings;
    styles?: ControlBarButtonStyles;
    tooltipId?: string;
}

// @public
export interface ControlBarButtonStrings {
    label?: string;
    offLabel?: string;
    onLabel?: string;
    tooltipContent?: string;
    tooltipDisabledContent?: string;
    tooltipOffContent?: string;
    tooltipOnContent?: string;
}

// @public
export type ControlBarButtonStyles = IButtonStyles;

// @public
export type ControlBarLayout = 'horizontal' | 'vertical' | 'dockedTop' | 'dockedBottom' | 'dockedLeft' | 'dockedRight' | 'floatingTop' | 'floatingBottom' | 'floatingLeft' | 'floatingRight';

// @public
export interface ControlBarProps {
    children?: React_2.ReactNode;
    layout?: ControlBarLayout;
    styles?: BaseCustomStyles;
}

// @public
export type CustomAvatarOptions = {
    coinSize?: number;
    hidePersonaDetails?: boolean;
    initialsTextColor?: string;
    noVideoAvailableAriaLabel?: string;
    presence?: PersonaPresence;
    size?: PersonaSize;
    styles?: IStyleFunctionOrObject<IPersonaStyleProps, IPersonaStyles>;
    text?: string;
};

// @public
export interface CustomMessage extends MessageCommon {
    // (undocumented)
    content: string;
    // (undocumented)
    messageType: 'custom';
}

// @public
export const darkTheme: PartialTheme & CallingTheme;

// @public
export const DEFAULT_COMPONENT_ICONS: {
    ControlButtonCameraOff: JSX.Element;
    ControlButtonCameraOn: JSX.Element;
    ControlButtonEndCall: JSX.Element;
    ControlButtonMicOff: JSX.Element;
    ControlButtonMicOn: JSX.Element;
    ControlButtonOptions: JSX.Element;
    ControlButtonParticipants: JSX.Element;
    ControlButtonScreenShareStart: JSX.Element;
    ControlButtonScreenShareStop: JSX.Element;
    EditBoxCancel: JSX.Element;
    EditBoxSubmit: JSX.Element;
    ErrorBarCallCameraAccessDenied: JSX.Element;
    ErrorBarCallCameraAlreadyInUse: JSX.Element;
    ErrorBarCallLocalVideoFreeze: JSX.Element;
    ErrorBarCallMacOsCameraAccessDenied: JSX.Element;
    ErrorBarCallMacOsMicrophoneAccessDenied: JSX.Element;
    ErrorBarCallMicrophoneAccessDenied: JSX.Element;
    ErrorBarCallMicrophoneMutedBySystem: JSX.Element;
    ErrorBarCallNetworkQualityLow: JSX.Element;
    ErrorBarCallNoMicrophoneFound: JSX.Element;
    ErrorBarCallNoSpeakerFound: JSX.Element;
    HorizontalGalleryLeftButton: JSX.Element;
    HorizontalGalleryRightButton: JSX.Element;
    MessageDelivered: JSX.Element;
    MessageEdit: JSX.Element;
    MessageFailed: JSX.Element;
    MessageRemove: JSX.Element;
    MessageSeen: JSX.Element;
    MessageSending: JSX.Element;
    OptionsCamera: JSX.Element;
    OptionsMic: JSX.Element;
    OptionsSpeaker: JSX.Element;
    ParticipantItemMicOff: JSX.Element;
    ParticipantItemOptions: JSX.Element;
    ParticipantItemOptionsHovered: JSX.Element;
    ParticipantItemScreenShareStart: JSX.Element;
    SendBoxSend: JSX.Element;
    SendBoxSendHovered: JSX.Element;
    VideoTileMicOff: JSX.Element;
};

// @public
export const DevicesButton: (props: DevicesButtonProps) => JSX.Element;

// @public
export interface DevicesButtonContextualMenuStyles extends IContextualMenuStyles {
    menuItemStyles?: IContextualMenuItemStyles;
}

// @public
export interface DevicesButtonProps extends ControlBarButtonProps {
    cameras?: OptionsDevice[];
    microphones?: OptionsDevice[];
    onSelectCamera?: (device: OptionsDevice) => Promise<void>;
    onSelectMicrophone?: (device: OptionsDevice) => Promise<void>;
    onSelectSpeaker?: (device: OptionsDevice) => Promise<void>;
    selectedCamera?: OptionsDevice;
    selectedMicrophone?: OptionsDevice;
    selectedSpeaker?: OptionsDevice;
    speakers?: OptionsDevice[];
    strings?: Partial<DevicesButtonStrings>;
    styles?: DevicesButtonStyles;
}

// @public
export interface DevicesButtonStrings {
    cameraMenuTitle: string;
    cameraMenuTooltip: string;
    label: string;
    microphoneMenuTitle: string;
    microphoneMenuTooltip: string;
    speakerMenuTitle: string;
    speakerMenuTooltip: string;
    tooltipContent?: string;
}

// @public
export interface DevicesButtonStyles extends ControlBarButtonStyles {
    menuStyles?: Partial<DevicesButtonContextualMenuStyles>;
}

// @internal
export const _DrawerMenu: (props: _DrawerMenuProps) => JSX.Element;

// @internal
export interface _DrawerMenuItemProps {
    iconProps?: IIconProps;
    // (undocumented)
    itemKey: string;
    // (undocumented)
    onItemClick?: (ev?: React_2.MouseEvent<HTMLElement> | React_2.KeyboardEvent<HTMLElement>, itemKey?: string) => void;
    secondaryIconProps?: IIconProps;
    secondaryText?: string;
    // (undocumented)
    styles?: BaseCustomStyles;
    // (undocumented)
    subMenuProps?: _DrawerMenuItemProps[];
    text?: string;
}

// @internal
export interface _DrawerMenuProps {
    // (undocumented)
    items: _DrawerMenuItemProps[];
    onLightDismiss: () => void;
    // (undocumented)
    styles?: _DrawerMenuStyles;
}

// @internal
export interface _DrawerMenuStyles extends BaseCustomStyles {
    drawerSurfaceStyles?: _DrawerSurfaceStyles;
}

// @internal
export const _DrawerSurface: (props: _DrawerSurfaceProps) => JSX.Element;

// @internal
export interface _DrawerSurfaceProps {
    children: React_2.ReactNode;
    onLightDismiss: () => void;
    styles?: _DrawerSurfaceStyles;
}

// @internal
export interface _DrawerSurfaceStyles extends BaseCustomStyles {
    drawerContentContainer?: BaseCustomStyles;
    drawerContentRoot?: BaseCustomStyles;
    lightDismissRoot?: BaseCustomStyles;
}

// @public
export const EndCallButton: (props: EndCallButtonProps) => JSX.Element;

// @public
export interface EndCallButtonProps extends ControlBarButtonProps {
    onHangUp?: () => Promise<void>;
    strings?: EndCallButtonStrings;
}

// @public
export interface EndCallButtonStrings {
    label: string;
    tooltipContent?: string;
}

// @public
export const ErrorBar: (props: ErrorBarProps) => JSX.Element;

// @public
export interface ErrorBarProps extends IMessageBarProps {
    activeErrorMessages: ActiveErrorMessage[];
    strings?: ErrorBarStrings;
}

// @public
export interface ErrorBarStrings {
    accessDenied: string;
    callCameraAccessDenied: string;
    callCameraAlreadyInUse: string;
    callLocalVideoFreeze: string;
    callMacOsCameraAccessDenied: string;
    callMacOsMicrophoneAccessDenied: string;
    callMacOsScreenShareAccessDenied: string;
    callMicrophoneAccessDenied: string;
    callMicrophoneMutedBySystem: string;
    callNetworkQualityLow: string;
    callNoMicrophoneFound: string;
    callNoSpeakerFound: string;
    muteGeneric: string;
    sendMessageGeneric: string;
    sendMessageNotInChatThread: string;
    startScreenShareGeneric: string;
    startVideoGeneric: string;
    stopScreenShareGeneric: string;
    stopVideoGeneric: string;
    unableToReachChatService: string;
    unmuteGeneric: string;
    userNotInChatThread: string;
}

// @public
export type ErrorType = keyof ErrorBarStrings;

// @public
export const FluentThemeProvider: (props: FluentThemeProviderProps) => JSX.Element;

// @public
export interface FluentThemeProviderProps {
    children: React_2.ReactNode;
    fluentTheme?: PartialTheme | Theme;
    rtl?: boolean;
}

// @public
export const GridLayout: (props: GridLayoutProps) => JSX.Element;

// @public
export interface GridLayoutProps {
    // (undocumented)
    children: React_2.ReactNode;
    styles?: BaseCustomStyles;
}

// @public
export interface GridLayoutStyles extends BaseCustomStyles {
    children?: IStyle;
}

// @public
export interface HorizontalGalleryStyles extends BaseCustomStyles {
    children?: IStyle;
    nextButton?: IStyle;
    previousButton?: IStyle;
}

// @internal
export const _IdentifierProvider: (props: _IdentifierProviderProps) => JSX.Element;

// @internal
export interface _IdentifierProviderProps {
    // (undocumented)
    children: React_2.ReactNode;
    // (undocumented)
    identifiers?: _Identifiers;
}

// @internal
export interface _Identifiers {
    horizontalGalleryLeftNavButton: string;
    horizontalGalleryRightNavButton: string;
    messageContent: string;
    messageTimestamp: string;
    participantButtonPeopleMenuItem: string;
    participantItemMenuButton: string;
    participantList: string;
    participantListPeopleButton: string;
    participantListRemoveParticipantButton: string;
    sendboxTextField: string;
    typingIndicator: string;
    videoGallery: string;
    videoTile: string;
}

// @public
export interface JumpToNewMessageButtonProps {
    onClick: () => void;
    text: string;
}

// @public
export const lightTheme: PartialTheme & CallingTheme;

// @public
export const LocalizationProvider: (props: LocalizationProviderProps) => JSX.Element;

// @public
export type LocalizationProviderProps = {
    locale: ComponentLocale;
    children: React_2.ReactNode;
};

// Warning: (ae-internal-missing-underscore) The name "LocalVideoCameraCycleButton" should be prefixed with an underscore because the declaration is marked as @internal
//
// @internal
export const LocalVideoCameraCycleButton: (props: LocalVideoCameraCycleButtonProps) => JSX.Element;

// @beta (undocumented)
export interface LocalVideoCameraCycleButtonProps {
    cameras?: OptionsDevice[];
    label?: string;
    onSelectCamera?: (device: OptionsDevice) => Promise<void>;
    selectedCamera?: OptionsDevice;
}

// @public
export type Message = ChatMessage | SystemMessage | CustomMessage;

// @public
export type MessageAttachedStatus = 'bottom' | 'top' | boolean;

// @public
export interface MessageCommon {
    // (undocumented)
    createdOn: Date;
    // (undocumented)
    messageId: string;
}

// @public
export type MessageContentType = 'text' | 'html' | 'richtext/html' | 'unknown';

// @public
export type MessageProps = {
    message: Message;
    strings: MessageThreadStrings;
    messageContainerStyle?: ComponentSlotStyle;
    showDate?: boolean;
    disableEditing?: boolean;
    onUpdateMessage?: (messageId: string, content: string) => Promise<void>;
    onDeleteMessage?: (messageId: string) => Promise<void>;
};

// @public
export type MessageRenderer = (props: MessageProps) => JSX.Element;

// @public
export const MessageStatusIndicator: (props: MessageStatusIndicatorProps) => JSX.Element;

// @public
export interface MessageStatusIndicatorProps {
    messageThreadReadCount?: number;
    remoteParticipantsCount?: number;
    status?: MessageStatus;
    strings?: MessageStatusIndicatorStrings;
    styles?: BaseCustomStyles;
}

// @public
export interface MessageStatusIndicatorStrings {
    deliveredAriaLabel?: string;
    deliveredTooltipText: string;
    failedToSendAriaLabel?: string;
    failedToSendTooltipText: string;
    readByTooltipText?: string;
    seenAriaLabel?: string;
    seenTooltipText: string;
    sendingAriaLabel?: string;
    sendingTooltipText: string;
}

// @public
export const MessageThread: (props: MessageThreadProps) => JSX.Element;

// @public
export type MessageThreadProps = {
    userId: string;
    messages: (ChatMessage | SystemMessage | CustomMessage)[];
    messageThreadParticipantCount?: number;
    styles?: MessageThreadStyles;
    disableJumpToNewMessageButton?: boolean;
    showMessageDate?: boolean;
    showMessageStatus?: boolean;
    numberOfChatMessagesToReload?: number;
    onMessageSeen?: (messageId: string) => Promise<void>;
    onRenderMessageStatus?: (messageStatusIndicatorProps: MessageStatusIndicatorProps) => JSX.Element | null;
    onRenderAvatar?: OnRenderAvatarCallback;
    onRenderJumpToNewMessageButton?: (newMessageButtonProps: JumpToNewMessageButtonProps) => JSX.Element;
    onLoadPreviousChatMessages?: (messagesToLoad: number) => Promise<boolean>;
    onRenderMessage?: (messageProps: MessageProps, messageRenderer?: MessageRenderer) => JSX.Element;
    onRenderFileDownloads?: (userId: string, message: ChatMessage) => JSX.Element;
    onUpdateMessage?: (messageId: string, content: string) => Promise<void>;
    onDeleteMessage?: (messageId: string) => Promise<void>;
    disableEditing?: boolean;
    strings?: Partial<MessageThreadStrings>;
};

// @public
export interface MessageThreadStrings {
    editBoxCancelButton: string;
    editBoxPlaceholderText: string;
    editBoxSubmitButton: string;
    editBoxTextLimit: string;
    editedTag: string;
    editMessage: string;
    friday: string;
    liveAuthorIntro: string;
    messageReadCount?: string;
    monday: string;
    newMessagesIndicator: string;
    noDisplayNameSub: string;
    participantJoined: string;
    participantLeft: string;
    removeMessage: string;
    saturday: string;
    sunday: string;
    thursday: string;
    tuesday: string;
    wednesday: string;
    yesterday: string;
}

// @public
export interface MessageThreadStyles extends BaseCustomStyles {
    chatContainer?: ComponentSlotStyle;
    chatItemMessageContainer?: ComponentSlotStyle;
    chatMessageContainer?: ComponentSlotStyle;
    loadPreviousMessagesButtonContainer?: IStyle;
    messageStatusContainer?: (mine: boolean) => IStyle;
    myChatItemMessageContainer?: ComponentSlotStyle;
    myChatMessageContainer?: ComponentSlotStyle;
    newMessageButtonContainer?: IStyle;
    systemMessageContainer?: ComponentSlotStyle;
}

// @public
export const MicrophoneButton: (props: MicrophoneButtonProps) => JSX.Element;

// @public
export interface MicrophoneButtonProps extends ControlBarButtonProps {
    onToggleMicrophone?: () => Promise<void>;
    strings?: Partial<MicrophoneButtonStrings>;
}

// @public
export interface MicrophoneButtonStrings {
    offLabel: string;
    onLabel: string;
    tooltipDisabledContent?: string;
    tooltipOffContent?: string;
    tooltipOnContent?: string;
}

// @public
export type OnRenderAvatarCallback = (
userId?: string, options?: CustomAvatarOptions,
defaultOnRender?: (props: CustomAvatarOptions) => JSX.Element) => JSX.Element;

// @public
export interface OptionsDevice {
    id: string;
    name: string;
}

// @public
export interface ParticipantAddedSystemMessage extends SystemMessageCommon {
    // (undocumented)
    participants: CommunicationParticipant[];
    // (undocumented)
    systemMessageType: 'participantAdded';
}

// @public
export const ParticipantItem: (props: ParticipantItemProps) => JSX.Element;

// @public
export interface ParticipantItemProps {
    displayName: string;
    me?: boolean;
    menuItems?: IContextualMenuItem[];
    onRenderAvatar?: OnRenderAvatarCallback;
    onRenderIcon?: (props?: ParticipantItemProps) => JSX.Element | null;
    presence?: PersonaPresence;
    strings?: Partial<ParticipantItemStrings>;
    styles?: ParticipantItemStyles;
    userId?: string;
}

// @public
export interface ParticipantItemStrings {
    isMeText: string;
    menuTitle: string;
    mutedIconLabel: string;
    removeButtonLabel: string;
    sharingIconLabel: string;
}

// @public
export interface ParticipantItemStyles extends BaseCustomStyles {
    avatar?: IStyle;
    iconContainer?: IStyle;
    me?: IStyle;
    menu?: IStyle;
}

// @public
export const ParticipantList: (props: ParticipantListProps) => JSX.Element;

// @public
export interface ParticipantListItemStyles extends ParticipantItemStyles {
    participantSubMenuItemsStyles?: IContextualMenuItemStyles;
}

// @public
export type ParticipantListParticipant = CommunicationParticipant & {
    isRemovable: boolean;
};

// @public
export type ParticipantListProps = {
    participants: ParticipantListParticipant[];
    myUserId?: string;
    excludeMe?: boolean;
    onRenderParticipant?: (participant: ParticipantListParticipant) => JSX.Element | null;
    onRenderAvatar?: OnRenderAvatarCallback;
    onRemoveParticipant?: (userId: string) => void;
    onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;
    styles?: ParticipantListStyles;
};

// @public
export interface ParticipantListStyles extends BaseCustomStyles {
    participantItemStyles?: ParticipantListItemStyles;
}

// @public
export type ParticipantMenuItemsCallback = (participantUserId: string, userId?: string, defaultMenuItems?: IContextualMenuItem[]) => IContextualMenuItem[];

// @public
export interface ParticipantRemovedSystemMessage extends SystemMessageCommon {
    // (undocumented)
    participants: CommunicationParticipant[];
    // (undocumented)
    systemMessageType: 'participantRemoved';
}

// @public
export const ParticipantsButton: (props: ParticipantsButtonProps) => JSX.Element;

// @public
export interface ParticipantsButtonContextualMenuStyles extends IContextualMenuStyles {
    menuItemStyles?: IContextualMenuItemStyles;
    participantListStyles?: ParticipantListStyles;
}

// @public
export interface ParticipantsButtonProps extends ControlBarButtonProps {
    callInvitationURL?: string;
    excludeMe?: boolean;
    myUserId?: string;
    onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;
    onMuteAll?: () => void;
    onRemoveParticipant?: (userId: string) => void;
    onRenderAvatar?: OnRenderAvatarCallback;
    onRenderParticipant?: (participant: CommunicationParticipant) => JSX.Element | null;
    onRenderParticipantList?: (props: ParticipantListProps) => JSX.Element | null;
    participants: ParticipantListParticipant[];
    strings?: Partial<ParticipantsButtonStrings>;
    styles?: ParticipantsButtonStyles;
}

// @public
export interface ParticipantsButtonStrings {
    copyInviteLinkButtonLabel: string;
    label: string;
    menuHeader: string;
    muteAllButtonLabel: string;
    participantsListButtonLabel: string;
    tooltipContent?: string;
}

// @public
export interface ParticipantsButtonStyles extends ControlBarButtonStyles {
    menuStyles?: Partial<ParticipantsButtonContextualMenuStyles>;
}

// @internal
export const _PictureInPictureInPicture: (props: _PictureInPictureInPictureProps) => JSX.Element;

// @internal
export interface _PictureInPictureInPictureProps {
    onClick?: () => void;
    // (undocumented)
    primaryTile: _PictureInPictureInPictureTileProps;
    // (undocumented)
    secondaryTile?: _PictureInPictureInPictureTileProps;
    // (undocumented)
    strings: _PictureInPictureInPictureStrings;
}

// @internal
export interface _PictureInPictureInPictureStrings {
    rootAriaLabel: string;
}

// @internal (undocumented)
export interface _PictureInPictureInPictureTileProps extends Pick<VideoTileProps, 'styles' | 'displayName' | 'renderElement' | 'isMirrored' | 'noVideoAvailableAriaLabel'> {
    // (undocumented)
    orientation: _TileOrientation;
}

// @public
export const ScreenShareButton: (props: ScreenShareButtonProps) => JSX.Element;

// @public
export interface ScreenShareButtonProps extends ControlBarButtonProps {
    onToggleScreenShare?: () => Promise<void>;
    strings?: Partial<ScreenShareButtonStrings>;
}

// @public
export interface ScreenShareButtonStrings {
    offLabel: string;
    onLabel: string;
    tooltipDisabledContent?: string;
    tooltipOffContent?: string;
    tooltipOnContent?: string;
}

// @public
export const SendBox: (props: SendBoxProps) => JSX.Element;

// @public
export interface SendBoxProps {
    autoFocus?: 'sendBoxTextField';
    disabled?: boolean;
    // @beta
    onRenderFileUploads?: () => JSX.Element;
    onRenderIcon?: (isHover: boolean) => JSX.Element;
    onRenderSystemMessage?: (systemMessage: string | undefined) => React_2.ReactElement;
    onSendMessage?: (content: string) => Promise<void>;
    onTyping?: () => Promise<void>;
    strings?: Partial<SendBoxStrings>;
    styles?: SendBoxStylesProps;
    supportNewline?: boolean;
    systemMessage?: string;
}

// @public
export interface SendBoxStrings {
    placeholderText: string;
    sendButtonAriaLabel: string;
    textTooLong: string;
}

// @public
export interface SendBoxStylesProps extends BaseCustomStyles {
    sendMessageIcon?: IStyle;
    sendMessageIconContainer?: IStyle;
    systemMessage?: IStyle;
    textField?: IStyle;
    textFieldContainer?: IStyle;
}

// @public
export const StreamMedia: (props: StreamMediaProps) => JSX.Element;

// @public
export interface StreamMediaProps {
    isMirrored?: boolean;
    styles?: BaseCustomStyles;
    videoStreamElement: HTMLElement | null;
}

// @public
export type SystemMessage = ParticipantAddedSystemMessage | ParticipantRemovedSystemMessage | TopicUpdatedSystemMessage | ContentSystemMessage;

// @public
export interface SystemMessageCommon extends MessageCommon {
    // (undocumented)
    iconName: string;
    // (undocumented)
    messageType: 'system';
}

// @internal (undocumented)
export type _TileOrientation = 'portrait' | 'landscape';

// @public
export interface TopicUpdatedSystemMessage extends SystemMessageCommon {
    // (undocumented)
    systemMessageType: 'topicUpdated';
    // (undocumented)
    topic: string;
}

// @public
export const TypingIndicator: (props: TypingIndicatorProps) => JSX.Element;

// @public
export interface TypingIndicatorProps {
    onRenderUser?: (users: CommunicationParticipant) => JSX.Element;
    strings?: Partial<TypingIndicatorStrings>;
    styles?: TypingIndicatorStylesProps;
    typingUsers: CommunicationParticipant[];
}

// @public
export interface TypingIndicatorStrings {
    delimiter: string;
    multipleUsers: string;
    multipleUsersAbbreviateMany: string;
    multipleUsersAbbreviateOne: string;
    singleUser: string;
}

// @public
export interface TypingIndicatorStylesProps extends BaseCustomStyles {
    typingString?: IStyle;
    typingUserDisplayName?: IStyle;
}

// @public
export const useTheme: () => Theme;

// @public
export const VideoGallery: (props: VideoGalleryProps) => JSX.Element;

// @public
export type VideoGalleryLocalParticipant = VideoGalleryParticipant;

// @public
export type VideoGalleryParticipant = {
    userId: string;
    isMuted?: boolean;
    displayName?: string;
    videoStream?: VideoGalleryStream;
    isScreenSharingOn?: boolean;
};

// @public
export interface VideoGalleryProps {
    dominantSpeakers?: string[];
    layout?: 'default' | 'floatingLocalVideo';
    localParticipant: VideoGalleryLocalParticipant;
    localVideoViewOptions?: VideoStreamOptions;
    maxRemoteVideoStreams?: number;
    onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void>;
    onCreateRemoteStreamView?: (userId: string, options?: VideoStreamOptions) => Promise<void>;
    onDisposeLocalStreamView?: () => void;
    onDisposeRemoteStreamView?: (userId: string) => Promise<void>;
    onRenderAvatar?: OnRenderAvatarCallback;
    onRenderLocalVideoTile?: (localParticipant: VideoGalleryLocalParticipant) => JSX.Element;
    onRenderRemoteVideoTile?: (remoteParticipant: VideoGalleryRemoteParticipant) => JSX.Element;
    remoteParticipants?: VideoGalleryRemoteParticipant[];
    remoteVideoViewOptions?: VideoStreamOptions;
    showMuteIndicator?: boolean;
    strings?: Partial<VideoGalleryStrings>;
    styles?: VideoGalleryStyles;
}

// @public
export interface VideoGalleryRemoteParticipant extends VideoGalleryParticipant {
    isSpeaking?: boolean;
    screenShareStream?: VideoGalleryStream;
}

// @public
export interface VideoGalleryStream {
    id?: number;
    isAvailable?: boolean;
    isMirrored?: boolean;
    renderElement?: HTMLElement;
}

// @public
export interface VideoGalleryStrings {
    localVideoLabel: string;
    screenIsBeingSharedMessage: string;
    screenShareLoadingMessage: string;
}

// @public
export interface VideoGalleryStyles extends BaseCustomStyles {
    gridLayout?: GridLayoutStyles;
    horizontalGallery?: HorizontalGalleryStyles;
    localVideo?: IStyle;
}

// @public
export interface VideoStreamOptions {
    isMirrored?: boolean;
    scalingMode?: 'Stretch' | 'Crop' | 'Fit';
}

// @public
export const VideoTile: (props: VideoTileProps) => JSX.Element;

// @public
export interface VideoTileProps {
    children?: React_2.ReactNode;
    displayName?: string;
    initialsName?: string;
    isMirrored?: boolean;
    isMuted?: boolean;
    isSpeaking?: boolean;
    noVideoAvailableAriaLabel?: string;
    onRenderPlaceholder?: OnRenderAvatarCallback;
    personaMaxSize?: number;
    personaMinSize?: number;
    renderElement?: JSX.Element | null;
    showLabel?: boolean;
    showMuteIndicator?: boolean;
    styles?: VideoTileStylesProps;
    userId?: string;
}

// @public
export interface VideoTileStylesProps extends BaseCustomStyles {
    displayNameContainer?: IStyle;
    overlayContainer?: IStyle;
    videoContainer?: IStyle;
}

// (No @packageDocumentation comment for this package)