@azure/communication-react 1.3.1-alpha-202205310013.0 → 1.3.1-alpha-202208032336

package/dist/communication-react.d.ts

@@ -43,6 +43,7 @@ import { CreateViewOptions } from '@azure/communication-calling';
 import { DeviceAccess } from '@azure/communication-calling';
 import { DeviceManager } from '@azure/communication-calling';
 import { DominantSpeakersInfo } from '@azure/communication-calling';
+import { DtmfTone as DtmfTone_2 } from '@azure/communication-calling';
 import { GroupCallLocator } from '@azure/communication-calling';
 import { IButtonProps } from '@fluentui/react';
 import { IButtonStyles } from '@fluentui/react';
@@ -50,11 +51,13 @@ import { IContextualMenuItem } from '@fluentui/react';
 import { IContextualMenuItemStyles } from '@fluentui/react';
 import { IContextualMenuStyles } from '@fluentui/react';
 import { IMessageBarProps } from '@fluentui/react';
+import { IncomingCall } from '@azure/communication-calling';
 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 { LatestMediaDiagnostics } from '@azure/communication-calling';
 import { LatestNetworkDiagnostics } from '@azure/communication-calling';
 import type { MediaDiagnosticChangedEventArgs } from '@azure/communication-calling';
@@ -68,9 +71,11 @@ import { PersonaPresence } from '@fluentui/react';
 import { PersonaSize } from '@fluentui/react';
 import { PhoneNumberIdentifier } from '@azure/communication-common';
 import { PhoneNumberKind } from '@azure/communication-common';
+import { PropertyChangedEvent } from '@azure/communication-calling';
 import { default as React_2 } from 'react';
 import type { RemoteParticipant } from '@azure/communication-calling';
 import { RemoteParticipantState as RemoteParticipantState_2 } from '@azure/communication-calling';
+import { RoomCallLocator } from '@azure/communication-calling';
 import { ScalingMode } from '@azure/communication-calling';
 import { SendMessageOptions } from '@azure/communication-chat';
 import { StartCallOptions } from '@azure/communication-calling';
@@ -250,6 +255,7 @@ export declare type AzureCommunicationCallAdapterArgs = {
     displayName: string;
     credential: CommunicationTokenCredential;
     locator: CallAdapterLocator;
+    alternateCallerId?: string;
 };
 
 /**
@@ -263,6 +269,7 @@ export declare type AzureCommunicationCallWithChatAdapterArgs = {
     displayName: string;
     credential: CommunicationTokenCredential;
     locator: CallAndChatLocator | TeamsMeetingLinkLocator;
+    alternateCallerId?: string;
 };
 
 /**
@@ -323,6 +330,10 @@ export declare interface BaseCompositeProps<TIcons extends Record<string, JSX.El
     /**
      * A callback function that can be used to provide custom data to Avatars rendered
      * in Composite.
+     *
+     * This will not affect the displayName shown in the composite.
+     * The displayName throughout the composite will be what is provided to the adapter when the adapter is created.
+     * will be what is provided to the adapter when the adapter is created.
      */
     onFetchAvatarPersonaData?: AvatarPersonaDataCallback;
     /**
@@ -407,7 +418,7 @@ export declare interface CallAdapterCallManagement {
      *
      * @public
      */
-    startCall(participants: string[]): Call | undefined;
+    startCall(participants: string[], options?: StartCallOptions): Call | undefined;
     /**
      * Start sharing the screen during a call.
      *
@@ -452,6 +463,24 @@ export declare interface CallAdapterCallManagement {
      * @public
      */
     disposeStreamView(remoteUserId?: string, options?: VideoStreamOptions): Promise<void>;
+    /**
+     * Holds the call.
+     *
+     * @beta
+     */
+    holdCall(): Promise<void>;
+    /**
+     * Resumes the call from a `LocalHold` state.
+     *
+     * @beta
+     */
+    resumeCall(): Promise<void>;
+    /**
+     * Add a participant to the call.
+     *
+     * @beta
+     */
+    addParticipant(participant: CommunicationIdentifier, options?: AddPhoneNumberOptions): Promise<void>;
 }
 
 /**
@@ -470,6 +499,10 @@ export declare type CallAdapterClientState = {
      * Latest error encountered for each operation performed via the adapter.
      */
     latestErrors: AdapterErrors;
+    /**
+     * Azure communications Phone number to make PSTN calls with.
+     */
+    alternateCallerId?: string;
 };
 
 /**
@@ -554,7 +587,7 @@ export declare interface CallAdapterDeviceManagement {
  *
  * @public
  */
-export declare type CallAdapterLocator = TeamsMeetingLinkLocator | GroupCallLocator | /* @conditional-compile-remove(teams-adhoc-call) */ CallParticipantsLocator;
+export declare type CallAdapterLocator = TeamsMeetingLinkLocator | GroupCallLocator | /* @conditional-compile-remove(rooms) */ RoomCallLocator | /* @conditional-compile-remove(teams-adhoc-call) */ /* @conditional-compile-remove(PSTN-calls) */ CallParticipantsLocator;
 
 /**
  * {@link CallAdapter} state.
@@ -615,6 +648,18 @@ export declare interface CallAdapterSubscribers {
      * This event fires whenever there is a change in user facing diagnostics about the ongoing call.
      */
     on(event: 'diagnosticChanged', listener: DiagnosticChangedEventListner): void;
