Types
- Turnkey
 - Embed-SDK React
 - Embed-SDK Web
 
This page is an index of types, interfaces, enums used across the Customization API
DefaultContentInterface
| Key | Type | Description | 
|---|---|---|
| uid | UidType | uid of the user | 
| audio | ToggleState | audio mute state | 
| video | ToggleState | video mute state | 
| streamType | 'high' | 'low' | stream quality type | 
| name | string | display name of the user | 
| screenUid | number | uid of the screenshare stream | 
| offline | boolean | offline status of the user | 
| type | 'rtc' | content type | 
ExtenedContentInterface
Defined by the user, can contain any information necessary for the corresponding custom content added.
| Key | Type | Description | 
|---|---|---|
| type | string | Content of the chat message | 
| [key: string] | any | Content of the chat message | 
ChatMessageType
Type of message that is sent in private/public group.
| Key | Type | Description | 
|---|---|---|
| TXT | txt | Text message type | 
| IMAGE | img | Image message type | 
| FILE | file | File message type like pdf,doc,zip... | 
| CUSTOM | custom | User-defined custom message type | 
SDKChatType
Message sent in as group or private chat.
| Key | Value | Description | 
|---|---|---|
| SINGLE_CHAT | singleChat | Msg sent to private chat user | 
| GROUP_CHAT | groupChat | Msg sent in a group chat | 
ChatOption
Chat Message that is to be sent in private/public group.
| Key | Type | Description | 
|---|---|---|
| chatType | SDKChatType | Type of chat : peer or group | 
| type | chatMessageType | Type of chat message to be sent | 
| from | UidType | Sender of message | 
| to | UidType | Receiver of message | 
| msg? | string | Content of the message (optional) | 
| file? | object | File object of attachment message (optional) | 
| ext? | {file_length: number; file_ext: string; file_name: string; file_url: string; from_platform?: string;} | Custom attributes to be send along with message (optional) | 
| url? | string | URL associated with the message (optional) | 
MessageStatusCallback
The message status change listener. Occurs when a message is uploaded or downloaded.
| Property | Type | Description | 
|---|---|---|
| onProgress | ((localMsgId: string, progress: number) => void)? | Occurs when a message is uploaded or downloaded. | 
| onError | (localMsgId: string, error: any) => void | Occurs when a message error occurs | 
| onSuccess | (message: ChatMessage) => void | Occurs when a message is successfully delivered | 
UploadStatus
Upload Status of the Attachment message
| Key | Value | Description | 
|---|---|---|
| NOT_STARTED | notStarted | Upload not started yet | 
| IN_PROGRESS | inProgress | Upload in progress | 
| SUCCESS | success | Upload successful | 
| FAILURE | failure | Upload failed | 
ChatMessage
Message object when a chat message is received or recalled.
| Property | Type | Description | 
|---|---|---|
| msgId | string | Message ID | 
| localMsgId | string | Local message ID | 
| conversationId | string | Conversation ID | 
| from | string | Sender ID | 
| to | string | Receiver ID | 
| localTime | number | Local timestamp of the message | 
| serverTime | number | Server timestamp of the message | 
| hasDeliverAck | boolean | Indicates if delivery acknowledgment is present | 
| hasReadAck | boolean | Indicates if read acknowledgment is present | 
| needGroupAck | boolean | Indicates if group acknowledgment is needed | 
| groupAckCount | number | Count of group acknowledgments | 
| hasRead | boolean | Indicates if the message has been read | 
| chatType | number | Type of chat | 
| direction | string | Direction of the message (incoming/outgoing) | 
| status | number | Status of the message | 
| attributes | any | Additional attributes of the message | 
| body | any | Body of the message | 
| isChatThread | boolean | Indicates if the message is part of a chat thread | 
| isOnline | boolean | Indicates if the user is currently online | 
| deliverOnlineOnly | boolean | Indicates if the message should be delivered only when the receiver is online | 
| receiverList | string[] | List of receiver IDs | 
VideoEncoderConfigurationPreset
The preset video encoder configurations.
'120p_1' | '120p_3' | '180p_1' | '180p_3' | '180p_4' | '240p_1' | '240p_3' | '240p_4' | '360p_1' | '360p_3' | '360p_4' | '360p_6' | '360p_7' | '360p_8' | '360p_9' | '360p_10' | '360p_11' | '480p_1' | '480p_2' | '480p_3' | '480p_4' | '480p_6' | '480p_8' | '480p_9' | '480p_10' | '720p_1' | '720p_2' | '720p_3' | '720p_5' | '720p_6'
ScreenEncoderConfigurationPreset
The preset video encoder configurations for screen sharing.
'480p_1' | '480p_2' | '480p_3' | '720p' | '720p_1' | '720p_2' | '720p_3' | '1080p' | '1080p_1' | '1080p_2' | '1080p_3'
VideoEncoderConfiguration
Interface that defines video encoder configurations.
| Property | Type | Description | 
|---|---|---|
| bitrateMax | number | The maximum bitrate of the video (Kbps) | 
| bitrateMin | number | The minimum bitrate of the video (Kbps) | 
| frameRate | number | ConstrainLong | Frame rate of the video (fps) | 
| height | number | ConstrainLong | Height of the video | 
| width | number | ConstrainLong | Width of the video | 
ConstrainLong
Specifies a constraint for a property, such as the resolution or bitrate for video capture in VideoEncoderConfiguration.
| Property | Type | Description | 
|---|---|---|
| exact | number | A required value of a property. If the video capture device cannot output this value, the video capture fails. | 
| ideal | number | An ideal value of a property. If the video capture device cannot output this value, it outputs the closest value instead. | 
| max | number | The upper limit of the property | 
| min | number | The lower limit of the property | 
VBOption
Type of Virtual Background option that can be applied in the video.
| Key | Type | Description | 
|---|---|---|
| type | VBMode | Type of virtual background, e.g., blur, image, none. | 
| path | string | Required for image type VBMode. Must be a valid image URL pointing to the image. | 
| label | string | Optional label for the virtual background option, used for display purposes. | 
| isSelected | boolean | Optional flag indicating if this virtual background option is currently selected. | 
VBMode
Type of Virtual Background that can be applied
| Key | Value | Description | 
|---|---|---|
| VBMode | blur | Applies a blur effect as the virtual background. | 
| image | Uses an image as the virtual background. | |
| none | No virtual background is applied. | 
BeautyEffects
Image Enhancement options.
| Key | Value | Description | 
|---|---|---|
| lighteningContrastLevel | 0, 1, 2 (optional) | The contrast level, used with the lighteningLevel parameter. The larger the value, the greater the contrast between light and dark. | 
| lighteningLevel | Number (optional) | Adjusts the brightening level.The higher the value, the greater the degree of brightening. | 
| smoothnessLevel | Number (optional) | Controls the smoothness level of the effect.The greater the value, the greater the smoothness level. | 
| sharpnessLevel | Number (optional) | Modifies the sharpness level of the image.The larger the value, the greater the sharpness level. | 
| rednessLevel | Number (optional) | Alters the redness level, adjusting the red tones in the image.The larger the value, the greater the redness level. | 
ButtonTemplateName
| Name | Value | 
|---|---|
| topBar | 0 | 
| bottomBar | 1 | 
ContentInterface: DefaultContentInterface | ExtenedContentInterface
ContentObjects
| Key | Type | Description | 
|---|---|---|
| [key: UidType] | ContentInterface | Object containing information necessary to render content view for the corresponding uid | 
Selector( e: T ): Partial<T>
Method to subscribe to portions of the app-state. When passed to an app-state accessor method it receives the contents of the associated app-state as argument, it must then selectively return the contents which are intended to be subscribed and eventually returned by the accessor method.
- turnkey
 - react-sdk
 - web-sdk
 
