API reference

The interface of the ccaas web SDK instance.

Properties

This section contains some of the properties you might use.

version

The version of the web SDK.

console.log(ccaas.VERSION)

client

This is an instance of the Headless client, it contains everything available on a headless client.

Here is an example:

const client = ccaas.client
const chat = await client.loadOngoingChat()

Methods

Available methods on the widget instance.

.config

Update the configuration of the widget.

ccaas.config({
  accent: 'green'
})

For more information see the Configuration section.

.mount

Mount the widget on the given element. For example, on your webpage:

<div id="my-ccaas"></div>

Then, you can mount the web SDK widget with:

ccaas.mount('#my-ccaas')

.unmount

Remove the web SDK widget from your webpage.

ccaas.unmount()

.destroy

Unmount and destroy everything.

ccaas.destroy()

.show

Display the widget UI.

ccaas.show()

.hide

Hide the widget UI.

ccaas.hide()

.start

Show and start the widget with the given options.

interface StartOption {
  menuKey?: string;
  ticketId?: string;
  preferredChannel?: string;
}

Example:

ccaas.start({ menuKey: 'vip' })

Events

This section describes the events available in the web SDK. For a complete list of events available in the headless web SDK, see Headless web SDK events.

Use the .on method to add an event listener. See the following example:

const trackChat = (chat) => {
  console.log(chat)
}

ccaas.on('chat.updated', trackChat)

Use the .off method to remove an event listener. See the following example:

ccaas.off('chat.updated', trackChat)

The .on and .off methods are aliases for the headless web SDK's .on and .off methods. For more information, see Headless web SDK guide.

visible

The visible event is emitted when the widget is ready for communication.

The following example shows the visible event:

ccaas.on('visible', (visible) => {
  console.log(visible)  // true or false
})

chat.unread

The chat.unread event is emitted when the unread message count changes.

The following example shows the chat.unread event:

ccaas.on('chat.unread', (count) => {
  console.log(count)
})

exited

The exited event is emitted when the end-user closes the widget.

The following example shows the exited event:

ccaas.on('exited', () => {
  // widget was exited
})