+    /**
+     * Subscribe function for 'selectedMicrophoneChanged' event.
+     *
+     * This event fires whenever the user selects a new microphone device.
+     */
+    on(event: 'selectedMicrophoneChanged', listener: PropertyChangedEvent): void;
+    /**
+     * Subscribe function for 'selectedSpeakerChanged' event.
+     *
+     * This event fires whenever the user selects a new speaker device.
+     */
+    on(event: 'selectedSpeakerChanged', listener: PropertyChangedEvent): void;
     /**
      * Subscribe function for 'error' event.
      */
@@ -655,6 +700,14 @@ export declare interface CallAdapterSubscribers {
      * Unsubscribe function for 'diagnosticChanged' event.
      */
     off(event: 'diagnosticChanged', listener: DiagnosticChangedEventListner): void;
+    /**
+     * Unsubscribe function for 'selectedMicrophoneChanged' event.
+     */
+    off(event: 'selectedMicrophoneChanged', listener: PropertyChangedEvent): void;
+    /**
+     * Unsubscribe function for 'selectedSpeakerChanged' event.
+     */
+    off(event: 'selectedSpeakerChanged', listener: PropertyChangedEvent): void;
     /**
      * Unsubscribe function for 'error' event.
      */
@@ -799,6 +852,12 @@ export declare interface CallClientState {
      * See documentation of {@Link CallErrors} for details.
      */
     latestErrors: CallErrors;
+    /**
+     * A phone number in E.164 format that will be used to represent callers identity.
+     * For example, using the alternateCallerId to add a participant using PSTN, this number will
+     * be used as the caller id in the PSTN call.
+     */
+    alternateCallerId?: string;
 }
 
 /**
@@ -834,9 +893,11 @@ export declare type CallCompositeIcons = {
     ErrorBarCallMacOsMicrophoneAccessDenied?: JSX.Element;
     ErrorBarCallMicrophoneAccessDenied?: JSX.Element;
     ErrorBarCallMicrophoneMutedBySystem?: JSX.Element;
+    ErrorBarCallMicrophoneUnmutedBySystem?: JSX.Element;
     ErrorBarCallNetworkQualityLow?: JSX.Element;
     ErrorBarCallNoMicrophoneFound?: JSX.Element;
     ErrorBarCallNoSpeakerFound?: JSX.Element;
+    ErrorBarClear?: JSX.Element;
     HorizontalGalleryLeftButton?: JSX.Element;
     HorizontalGalleryRightButton?: JSX.Element;
     LobbyScreenConnectingToCall?: JSX.Element;
@@ -915,6 +976,10 @@ export declare interface CallCompositeProps extends BaseCompositeProps<CallCompo
      * Flags to enable/disable or customize UI elements of the {@link CallComposite}.
      */
     options?: CallCompositeOptions;
+    /**
+     * Set this to enable/disable capacities for different roles
+     */
+    role?: Role;
 }
 
 /**
@@ -1089,6 +1154,42 @@ export declare interface CallCompositeStrings {
      * Tooltip text used to inform a user that toggling microphone in lobby is not supported.
      */
     microphoneToggleInLobbyNotAllowed: string;
+    /**
+     * Side pane People section Title.
+     */
+    peoplePaneTitle: string;
+    /**
+     * Aria label string for return to call back button
+     */
+    returnToCallButtonAriaLabel?: string;
+    /**
+     * Aria Description string for return to call button
+     */
+    returnToCallButtonAriaDescription?: string;
+    /**
+     * control bar People button label
+     */
+    peopleButtonLabel: string;
+    /**
+     * control bar Chat button label.
+     */
+    chatButtonLabel: string;
+    /**
+     * Label for SidePaneHeader dismiss button
+     */
+    dismissSidePaneButtonLabel?: string;
+    /**
+     * Side pane People section subheader.
+     */
+    peoplePaneSubTitle: string;
+    /**
+     * Label for button to copy invite link
+     */
+    copyInviteLinkButtonLabel: string;
+    /**
+     * Label for menu item to remove participant
+     */
+    removeMenuLabel: string;
 }
 
 /**
@@ -1217,7 +1318,7 @@ export declare type CallErrors = {
  *
  * @public
  */
-export declare type CallErrorTarget = 'Call.addParticipant' | 'Call.feature' | 'Call.hangUp' | 'Call.hold' | 'Call.mute' | 'Call.off' | 'Call.on' | 'Call.removeParticipant' | 'Call.resume' | 'Call.sendDtmf' | 'Call.startScreenSharing' | 'Call.startVideo' | 'Call.stopScreenSharing' | 'Call.stopVideo' | 'Call.unmute' | 'CallAgent.dispose' | 'CallAgent.feature' | 'CallAgent.join' | 'CallAgent.off' | 'CallAgent.on' | 'CallAgent.startCall' | 'CallClient.createCallAgent' | 'CallClient.feature' | 'CallClient.getDeviceManager' | 'DeviceManager.askDevicePermission' | 'DeviceManager.getCameras' | 'DeviceManager.getMicrophones' | 'DeviceManager.getSpeakers' | 'DeviceManager.off' | 'DeviceManager.on' | 'DeviceManager.selectMicrophone' | 'DeviceManager.selectSpeaker';
+export declare type CallErrorTarget = 'Call.addParticipant' | 'Call.feature' | 'Call.hangUp' | 'Call.hold' | 'Call.mute' | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.muteIncomingAudio' | 'Call.off' | 'Call.on' | 'Call.removeParticipant' | 'Call.resume' | 'Call.sendDtmf' | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.startAudio' | 'Call.startScreenSharing' | 'Call.startVideo' | 'Call.stopScreenSharing' | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.stopAudio' | 'Call.stopVideo' | 'Call.unmute' | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.unmuteIncomingAudio' | 'CallAgent.dispose' | 'CallAgent.feature' | 'CallAgent.join' | 'CallAgent.off' | 'CallAgent.on' | 'CallAgent.startCall' | 'CallClient.createCallAgent' | 'CallClient.feature' | 'CallClient.getDeviceManager' | /* @conditional-compile-remove(calling-beta-sdk) */ 'CallClient.getEnvironmentInfo' | 'DeviceManager.askDevicePermission' | 'DeviceManager.getCameras' | 'DeviceManager.getMicrophones' | 'DeviceManager.getSpeakers' | 'DeviceManager.off' | 'DeviceManager.on' | 'DeviceManager.selectMicrophone' | 'DeviceManager.selectSpeaker' | 'IncomingCall.accept' | 'IncomingCall.reject';
 
 /**
  * Callback for {@link CallAdapterSubscribers} 'callIdChanged' event.
@@ -1264,6 +1365,7 @@ export declare type CallingHandlers = {
     onRemoveParticipant: (userId: string) => Promise<void>;
     onDisposeRemoteStreamView: (userId: string) => Promise<void>;
     onDisposeLocalStreamView: () => Promise<void>;
+    onSendDtmfTone?: (dtmfTone: DtmfTone_2) => Promise<void>;
 };
 
 /**
@@ -1508,7 +1610,7 @@ export declare interface CallWithChatAdapterManagement {
      *
      * @public
      */
-    startCall(participants: string[]): Call | undefined;
+    startCall(participants: string[], options?: StartCallOptions): Call | undefined;
     /**
      * Start sharing the screen during a call.
      *
@@ -1675,6 +1777,24 @@ export declare interface CallWithChatAdapterManagement {
     updateFileUploadErrorMessage: (id: string, errorMessage: string) => void;
     /** @beta */
     updateFileUploadMetadata: (id: string, metadata: FileMetadata) => void;
+    /**
+     * Puts the Call in a Localhold.
+     *
+     * @beta
+     */
+    holdCall: () => Promise<void>;
+    /**
+     * Resumes the call from a LocalHold state.
+     *
+     * @beta
+     */
+    resumeCall: () => Promise<void>;
+    /**
+     * Adds a new Participant to the call.
+     *
+     * @beta
+     */
+    addParticipant: (participant: CommunicationIdentifier, options?: AddPhoneNumberOptions) => Promise<void>;
 }
 
 /**
@@ -1699,6 +1819,8 @@ export declare interface CallWithChatAdapterSubscriptions {
     on(event: 'isSpeakingChanged', listener: IsSpeakingChangedListener): void;
     on(event: 'callParticipantsJoined', listener: ParticipantsJoinedListener): void;
     on(event: 'callParticipantsLeft', listener: ParticipantsLeftListener): void;
+    on(event: 'selectedMicrophoneChanged', listener: PropertyChangedEvent): void;
+    on(event: 'selectedSpeakerChanged', listener: PropertyChangedEvent): void;
     on(event: 'callError', listener: (e: AdapterError) => void): void;
     off(event: 'callEnded', listener: CallEndedListener): void;
     off(event: 'isMutedChanged', listener: IsMutedChangedListener): void;
@@ -1708,6 +1830,8 @@ export declare interface CallWithChatAdapterSubscriptions {
     off(event: 'isSpeakingChanged', listener: IsSpeakingChangedListener): void;
     off(event: 'callParticipantsJoined', listener: ParticipantsJoinedListener): void;
     off(event: 'callParticipantsLeft', listener: ParticipantsLeftListener): void;
+    off(event: 'selectedMicrophoneChanged', listener: PropertyChangedEvent): void;
+    off(event: 'selectedSpeakerChanged', listener: PropertyChangedEvent): void;
     off(event: 'callError', listener: (e: AdapterError) => void): void;
     on(event: 'messageReceived', listener: MessageReceivedListener): void;
     on(event: 'messageSent', listener: MessageSentListener): void;
@@ -1813,9 +1937,11 @@ export declare type CallWithChatCompositeIcons = {
     ErrorBarCallMacOsMicrophoneAccessDenied?: JSX.Element;
     ErrorBarCallMicrophoneAccessDenied?: JSX.Element;
     ErrorBarCallMicrophoneMutedBySystem?: JSX.Element;
+    ErrorBarCallMicrophoneUnmutedBySystem?: JSX.Element;
     ErrorBarCallNetworkQualityLow?: JSX.Element;
     ErrorBarCallNoMicrophoneFound?: JSX.Element;
     ErrorBarCallNoSpeakerFound?: JSX.Element;
+    ErrorBarClear?: JSX.Element;
     HorizontalGalleryLeftButton?: JSX.Element;
     HorizontalGalleryRightButton?: JSX.Element;
     LobbyScreenConnectingToCall?: JSX.Element;
@@ -1941,7 +2067,7 @@ export declare interface CallWithChatCompositeStrings {
      *
      * Only used with `mobileView` set to `true` and when no speakers are available.
      */
-    moreDrawerAudioDeviceMenuTitle: string;
+    moreDrawerAudioDeviceMenuTitle?: string;
     /**
      * Title for the microphone selection sub-menu in more button drawer.
      *
@@ -1997,15 +2123,15 @@ export declare interface CallWithChatCompositeStrings {
     /**
      * Label for SidePaneHeader dismiss button
      */
-    dismissSidePaneButton: string;
+    dismissSidePaneButtonLabel?: string;
     /**
      * Aria Description string for return to call button
      */
-    returnToCallButtonAriaDescription: string;
+    returnToCallButtonAriaDescription?: string;
     /**
      * Aria label string for return to call back button
      */
