Container V1

This page contains the API documentation for the container method of implementing UI modules. The following are the Agent Assist features that you can implement as components within your container.

Attributes

Property name Type Comment
features
string Comma-separated list of Agent Assist suggestion feature keys to render. Example: "SMART_REPLY, CONVERSATION_SUMMARIZATION"
api-headers
string Additional headers to include in Dialogflow API calls. Example: "Content-Type:application/json, Accept:application/json"
conversation-profile
string Name of the conversation profile to use.
agent-desktop
AgentDesktop Agent desktop software to integrate with.
auth-token
string Authentication token to use for API calls.
api-key
string Optional API key to use for API calls.
channel
CommunicationChannel Communication channel used for this application (chat, voice, or omnichannel).
custom-api-endpoint
string Optional custom API endpoint to use (if UI modules are configured with a proxy server).
theme
'dark' | 'light' Color theme to use.
show-header
BooleanString Whether to show the Agent Assist suggestions header.
dark-mode-background
string Background color to use for dark mode. If none is specified, defaults are provided for the primary supported agent desktops.
notifier-server-endpoint
string Notifier server endpoint to use for event-based conversations.
event-based-transport
EventBasedTransport Transport protocol to use for event-based conversations.
event-based-library
EventBasedLibrary Library to use for event-based conversations.
oauth-client-id
string Optional OAuth Client ID for implicit authentication, used in some agent desktop configurations (Genesys Cloud).
redirect-uri
string Optional redirect URI to navigate to after authentication, used in some agent desktop configurations (Genesys Cloud).
genesys-cloud-region
string Optional region for Genesys Cloud, defaults to mypurecloud.com.

Usage

Attributes are string-based component properties which can be set in the following ways:

HTML

js <element-selector property-name="value">

JavaScript

js var el = document.querySelector('element-selector'); el.setAttribute('property-name', 'value');

Inputs

Property name Type Comment
socketIoConnectOpts
SocketIoConnectOpts Additional Socket.io connect options.
config
UiModuleContainerConfig Configuration object to define module-specific configurations.

Usage

Inputs are typically JavaScript objects or other complex property types which must be assigned on the element instance directly:

  const 
  
 el 
  
 = 
  
 document 
 . 
 querySelector 
 ( 
 'element-selector' 
 ); 
 el 
 . 
 propertyName 
  
 = 
  
 value 
 ; 
 

Types

See the following section for the custom types used by the component.

AgentDesktop

  "LivePerson" 
  
 | 
  
 "GenesysCloud" 
  
 | 
  
 "SalesForce" 
  
 | 
  
 "Custom" 
 

CommunicationChannel

  "chat" 
  
 | 
  
 "voice" 
  
 | 
  
 "omnichannel" 
 

BooleanString

  "true" 
  
 | 
  
 "false" 
 

EventBasedTransport

  "websocket" 
  
 | 
  
 "polling" 
 

EventBasedLibrary

  "SocketIo" 
 

SocketIoConnectOpts

  interface 
  
 SocketIoConnectOpts 
  
 extends 
  
 SocketIOClient 
 . 
 ConnectOpts 
  
 { 
  
 auth 
 : 
  
 { 
  
 token 
 : 
  
 string 
 ; 
  
 }; 
  
 withCredentials 
 ?: 
  
 boolean 
 ; 
 } 
 

UiModuleContainerConfig

  interface 
  
 UiModuleContainerConfig 
  
 { 
  
 knowledgeAssistConfig 
 ?: 
  
 { 
  
 articleLinkConfig 
 : 
  
 { 
  
 /** 
 * Whether to open the article in a new tab or as a dialog. Defaults to new 
 * tab. 
 */ 
  
 target 
 ?: 
  
 "blank" 
  
 | 
  
 "popup" 
 ; 
  
 /** 
 * Options to configure the popup's size and location. See 
 * https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features. 
 */ 
  
 popupWindowOptions 
 ?: 
  
 string 
 ; 
  
 /** 
 * The field name on the document metadata if a separate article link source 
 * is provided. 
 */ 
  
 linkMetadataKey 
 ?: 
  
 string 
 ; 
  
 }; 
  
 }; 
  
 knowledgeAssistV2Config 
 ?: 
  
 { 
  
 articleLinkConfig 
 ?: 
  
 { 
  
 /** 
 * Whether to open the article in a new tab or as a dialog. Defaults to new 
 * tab. 
 */ 
  
 target 
 ?: 
  
 "blank" 
  
 | 
  
 "popup" 
 ; 
  
 /** 
 * Options to configure the popup's size and location. See 
 * https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features. 
 */ 
  
 popupWindowOptions 
 ?: 
  
 string 
 ; 
  
 /** 
 * The field name on the document metadata if a separate article link source 
 * is provided. 
 */ 
  
 linkMetadataKey 
 ?: 
  
 string 
 ; 
  
 }; 
  
 showCopyAnswer 
 : 
  
 boolean 
 ; 
  
 showPasteAnswer 
 : 
  
 boolean 
 ; 
  
 }; 
  
 summarizationConfig 
 ?: 
  
 { 
  
 /** 
 * Optional callback that can be used to save the generated summary to an 
 * external source. 
 */ 
  
 onSaveSummary 
 ?: 
  
 ( 
  
 summary 
 : 
  
 { 
  
 summary 
 : 
  
 string 
 ; 
  
 conversationDetails 
 : 
  
 ConversationDetails 
 ; 
  
 }, 
  
 saveCallbacks 
 : 
  
 { 
  
 setLoading 
 : 
  
 () 
  
 = 
>  
 void 
 ; 
  
 setSuccess 
 : 
  
 ( 
 message 
 : 
  
 string 
 ) 
  
 = 
>  
 void 
 ; 
  
 setError 
 : 
  
 ( 
 message 
 : 
  
 string 
 ) 
  
 = 
>  
 void 
 ; 
  
 } 
  
 ) 
  
 = 
>  
 void 
 ; 
  
 /** Whether to show the 'Generate summary' button. */ 
  
 showGenerateSummaryButton 
 ?: 
  
 "true" 
  
 | 
  
 "false" 
 ; 
  
 }; 
 } 
 
Create a Mobile Website
View Site in Mobile | Classic
Share by: