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 { IDropdownOption } from '@fluentui/react';
import { IDropdownStyles } from '@fluentui/react';
import { IIconProps } from '@fluentui/react';
import { IMessageBarProps } from '@fluentui/react';
import { IModalProps } 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 { ITextFieldStyles } 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 { PropsWithChildren } from 'react';
import { default as React_2 } from 'react';
import * as React_3 from 'react';
import { RefObject } from 'react';
import { Theme } from '@fluentui/react';

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

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

// Warning: (ae-internal-missing-underscore) The name "AnnouncerProps" should be prefixed with an underscore because the declaration is marked as @internal
//
// @internal
export type AnnouncerProps = {
    announcementString?: string;
    ariaLive: 'off' | 'polite' | 'assertive' | undefined;
};

// @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: ParticipantState;
    isScreenSharing?: boolean;
    isMuted?: boolean;
    isSpeaking?: boolean;
};

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

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

// @public
export interface CameraButtonProps extends ControlBarButtonProps {
    cameras?: OptionsDevice[];
    enableDeviceSelectionMenu?: boolean;
    localVideoViewOptions?: VideoStreamOptions;
    onSelectCamera?: (device: OptionsDevice) => Promise<void>;
    onToggleCamera?: (options?: VideoStreamOptions) => Promise<void>;
    selectedCamera?: OptionsDevice;
    strings?: Partial<CameraButtonStrings>;
    styles?: Partial<CameraButtonStyles>;
}

// @public
export interface CameraButtonStrings {
    cameraActionTurnedOffAnnouncement?: string;
    cameraActionTurnedOnAnnouncement?: string;
    cameraButtonSplitRoleDescription?: string;
    cameraMenuTitle: string;
    cameraMenuTooltip: string;
    offLabel: string;
    offSplitButtonAriaLabel?: string;
    onLabel: string;
    onSplitButtonAriaLabel?: string;
    tooltipDisabledContent?: string;
    tooltipOffContent?: string;
    tooltipOnContent?: string;
    tooltipVideoLoadingContent?: string;
}

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

// @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)
    senderDisplayName?: string;
    // (undocumented)
    senderId?: string;
    // (undocumented)
    status?: MessageStatus;
}

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

// @internal
export const _ComplianceBanner: (props: _ComplianceBannerProps) => JSX.Element;

// @internal (undocumented)
export type _ComplianceBannerProps = {
    callTranscribeState?: boolean;
    callRecordState?: boolean;
    strings: _ComplianceBannerStrings;
};

// @internal
export interface _ComplianceBannerStrings {
    // (undocumented)
    close: string;
    // (undocumented)
    complianceBannerNowOnlyRecording: string;
    // (undocumented)
    complianceBannerNowOnlyTranscription: string;
    // (undocumented)
    complianceBannerRecordingAndTranscriptionSaved: string;
    // (undocumented)
    complianceBannerRecordingAndTranscriptionStarted: string;
    // (undocumented)
    complianceBannerRecordingAndTranscriptionStopped: string;
    // (undocumented)
    complianceBannerRecordingSaving: string;
    // (undocumented)
    complianceBannerRecordingStarted: string;
    // (undocumented)
    complianceBannerRecordingStopped: string;
    // (undocumented)
    complianceBannerTranscriptionConsent: string;
    // (undocumented)
    complianceBannerTranscriptionSaving: string;
    // (undocumented)
    complianceBannerTranscriptionStarted: string;
    // (undocumented)
    complianceBannerTranscriptionStopped: string;
    // (undocumented)
    learnMore: string;
    // (undocumented)
    privacyPolicy: 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 interface CreateVideoStreamViewResult {
    view: {
        updateScalingMode: (scalingMode: ViewScalingMode) => Promise<void>;
    };
}

// @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: {
    ChatMessageOptions: JSX.Element;
    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;
    ErrorBarCallMicrophoneUnmutedBySystem: JSX.Element;
    ErrorBarCallNetworkQualityLow: JSX.Element;
    ErrorBarCallNoMicrophoneFound: JSX.Element;
    ErrorBarCallNoSpeakerFound: JSX.Element;
    ErrorBarClear: JSX.Element;
    ErrorBarCallVideoRecoveredBySystem: JSX.Element;
    ErrorBarCallVideoStoppedBySystem: JSX.Element;
    HorizontalGalleryLeftButton: JSX.Element;
    HorizontalGalleryRightButton: JSX.Element;
    MessageDelivered: JSX.Element;
    MessageEdit: JSX.Element;
    MessageFailed: JSX.Element;
    MessageRemove: JSX.Element;
    MessageResend: 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;
};