-    returnToCallButtonAriaLabel: string;
+    returnToCallButtonAriaLabel?: string;
 }
 
 /**
@@ -2056,6 +2182,12 @@ export declare interface CallWithChatControlOptions {
      * @defaultValue true
      */
     peopleButton?: boolean;
+    /**
+     * Inject custom buttons in the call controls.
+     *
+     * @beta
+     */
+    onFetchCustomButtonProps?: CustomCallWithChatControlButtonCallback[];
 }
 
 /**
@@ -2063,7 +2195,7 @@ export declare interface CallWithChatControlOptions {
  *
  * @public
  */
-export declare type CallWithChatEvent = 'callError' | 'chatError' | 'callEnded' | 'isMutedChanged' | 'callIdChanged' | 'isLocalScreenSharingActiveChanged' | 'displayNameChanged' | 'isSpeakingChanged' | 'callParticipantsJoined' | 'callParticipantsLeft' | 'messageReceived' | 'messageSent' | 'messageRead' | 'chatParticipantsAdded' | 'chatParticipantsRemoved';
+export declare type CallWithChatEvent = 'callError' | 'chatError' | 'callEnded' | 'isMutedChanged' | 'callIdChanged' | 'isLocalScreenSharingActiveChanged' | 'displayNameChanged' | 'isSpeakingChanged' | 'callParticipantsJoined' | 'callParticipantsLeft' | 'selectedMicrophoneChanged' | 'selectedSpeakerChanged' | 'messageReceived' | 'messageSent' | 'messageRead' | 'chatParticipantsAdded' | 'chatParticipantsRemoved';
 
 /**
  * A button to turn camera on / off.
@@ -2182,11 +2314,11 @@ export declare interface CameraButtonStrings {
     /**
      * Camera action turned on string for announcer
      */
-    cameraActionTurnedOnAnnouncement: string;
+    cameraActionTurnedOnAnnouncement?: string;
     /**
      * Camera action turned off string for announcer
      */
-    cameraActionTurnedOffAnnouncement: string;
+    cameraActionTurnedOffAnnouncement?: string;
 }
 
 /**
@@ -2532,6 +2664,10 @@ export declare interface ChatCompositeStrings {
      * Chat list header text
      */
     chatListHeader: string;
+    /**
+     * Upload File Button text
+     */
+    uploadFile: string;
 }
 
 /**
@@ -2937,6 +3073,8 @@ export declare interface ComponentStrings {
     errorBar: ErrorBarStrings;
     /** Strings for VideoGallery */
     videoGallery: VideoGalleryStrings;
+    /** Strings for Dialpad */
+    dialpad: DialpadStrings;
 }
 
 /**
@@ -3244,7 +3382,7 @@ export declare interface ControlBarProps {
  *
  * @public
  */
-export declare const createAzureCommunicationCallAdapter: ({ userId, displayName, credential, locator }: AzureCommunicationCallAdapterArgs) => Promise<CallAdapter>;
+export declare const createAzureCommunicationCallAdapter: ({ userId, displayName, credential, locator, alternateCallerId }: AzureCommunicationCallAdapterArgs) => Promise<CallAdapter>;
 
 /**
  * Create a {@link CallAdapter} using the provided {@link StatefulCallClient}.
@@ -3262,7 +3400,7 @@ export declare const createAzureCommunicationCallAdapterFromClient: (callClient:
  *
  * @public
  */
-export declare const createAzureCommunicationCallWithChatAdapter: ({ userId, displayName, credential, endpoint, locator }: AzureCommunicationCallWithChatAdapterArgs) => Promise<CallWithChatAdapter>;
+export declare const createAzureCommunicationCallWithChatAdapter: ({ userId, displayName, credential, endpoint, locator, alternateCallerId }: AzureCommunicationCallWithChatAdapterArgs) => Promise<CallWithChatAdapter>;
 
 /**
  * Create a {@link CallWithChatAdapter} using the provided {@link StatefulChatClient} and {@link StatefulCallClient}.
@@ -3420,33 +3558,106 @@ export declare interface CustomCallControlButtonCallbackArgs {
 /**
  * Placement for a custom button injected in the {@link CallControls}.
  *
- * 'first': Place the button on the left end (right end in rtl mode).
- * 'afterCameraButton': Place the button on the right (left in rtl mode) of the camera button.
- * ... and so on.
+ * 'primary': Place the button(s) on the right end of the center control bar but before the EndCallButton (left end in rtl mode).
  *
- * It is an error to place the button in reference to another button that has
- * been hidden via a {@link CallControlOptions} field.
- *
- * Multiple buttons placed in the same position are appended in order.
- * E.g., if two buttons are placed 'first', they'll both appear on the left end (right end in rtl mode)
- * in the order provided.
+ * Multiple buttons assigned the same placement are appended in order.
+ * E.g., if two buttons are placed in 'primary', they'll both appear on the right end (left end in rtl mode)
+ * before the EndCallButton in the order provided.
  *
  * @beta
  */
-export declare type CustomCallControlButtonPlacement = 'first' | 'last' | 'afterCameraButton' | 'afterEndCallButton' | 'afterMicrophoneButton' | 'afterDevicesButton' | 'afterParticipantsButton' | 'afterScreenShareButton';
+export declare type CustomCallControlButtonPlacement = 'primary';
 
 /**
  * Response from {@link CustomCallControlButtonCallback}.
  *
- * Includes the props necessary to render a {@link  ControlBarButton} and indication of where to place the button.
+ * Includes the placement prop necessary to indicate where to place the
+ * {@link ControlBarButton} and a {@link DrawerMenuItem}
  *
  * @beta
  */