import { useRecording } from "customization-api";
const { isRecordingActive, startRecording } = useRecording(
  ({isRecordingActve ,startRecording, stopRecording}) => {
    return({{isRecordingActve, startRecording}})
  }
);
/*
#### RecordingContextInterface
isRecordingActve : boolean
startRecording   : () => void
stopRecording    : () => void
*/
import { useRecording } from "@appbuilder/react";
const { isRecordingActive, startRecording } = useRecording(
  ({isRecordingActve ,startRecording, stopRecording}) => {
    return({{isRecordingActve, startRecording}})
  }
);
/*
#### RecordingContextInterface
isRecordingActve : boolean
startRecording   : () => void
stopRecording    : () => void
*/
import { useRecording } from "@appbuilder/web";
const { isRecordingActive, startRecording } = useRecording(
  ({isRecordingActve ,startRecording, stopRecording}) => {
    return({{isRecordingActve, startRecording}})
  }
);
/*
#### RecordingContextInterface
isRecordingActve : boolean
startRecording   : () => void
stopRecording    : () => void
*/
DispatchType: <T, V>(action: { type: T; value: V }) => void
T: keyof CallbacksInterface
V: Parameters<CallbacksInterface[T]>
Used to dispatch various app builder actions.
- turnkey
 - react-sdk
 - web-sdk
 