// @internal
export const _DevicePermissionDropdown: (props: _DevicePermissionDropdownProps) => JSX.Element;

// @internal
export interface _DevicePermissionDropdownProps {
    askDevicePermission?(constrain: _PermissionConstraints): Promise<void>;
    constrain?: _PermissionConstraints;
    icon?: JSX.Element;
    onClick?: () => void;
    options?: IDropdownOption[];
    strings?: _DevicePermissionDropdownStrings;
    styles?: Partial<IDropdownStyles>;
}

// @internal
export interface _DevicePermissionDropdownStrings {
    actionButtonContent?: string;
    label?: string;
    placeHolderText: string;
}

// @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>;
}

// @beta
export const Dialpad: (props: DialpadProps) => JSX.Element;

// @beta
export interface DialpadProps {
    isMobile?: boolean;
    onChange?: (input: string) => void;
    onClickDialpadButton?: (buttonValue: string, buttonIndex: number) => void;
    onSendDtmfTone?: (dtmfTone: DtmfTone) => Promise<void>;
    showDeleteButton?: boolean;
    // (undocumented)
    strings?: DialpadStrings;
    // (undocumented)
    styles?: DialpadStyles;
    textFieldValue?: string;
}

// @beta
export interface DialpadStrings {
    // (undocumented)
    deleteButtonAriaLabel?: string;
    // (undocumented)
    placeholderText: string;
}

// @beta
export interface DialpadStyles {
    // (undocumented)
    button?: IButtonStyles;
    // (undocumented)
    deleteIcon?: IButtonStyles;
    // (undocumented)
    digit?: IStyle;
    // (undocumented)
    letter?: IStyle;
    // (undocumented)
    root?: IStyle;
    // (undocumented)
    textField?: Partial<ITextFieldStyles>;
}

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

// @internal
export interface _DrawerMenuItemProps {
    disabled?: boolean;
    iconProps?: IIconProps;
    id?: string;
    // (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;
}

// @beta
export type DtmfTone = 'A' | 'B' | 'C' | 'D' | 'Flash' | 'Num0' | 'Num1' | 'Num2' | 'Num3' | 'Num4' | 'Num5' | 'Num6' | 'Num7' | 'Num8' | 'Num9' | 'Pound' | 'Star';

// @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[];
    ignorePremountErrors?: boolean;
    strings?: ErrorBarStrings;
}

// @public
export interface ErrorBarStrings {
    accessDenied: string;
    callCameraAccessDenied: string;
    callCameraAlreadyInUse: string;
    callLocalVideoFreeze: string;
    callMacOsCameraAccessDenied: string;
    callMacOsMicrophoneAccessDenied: string;
    callMacOsScreenShareAccessDenied: string;
    callMicrophoneAccessDenied: string;
    callMicrophoneMutedBySystem: string;
    callMicrophoneUnmutedBySystem: string;
    callNetworkQualityLow: string;
    callNoMicrophoneFound: string;
    callNoSpeakerFound: string;
    callVideoRecoveredBySystem: string;
    callVideoStoppedBySystem: string;
    dismissButtonAriaLabel?: string;
    failedToJoinCallGeneric?: string;
    failedToJoinCallInvalidMeetingLink?: 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;

// @internal (undocumented)
export interface _ExtendedIModalProps extends IModalProps {
    // (undocumented)
    maxDragPosition?: _ICoordinates;
    // (undocumented)
    minDragPosition?: _ICoordinates;
}

// @internal
export const _FileCard: (props: _FileCardProps) => JSX.Element;

// @internal
export const _FileCardGroup: (props: _FileCardGroupProps) => JSX.Element;

// @internal
export interface _FileCardGroupProps {
    // (undocumented)
    children: React_2.ReactNode;
}

// @internal
export interface _FileCardProps {
    actionHandler?: () => void;
    actionIcon?: JSX.Element;
    fileExtension: string;
    fileName: string;
    progress?: number;
    strings?: _FileUploadCardsStrings;
}

// @internal (undocumented)
export interface _FileDownloadCards {
    downloadHandler?: FileDownloadHandler;
    fileMetadata: FileMetadata[];
    onDownloadErrorMessage?: (errMsg: string) => void;
    strings?: _FileDownloadCardsStrings;
    userId: string;
}

// @internal (undocumented)
export const _FileDownloadCards: (props: _FileDownloadCards) => JSX.Element;

// @internal
export interface _FileDownloadCardsStrings {
    downloadFile: string;
}

// @beta
export interface FileDownloadError {
    errorMessage: string;
}

// @beta
export type FileDownloadHandler = (userId: string, fileMetadata: FileMetadata) => Promise<URL | FileDownloadError>;

// @beta
export interface FileMetadata {
    extension: string;
    name: string;
    url: string;
}

// @internal
export interface _FileUploadCardsStrings {
    removeFile: string;
    uploadCompleted: string;
    uploading: string;
}

// @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;
}

// @internal
export const _HighContrastAwareIcon: (props: _HighContrastAwareIconProps) => JSX.Element;

// @internal (undocumented)
export interface _HighContrastAwareIconProps {
    disabled?: boolean | undefined;
    iconName: string;
}

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

// @internal (undocumented)
export type _ICoordinates = {
    x: number;
    y: number;
};

// @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 type LoadingState = 'loading' | 'none';

// @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;

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

// @internal
export const _LocalVideoTile: React_2.MemoExoticComponent<(props: {
    userId?: string | undefined;
    onCreateLocalStreamView?: ((options?: VideoStreamOptions | undefined) => Promise<void | CreateVideoStreamViewResult>) | undefined;
    onDisposeLocalStreamView?: (() => void) | undefined;
    isAvailable?: boolean | undefined;
    isMuted?: boolean | undefined;
    renderElement?: HTMLElement | undefined;
    displayName?: string | undefined;
    initialsName?: string | undefined;
    localVideoViewOptions?: VideoStreamOptions | undefined;
    onRenderAvatar?: OnRenderAvatarCallback | undefined;
    showLabel: boolean;
    showMuteIndicator?: boolean | undefined;
    showCameraSwitcherInLocalPreview?: boolean | undefined;
    localVideoCameraCycleButtonProps?: LocalVideoCameraCycleButtonProps | undefined;
    localVideoCameraSwitcherLabel?: string | undefined;
    localVideoSelectedDescription?: string | undefined;
    styles?: VideoTileStylesProps | undefined;
    personaMinSize?: number | undefined;
}) => JSX.Element>;

// @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?: UpdateMessageCallback;
    onDeleteMessage?: (messageId: string) => Promise<void>;
    onSendMessage?: (messageId: string) => Promise<void>;
};

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

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

// @public
export interface MessageStatusIndicatorProps {
    // (undocumented)
    onToggleToolTip?: (isToggled: boolean) => void;
    // (undocumented)
    readCount?: 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)[];
    participantCount?: number;
    readReceiptsBySenderId?: ReadReceiptsBySenderId;
    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;
    onUpdateMessage?: UpdateMessageCallback;
    onDeleteMessage?: (messageId: string) => Promise<void>;
    onSendMessage?: (messageId: string) => Promise<void>;
    disableEditing?: boolean;
    strings?: Partial<MessageThreadStrings>;
};

// @public
export interface MessageThreadStrings {
    actionMenuMoreOptions?: string;
    editBoxCancelButton: string;
    editBoxPlaceholderText: string;
    editBoxSubmitButton: string;
    editBoxTextLimit: string;
    editedTag: string;
    editMessage: string;
    failToSendTag?: string;
    friday: string;
    liveAuthorIntro: string;
    messageContentAriaText: string;
    messageContentMineAriaText: string;
    messageReadCount?: string;
    monday: string;
    newMessagesIndicator: string;
    noDisplayNameSub: string;
    participantJoined: string;
    participantLeft: string;
    removeMessage: string;
    resendMessage?: 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;
    failedMyChatMessageContainer?: 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 MicrophoneButtonContextualMenuStyles extends IContextualMenuStyles {
    menuItemStyles?: IContextualMenuItemStyles;
}

// @public
export interface MicrophoneButtonProps extends ControlBarButtonProps {
    enableDeviceSelectionMenu?: boolean;
    microphones?: OptionsDevice[];
    onSelectMicrophone?: (device: OptionsDevice) => Promise<void>;
    onSelectSpeaker?: (device: OptionsDevice) => Promise<void>;
    onToggleMicrophone?: () => Promise<void>;
    selectedMicrophone?: OptionsDevice;
    selectedSpeaker?: OptionsDevice;
    speakers?: OptionsDevice[];
    strings?: Partial<MicrophoneButtonStrings>;
    styles?: Partial<MicrophoneButtonStyles>;
}

// @public
export interface MicrophoneButtonStrings {
    microphoneActionTurnedOffAnnouncement?: string;
    microphoneActionTurnedOnAnnouncement?: string;
    microphoneButtonSplitRoleDescription?: string;
    microphoneMenuTitle?: string;
    microphoneMenuTooltip?: string;
    offLabel: string;
    offSplitButtonAriaLabel?: string;
    onLabel: string;
    onSplitButtonAriaLabel?: string;
    speakerMenuTitle?: string;
    speakerMenuTooltip?: string;
    tooltipDisabledContent?: string;
    tooltipOffContent?: string;
    tooltipOnContent?: string;
}

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

// @internal (undocumented)
export const _ModalClone: React_3.FunctionComponent<_ExtendedIModalProps>;

// @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[];
    onClick?: (props?: ParticipantItemProps) => void;
    onRenderAvatar?: OnRenderAvatarCallback;
    onRenderIcon?: (props?: ParticipantItemProps) => JSX.Element | null;
    presence?: PersonaPresence;
    showParticipantOverflowTooltip?: boolean;
    strings?: Partial<ParticipantItemStrings>;
    styles?: ParticipantItemStyles;
    userId?: string;
}

// @public
export interface ParticipantItemStrings {
    displayNamePlaceholder?: string;
    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;
    onParticipantClick?: (participant?: ParticipantListParticipant) => void;
    styles?: ParticipantListStyles;
    showParticipantOverflowTooltip?: boolean;
};

// @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[];
    showParticipantOverflowTooltip?: boolean;
    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>;
}

// @public
export type ParticipantState = 'Idle' | 'Connecting' | 'Ringing' | 'Connected' | 'Hold' | 'InLobby' | 'EarlyMedia' | 'Disconnected';

// @internal
export type _PermissionConstraints = {
    audio: boolean;
    video: boolean;
};

// @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 type _PictureInPictureInPictureTileProps = PropsWithChildren<{
    orientation: _TileOrientation;
}>;

// @public
export type ReadReceiptsBySenderId = {
    [key: string]: {
        lastReadMessage: string;
        displayName: string;
    };
};