-export declare interface CustomCallControlButtonProps extends ControlBarButtonProps {
+export declare interface CustomCallControlButtonProps extends CustomControlButtonProps {
     /**
      * Where to place the custom button relative to other buttons.
      */
     placement: CustomCallControlButtonPlacement;
+    /**
+     * Icon to render. Icon is a non-default icon name that needs to be registered as a
+     * custom icon using registerIcons through fluentui. Examples include icons from the fluentui library
+     */
+    iconName?: string;
+}
+
+/**
+ * A callback that returns the props to render a custom {@link ControlBarButton} and {@link DrawerMenuItem}.
+ *
+ * The response indicates where the custom button should be placed.
+ *
+ * Performance tip: This callback is only called when either the callback or its arguments change.
+ * @beta
+ */
+export declare type CustomCallWithChatControlButtonCallback = (args: CustomCallControlButtonCallbackArgs) => CustomCallWithChatControlButtonProps;
+
+/**
+ * Placement for a custom button injected in the {@link CallWithChatControlBar}.
+ *
+ * 'primary': Place the button(s) on the right end of the center control bar but before the EndCallButton (left end in rtl mode).
+ * 'overflow': Place the buttons(s) on the end of the overflow Menu.
+ * 'secondary': Place the button(s) on the left end of the side control bar (right in rtl mode).
+ *
+ * Multiple buttons assigned the same placement are appended in order.
+ * E.g., if two buttons are placed in 'secondary', they'll both appear on the left end (right end in rtl mode)
+ * in the order provided.
+ *
+ * @beta
+ */
+export declare type CustomCallWithChatControlButtonPlacement = 'primary' | 'overflow' | 'secondary';
+
+/**
+ * Response from {@link CustomCallWithChatControlButtonCallback}.
+ *
+ * Includes the icon and placement prop necessary to indicate where to place the
+ * {@link ControlBarButton} and a {@link DrawerMenuItem}
+ *
+ * @beta
+ */
+export declare interface CustomCallWithChatControlButtonProps extends CustomControlButtonProps {
+    /**
+     * Where to place the custom button relative to other buttons.
+     */
+    placement: CustomCallWithChatControlButtonPlacement;
+    /**
+     * Icon to render. Icon is a non-default icon name that needs to be registered as a
+     * custom icon using registerIcons through fluentui. Examples include icons from the fluentui library
+     */
+    iconName?: string;
+}
+
+/**
+ * Includes the base props necessary to render a {@link ControlBarButton} or {@link DrawerMenuItem}.
+ *
+ * @beta
+ */
+export declare interface CustomControlButtonProps {
+    onItemClick?: () => void;
+    /**
+     * Whether the buttons is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether the label is displayed or not.
+     *
+     * @defaultValue `false`
+     */
+    showLabel?: boolean;
+    /**
+     * Fluent styles, common to all {@link ControlBarButton}s or {@link DrawerMenuItem}s.
+     */
+    styles?: ControlBarButtonStyles | BaseCustomStyles;
+    /**
+     * Optional label for the button
+     */
+    text?: string;
 }
 
 /**
@@ -3468,6 +3679,28 @@ export declare interface CustomMessage extends MessageCommon {
  */
 export declare const darkTheme: PartialTheme & CallingTheme;
 
+/**
+ * @public
+ * `DeclarativeCallAgent` extends and proxies the {@link @azure/communication-calling#CallAgent}
+ */
+export declare type DeclarativeCallAgent = CallAgent & /* @conditional-compile-remove(one-to-n-calling) */ {
+    /**
+     * @beta
+     * A readonly array that returns all the active `incomingCalls`.
+     * An active incoming call is a call that has not been answered, declined or disconnected.
+     *
+     * @Remark This attribute doesn't exist on the {@link @azure/communication-calling#CallAgent} interface.
+     * @returns readonly array of {@link DeclarativeIncomingCall}
+     */
+    incomingCalls: ReadonlyArray<DeclarativeIncomingCall>;
+};
+
+/**
+ * @beta
+ * Proxies the {@link @azure/communication-calling#IncomingCall} interface.
+ */
+export declare type DeclarativeIncomingCall = IncomingCall;
+
 /**
  * The default set of icons that are available to use in the UI components.
  *
@@ -3497,9 +3730,13 @@ export declare const DEFAULT_COMPONENT_ICONS: {
     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;
@@ -3516,9 +3753,12 @@ export declare const DEFAULT_COMPONENT_ICONS: {
     ParticipantItemOptions: JSX.Element;
     ParticipantItemOptionsHovered: JSX.Element;
     ParticipantItemScreenShareStart: JSX.Element;
+    HoldCall: JSX.Element;
+    ResumeCall: JSX.Element;
     SendBoxSend: JSX.Element;
     SendBoxSendHovered: JSX.Element;
     VideoTileMicOff: JSX.Element;
+    BackSpace: JSX.Element;
 };
 
 /**
@@ -3556,9 +3796,11 @@ export declare const DEFAULT_COMPOSITE_ICONS: {
     ErrorBarCallMacOsMicrophoneAccessDenied: JSX.Element;
     ErrorBarCallMicrophoneAccessDenied: JSX.Element;
     ErrorBarCallMicrophoneMutedBySystem: JSX.Element;
+    ErrorBarCallMicrophoneUnmutedBySystem: JSX.Element;
     ErrorBarCallNetworkQualityLow: JSX.Element;
     ErrorBarCallNoMicrophoneFound: JSX.Element;
     ErrorBarCallNoSpeakerFound: JSX.Element;
+    ErrorBarClear: JSX.Element;
     HorizontalGalleryLeftButton: JSX.Element;
     HorizontalGalleryRightButton: JSX.Element;
     LobbyScreenConnectingToCall?: JSX.Element | undefined;
@@ -3593,7 +3835,12 @@ export declare const DEFAULT_COMPOSITE_ICONS: {
     ChatMessageOptions: JSX.Element;
     CancelFileUpload: JSX.Element;
     DownloadFile: JSX.Element;
+    ErrorBarCallVideoRecoveredBySystem: JSX.Element;
+    ErrorBarCallVideoStoppedBySystem: JSX.Element;
     MessageResend: JSX.Element;
+    HoldCall: JSX.Element;
+    ResumeCall: JSX.Element;
+    BackSpace: JSX.Element;
 };
 
 /**
@@ -3814,6 +4061,66 @@ export declare interface DiagnosticsCallFeatureState {
     media: MediaDiagnosticsState;
 }
 
+/**
+ * A component to allow users to enter phone number through clicking on dialpad/using keyboard
+ * It will return empty component for stable builds
+ *
+ * @beta
+ */
+export declare const Dialpad: (props: DialpadProps) => JSX.Element;
+
+/**
+ * Type for  {@link DialpadButton} input
+ *
+ * @beta
+ */
+export declare interface DialpadButtonProps {
+    primaryContent: string;
+    secondaryContent?: string;
+}
+
+/**
+ * Props for {@link Dialpad} component.
+ *
+ * @beta
+ */
+export declare interface DialpadProps {
+    strings?: DialpadStrings;
+    /**  function to send dtmf tones on button click */
+    onSendDtmfTone?: (dtmfTone: DtmfTone) => Promise<void>;
+    /**  Callback for dialpad button behavior*/
+    onClickDialpadButton?: (buttonValue: string, buttonIndex: number) => void;
+    /**  customize dialpad input formatting */
+    onDisplayDialpadInput?: (input: string) => string;
+    /**  on change function for text field */
+    onChange?: (input: string) => void;
+    styles?: DialpadStyles;
+}
+
+/**
+ * Strings of {@link Dialpad} that can be overridden.
+ *
+ * @beta
+ */
+export declare interface DialpadStrings {
+    placeholderText: string;
+    deleteButtonAriaLabel: string;
+}
+
+/**
+ * Styles for {@link Dialpad} component.
+ *
+ * @beta
+ */
+export declare interface DialpadStyles {
+    root?: IStyle;
+    button?: IButtonStyles;
+    textField?: Partial<ITextFieldStyles>;
+    primaryContent?: IStyle;
+    secondaryContent?: IStyle;
+    deleteIcon?: IButtonStyles;
+}
+
 /**
  * Callback for {@link CallAdapterSubscribers} 'displayNameChanged' event.
  *
@@ -3834,6 +4141,13 @@ export declare interface Disposable {
     dispose(): void;
 }
 
+/**
+ * DTMF tone for PSTN calls.
+ *
+ * @beta
+ */
+export declare type DtmfTone = 'A' | 'B' | 'C' | 'D' | 'Flash' | 'Num0' | 'Num1' | 'Num2' | 'Num3' | 'Num4' | 'Num5' | 'Num6' | 'Num7' | 'Num8' | 'Num9' | 'Pound' | 'Star';
+
 /**
  * A type for trivial selectors that return no data.
  *
@@ -3996,6 +4310,11 @@ export declare interface ErrorBarStrings {
      * Message shown when microphone is muted by the system (not by local or remote participants)
      */
     callMicrophoneMutedBySystem: string;
+    /**
+     * Message shown when microphone is unmuted by the system (not by local or remote participants).
+     * This typically occurs if the system recovers from an unexpected mute.
+     */
+    callMicrophoneUnmutedBySystem: string;
     /**
      * Mac OS specific message shown when microphone can be enumerated but access is
      * blocked by the system.
@@ -4014,6 +4333,14 @@ export declare interface ErrorBarStrings {
      * another applciation.
      */
     callCameraAlreadyInUse: string;
+    /**
+     * Message shown when local video is stopped by the system (not by local or remote participants)
+     */
+    callVideoStoppedBySystem: string;
+    /**
+     * Message shown when local video was recovered by the system (not by the local participant)
+     */
+    callVideoRecoveredBySystem: string;
     /**
      * Mac OS specific message shown when system denies access to camera.
      */
@@ -4025,15 +4352,15 @@ export declare interface ErrorBarStrings {
     /**
      * Dimiss errorbar button aria label read by screen reader accessibility tools
      */
-    dismissButtonAriaLabel: string;
+    dismissButtonAriaLabel?: string;
     /**
      * An error message when joining a call fails.
      */
-    failedToJoinCallGeneric: string;
+    failedToJoinCallGeneric?: string;
     /**
      * An error message when joining a call fails specifically due to an invalid meeting link.
      */
-    failedToJoinCallInvalidMeetingLink: string;
+    failedToJoinCallInvalidMeetingLink?: string;
 }
 
 /**
@@ -4276,7 +4603,7 @@ export declare const fromFlatCommunicationIdentifier: (id: string) => Communicat
  *
  * @public
  */
-export declare type GetCallingSelector<Component extends (props: any) => JSX.Element | undefined> = AreEqual<Component, typeof VideoGallery> extends true ? VideoGallerySelector : AreEqual<Component, typeof DevicesButton> extends true ? DevicesButtonSelector : AreEqual<Component, typeof MicrophoneButton> extends true ? MicrophoneButtonSelector : AreEqual<Component, typeof CameraButton> extends true ? CameraButtonSelector : AreEqual<Component, typeof ScreenShareButton> extends true ? ScreenShareButtonSelector : AreEqual<Component, typeof ParticipantList> extends true ? ParticipantListSelector : AreEqual<Component, typeof ParticipantsButton> extends true ? ParticipantsButtonSelector : AreEqual<Component, typeof EndCallButton> extends true ? EmptySelector : AreEqual<Component, typeof ErrorBar> extends true ? CallErrorBarSelector : undefined;
+export declare type GetCallingSelector<Component extends (props: any) => JSX.Element | undefined> = AreEqual<Component, typeof VideoGallery> extends true ? VideoGallerySelector : AreEqual<Component, typeof DevicesButton> extends true ? DevicesButtonSelector : AreEqual<Component, typeof MicrophoneButton> extends true ? MicrophoneButtonSelector : AreEqual<Component, typeof CameraButton> extends true ? CameraButtonSelector : AreEqual<Component, typeof ScreenShareButton> extends true ? ScreenShareButtonSelector : AreEqual<Component, typeof ParticipantList> extends true ? ParticipantListSelector : AreEqual<Component, typeof ParticipantsButton> extends true ? ParticipantsButtonSelector : AreEqual<Component, typeof EndCallButton> extends true ? EmptySelector : AreEqual<Component, typeof ErrorBar> extends true ? CallErrorBarSelector : AreEqual<Component, typeof Dialpad> extends true ? EmptySelector : AreEqual<Component, typeof HoldButton> extends true ? HoldButtonSelector : undefined;
 
 /**
  * Get the selector for a specified component.
@@ -4338,6 +4665,63 @@ export declare interface GridLayoutStyles extends BaseCustomStyles {
     children?: IStyle;
 }
 
+/**
+ * a button to hold or resume a ongoing call.
+ *
+ * Can be used with {@link ControlBar}
+ *
+ * @param props - properties for the hold button.
+ * @returns
+ * @beta
+ */
+export declare const HoldButton: (props: HoldButtonProps) => JSX.Element;
+
+/**
+ *@beta
+ */
+export declare interface HoldButtonProps extends ControlBarButtonProps {
+    /**
+     * Utility property for using this component with communication react handlers
+     * Holds the call or resumes it based on call state.
+     */
+    onToggleHold: () => Promise<void>;
+    /**
+     * Optional strings to override in component
+     */
+    strings?: HoldButtonStrings;
+}
+
+/**
+ * Selector type for the {@link HoldButton} component.
+ * @public
+ */
+export declare type HoldButtonSelector = (state: CallClientState, props: CallingBaseSelectorProps) => {
+    checked: boolean;
+};
+
+/**
+ * Strings for the hold button labels
+ * @beta
+ */
+export declare interface HoldButtonStrings {
+    /**
+     * Label for when action is to resume call.
+     */
+    onLabel: string;
+    /**
+     * Label for when action is to hold call.
+     */
+    offLabel: string;
+    /**
+     * Content for when button is checked
+     */
+    tooltipOnContent: string;
+    /**
+     * Content for when button is unchecked
+     */
+    toolTipOffContent: string;
+}
+
 /**
  * {@link HorizontalGallery} Component Styles.
  * @public
@@ -4498,6 +4882,12 @@ export declare interface JumpToNewMessageButtonProps {
  */
 export declare const lightTheme: PartialTheme & CallingTheme;
 
+/**
+ * Whether the stream is loading or not.
+ * @public
+ */
+export declare type LoadingState = 'loading' | 'none';
+
 /**
  * Provider to provide localized strings for this library's react components.
  *
@@ -4981,6 +5371,8 @@ export declare interface MessageThreadStrings {
     failToSendTag?: string;
     /** String for LiveMessage introduction for the Chat Message */
     liveAuthorIntro: string;
+    /** String for aria text of message content */
+    messageContentAriaText: string;
     /** String for warning on text limit exceeded in EditBox*/
     editBoxTextLimit: string;
     /** String for placeholder text in EditBox when there is no user input*/
@@ -4996,7 +5388,9 @@ export declare interface MessageThreadStrings {
     /** String for Submit in EditBox when there is no user input*/
     editBoxSubmitButton: string;
     /** String for action menu indicating there are more options */
-    actionMenuMoreOptions: string;
+    actionMenuMoreOptions?: string;
+    /** String for download file button in file card */
+    downloadFile: string;
 }
 
 /**
@@ -5146,7 +5540,7 @@ export declare interface MicrophoneButtonStrings {
     /**
      * Description of microphone button split button role
      */
-    microphoneButtonSplitRoleDescription: string;
+    microphoneButtonSplitRoleDescription?: string;
     /**
      * Microphone split button aria label when mic is enabled.
      */
@@ -5158,11 +5552,11 @@ export declare interface MicrophoneButtonStrings {
     /**
      * Microphone action turned on string for announcer
      */
-    microphoneActionTurnedOnAnnouncement: string;
+    microphoneActionTurnedOnAnnouncement?: string;
     /**
      * Microphone action turned off string for announcer
      */
-    microphoneActionTurnedOffAnnouncement: string;
+    microphoneActionTurnedOffAnnouncement?: string;
 }
 
 /**
@@ -5255,7 +5649,7 @@ export declare interface ParticipantItemProps {
     /** Unique User ID of the participant. This `userId` is available in the `onRenderAvatar` callback function */
     userId?: string;
     /** Name of participant. */
-    displayName: string;
+    displayName?: string;
     /** Optional indicator to show participant is the user. */
     me?: boolean;
     /** Optional callback returning a JSX element to override avatar. */
@@ -5282,6 +5676,8 @@ export declare interface ParticipantItemProps {
      * Optional callback when component is clicked
      */
     onClick?: (props?: ParticipantItemProps) => void;
+    /** prop to determine if we should show tooltip for participants or not */
+    showParticipantOverflowTooltip?: boolean;
 }
 
 /**
@@ -5300,6 +5696,8 @@ export declare interface ParticipantItemStrings {
     sharingIconLabel: string;
     /** Label for the muted icon in participant state stack  */
     mutedIconLabel: string;
+    /** placeholder text for participants who does not have a display name*/
+    displayNamePlaceholder?: string;
 }
 
 /**
@@ -5377,6 +5775,8 @@ export declare type ParticipantListProps = {
     onParticipantClick?: (participant?: ParticipantListParticipant) => void;
     /** Styles for the {@link ParticipantList} */
     styles?: ParticipantListStyles;
