communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
100 lines • 2.92 kB
TypeScript
/// <reference types="react" />
import { IStyle, IButtonStyles, ITextFieldStyles } from '@fluentui/react';
/**
* Strings of {@link Dialpad} that can be overridden.
*
* @public
*/
export interface DialpadStrings {
placeholderText: string;
deleteButtonAriaLabel?: string;
}
/**
* Styles for {@link Dialpad} component.
*
* @public
*/
export interface DialpadStyles {
root?: IStyle;
button?: IButtonStyles;
textField?: Partial<ITextFieldStyles>;
digit?: IStyle;
letter?: IStyle;
deleteIcon?: IButtonStyles;
}
/**
* DTMF tone for PSTN calls.
*
* @public
*/
export type DtmfTone = 'A' | 'B' | 'C' | 'D' | 'Flash' | 'Num0' | 'Num1' | 'Num2' | 'Num3' | 'Num4' | 'Num5' | 'Num6' | 'Num7' | 'Num8' | 'Num9' | 'Pound' | 'Star';
/**
* Modes of the dialpad component.
* @public
*/
export type DialpadMode = 'dtmf' | 'dialer';
/**
* Modes of how the longpress handlers can be tiggered.
* @public
*/
export type LongPressTrigger = 'mouseAndTouch' | 'touch';
/**
* Props for {@link Dialpad} component.
*
* @public
*/
export 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;
/**
* set dialpad textfield content
*/
textFieldValue?: string;
/**
* on change function for text field, provides an unformatted plain text
*/
onChange?: (input: string) => void;
/**
* flag to determine when to show/hide delete button, default true
*/
showDeleteButton?: boolean;
/**
* Determines what kind of device that the user is on and should respect that based on interaction
* interfaces available to the user
*/
longPressTrigger?: LongPressTrigger;
/**
* Styles for customizing the dialpad component
*/
styles?: DialpadStyles;
/**
* Disables DTMF sounds when dialpad buttons are pressed. the actual
* tones are still sent to the call.
*/
disableDtmfPlayback?: boolean;
/**
* Dialer mode for the dialpad. The dtmf mode is for sending dtmf tones and the appearence of
* the dialpad is changed like hiding the input box. When using dialer mode the input box is there
* and can be edited to change the number being dialed.
*/
dialpadMode?: DialpadMode;
/**
* Audio context for generating DTMF tones. If this if not provided the dialpad will create one iteslf.
*/
dtmfAudioContext?: AudioContext;
}
/**
* A component to allow users to enter phone number through clicking on dialpad/using keyboard
* It will return empty component for stable builds
*
* @public
*/
export declare const Dialpad: (props: DialpadProps) => JSX.Element;
//# sourceMappingURL=Dialpad.d.ts.map