// @internal
export const _RemoteVideoTile: React_2.MemoExoticComponent<(props: {
    userId: string;
    onCreateRemoteStreamView?: ((userId: string, options?: VideoStreamOptions | undefined) => Promise<void | CreateVideoStreamViewResult>) | undefined;
    onDisposeRemoteStreamView?: ((userId: string) => Promise<void>) | undefined;
    isAvailable?: boolean | undefined;
    isReceiving?: boolean | undefined;
    isMuted?: boolean | undefined;
    isSpeaking?: boolean | undefined;
    isScreenSharingOn?: boolean | undefined;
    renderElement?: HTMLElement | undefined;
    displayName?: string | undefined;
    remoteVideoViewOptions?: VideoStreamOptions | undefined;
    onRenderAvatar?: OnRenderAvatarCallback | undefined;
    showMuteIndicator?: boolean | undefined;
    showLabel?: boolean | undefined;
    personaMinSize?: number | undefined;
    participantState?: ParticipantState | undefined;
}) => JSX.Element>;

// @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;
    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;
    loadingState?: LoadingState;
    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;
}

// @internal
export const _TroubleshootingGuideErrorBar: (props: _TroubleshootingGuideErrorBarProps) => JSX.Element;

// @internal
export interface _TroubleshootingGuideErrorBarProps extends ErrorBarProps {
    onNetworkingTroubleshootingClick?: () => void;
    onPermissionsTroubleshootingClick?: (permissionsState: {
        camera: PermissionState;
        microphone: PermissionState;
    }) => void;
    permissionsState?: {
        camera: PermissionState;
        microphone: PermissionState;
    };
    troubleshootingGuideStrings: _TroubleshootingGuideErrorBarStrings;
}

// @internal
export interface _TroubleshootingGuideErrorBarStrings {
    // (undocumented)
    devicePermissionLinkText?: string;
    // (undocumented)
    dismissButtonText?: string;
    // (undocumented)
    networkTroubleshootingLinkText?: 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 type UpdateMessageCallback = (messageId: string, content: string) => Promise<void>;

// @internal
export const _useContainerHeight: (containerRef: RefObject<HTMLElement>) => number | undefined;

// @internal
export const _useContainerWidth: (containerRef: RefObject<HTMLElement>) => number | undefined;

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

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

// @public (undocumented)
export type VideoGalleryLayout = 'default' | 'floatingLocalVideo';

// @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?: VideoGalleryLayout;
    localParticipant: VideoGalleryLocalParticipant;
    localVideoCameraCycleButtonProps?: LocalVideoCameraCycleButtonProps;
    localVideoViewOptions?: VideoStreamOptions;
    maxRemoteVideoStreams?: number;
    onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;
    onCreateRemoteStreamView?: (userId: string, options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;
    onDisposeLocalStreamView?: () => void;
    onDisposeRemoteStreamView?: (userId: string) => Promise<void>;
    onRenderAvatar?: OnRenderAvatarCallback;
    onRenderLocalVideoTile?: (localParticipant: VideoGalleryLocalParticipant) => JSX.Element;
    onRenderRemoteVideoTile?: (remoteParticipant: VideoGalleryRemoteParticipant) => JSX.Element;
    remoteParticipants?: VideoGalleryRemoteParticipant[];
    remoteVideoViewOptions?: VideoStreamOptions;
    showCameraSwitcherInLocalPreview?: boolean;
    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;
    isReceiving?: boolean;
    renderElement?: HTMLElement;
}

// @public
export interface VideoGalleryStrings {
    displayNamePlaceholder: string;
    localVideoCameraSwitcherLabel: string;
    localVideoLabel: string;
    localVideoMovementLabel: string;
    localVideoSelectedDescription: string;
    screenIsBeingSharedMessage: string;
    screenShareLoadingMessage: string;
}

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

// @public
export interface VideoStreamOptions {
    isMirrored?: boolean;
    scalingMode?: ViewScalingMode;
}

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

// @beta
export type VideoTileMenuItems = Array<{
    key: string;
    ariaLabel?: string;
    text: string;
    onClick: () => void;
    iconProps: IIconProps;
}>;

// @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;
}

// @public
export type ViewScalingMode = 'Stretch' | 'Crop' | 'Fit';

// (No @packageDocumentation comment for this package)