+    /** prop to determine if we should show tooltip for participants or not */
+    showParticipantOverflowTooltip?: boolean;
 };
 
 /**
@@ -5511,6 +5911,8 @@ export declare interface ParticipantsButtonProps extends ControlBarButtonProps {
      * Optional strings to override in component
      */
     strings?: Partial<ParticipantsButtonStrings>;
+    /** prop to determine if we should show tooltip for participants or not */
+    showParticipantOverflowTooltip?: boolean;
 }
 
 /**
@@ -5676,6 +6078,11 @@ export declare interface RemoteVideoStreamState {
      * Proxy of {@link @azure/communication-calling#RemoteVideoStream.isAvailable}.
      */
     isAvailable: boolean;
+    /**
+     * Proxy of {@link @azure/communication-calling#RemoteVideoStream.isReceiving}.
+     * @beta
+     */
+    isReceiving: boolean;
     /**
      * {@link VideoStreamRendererView} that is managed by createView/disposeView in {@link StatefulCallClient}
      * API. This can be undefined if the stream has not yet been rendered and defined after createView creates the view.
@@ -5683,6 +6090,11 @@ export declare interface RemoteVideoStreamState {
     view?: VideoStreamRendererViewState;
 }
 
+/**
+ * @beta
+ */
+export declare type Role = 'Presenter' | 'Attendee' | 'Consumer';
+
 /**
  * A button to start / stop screen sharing.
  *
@@ -5716,6 +6128,7 @@ export declare interface ScreenShareButtonProps extends ControlBarButtonProps {
  */
 export declare type ScreenShareButtonSelector = (state: CallClientState, props: CallingBaseSelectorProps) => {
     checked?: boolean;
+    disabled?: boolean;
 };
 
 /**
@@ -5874,6 +6287,18 @@ export declare interface SendBoxStrings {
      * Error message indicating that all file uploads are not complete.
      */
     fileUploadsPendingError: string;