import { useRtc } from "customization-api";
...
const { dispatch } = useRtc();
...
dispatch({
  type: "AddCustomContent",
  value: [123, { type: "MyContent", info: "MyInfo" }],
});
import { useRtc } from "@appbuilder/react";
...
const { dispatch } = useRtc();
...
dispatch({
  type: "AddCustomContent",
  value: [123, { type: "MyContent", info: "MyInfo" }],
});
import { useRtc } from "@appbuilder/web";
...
const { dispatch } = useRtc();
...
dispatch({
  type: "AddCustomContent",
  value: [123, { type: "MyContent", info: "MyInfo" }],
});
CallbacksInterface
| Key | Type | Description | 
|---|---|---|
| EndCall | () => void | Ends the call | 
| SwitchCamera | () => void | Switches the video device being used [ mobile only ] | 
| SwapVideo | ( uid: UidType ) => void | Swaps given uid with the uid at the top in activeUids | 
| DequeVideo | ( uid: UidType ) => void | Shifts given uid to top of activeUids | 
| UpdateRenderList | ( uid: UidType, user: Partial<ContentInterface> ) => void | Updates contentObject of the given uid in defaultContent | 
| AddCustomContent | ( uid: UidType, data: ContentInterface ) => void | Adds the given data to defaultContent with given uid as key. | 
ToolbarItemsConfig: TopToolbarItemsConfig | BottomToolbarItemsConfig | ToolbarDefaultItemsConfig
TopToolbarItemsConfig
| Key | Type | Description | 
|---|---|---|
| [key: TopToolbarDefaultKeys] | ToolbarDefaultItem | Object containing information to modify the top toolbar items | 
BottomToolbarItemsConfig
| Key | Type | Description | 
|---|---|---|
| [key: BottomToolbarDefaultKeys] | ToolbarDefaultItem | Object containing information to modify the bottom toolbar items | 
| more | ToolbarMoreDefaultItem | Object containing information to modify the bottom more toolbar items | 
ToolbarDefaultItemsConfig
| Key | Type | Description | 
|---|---|---|
| [key: string] | ToolbarDefaultItem | Object containing information to modify/define toolbar items | 
ToolbarDefaultItem
| Key | Type | Description | 
|---|---|---|
| component?: | () => JSX.Element | Used to override the default component | 
| align?: | ToolbarItemAlign | Used to align the component | 
| hide?: | ToolbarItemHide | Used to show/hide the component | 
| order?: | number | Used to order the component | 
| label?: | ToolbarItemLabel | Used to change default label | 
| onPress?: | () => void | Used to add on press functionality | 
ToolbarMoreDefaultItem
| Key | Type | Description | 
|---|---|---|
| component?: | () => JSX.Element | Used to override the default component | 
| align?: | ToolbarItemAlign | Used to align the component | 
| hide?: | ToolbarItemHide | Used to show/hide the component | 
| order?: | number | Used to order the component | 
| fields?: | ToolbarMoreButtonFields | Used to modify more button toolbar items | 
| label?: | ToolbarItemLabel | Used to change default label | 
ToolbarMoreButtonFields
| Key | Type | Description | 
|---|---|---|
| [key: MoreButtonDefaultKeys] | {hide?: ToolbarItemHide; order?: number;} | Used to modify more button toolbar items |