+    /**
+     * Aria label to notify user when focus is on cancel file upload button.
+     */
+    removeFile: string;
+    /**
+     * Aria label to notify user file uploading starts.
+     */
+    uploading: string;
+    /**
+     * Aria label to notify user file is uploaded.
+     */
+    uploadCompleted: string;
 }
 
 /**
@@ -6000,6 +6425,18 @@ export declare interface StatefulCallClient extends CallClient {
      * @param stream - The LocalVideoStreamState or RemoteVideoStreamState to dispose.
      */
     disposeView(callId: string | undefined, participantId: CommunicationIdentifier | undefined, stream: LocalVideoStreamState | RemoteVideoStreamState): void;
+    /**
+     * The CallAgent is used to handle calls.
+     * To create the CallAgent, pass a CommunicationTokenCredential object provided from SDK.
+     * - The CallClient can only have one active CallAgent instance at a time.
+     * - You can create a new CallClient instance to create a new CallAgent.
+     * - You can dispose of a CallClient's current active CallAgent, and call the CallClient's
+     *   createCallAgent() method again to create a new CallAgent.
+     * @param tokenCredential - The token credential. Use AzureCommunicationTokenCredential from `@azure/communication-common` to create a credential.
+     * @param options - The CallAgentOptions for additional options like display name.
+     * @public
+     */
+    createCallAgent(...args: Parameters<CallClient['createCallAgent']>): Promise<DeclarativeCallAgent>;
 }
 
 /**
@@ -6013,6 +6450,15 @@ export declare type StatefulCallClientArgs = {
      * state. It is not used by StatefulCallClient.
      */
     userId: CommunicationUserIdentifier;
+    /**
+     * A phone number in E.164 format that will be used to represent the callers identity. This number is required
+     * to start a PSTN call.
+     *
+     * example: +11234567
+     *
+     * This is not a cached value from the headless calling client.
+     */
+    alternateCallerId?: string;
 };
 
 /**
@@ -6121,6 +6567,8 @@ export declare interface StreamMediaProps {
     videoStreamElement: HTMLElement | null;
     /** Decides whether to mirror the video or not. */
     isMirrored?: boolean;
+    /** Whether the stream is loading data */
+    loadingState?: LoadingState;
     /**
      * Allows users to pass in an object contains custom CSS styles.
      * @Example
@@ -6617,6 +7065,8 @@ export declare interface VideoGalleryStream {
     id?: number;
     /** Whether the video stream is available or not */
     isAvailable?: boolean;
+    /** Whether the video stream is receiving data or not */
+    isReceiving?: boolean;
     /** Whether the video stream is mirrored or not */
     isMirrored?: boolean;
     /** Render element of the video stream */
@@ -6641,6 +7091,8 @@ export declare interface VideoGalleryStrings {
     localVideoMovementLabel: string;
     /** String for announcing the selected camera */
     localVideoSelectedDescription: string;
+    /** placeholder text for participants who does not have a display name*/
+    displayNamePlaceholder: string;
 }
 
 /**