vania-janet/multiturn-rag-retrieval-data huggingface dataset:
(For more information about this feature, see the launcherBeta configuration option at [Configuration options object](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-configurationconfigurationobject).)







 4.5.0 

Release date: 29 July 2021



* A new scrollToMessage method is available for scrolling the web chat view to a specified message in the chat history. For more information, see [instance.scrollToMessage()](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-instance-methodsscrollToMessage).
* A new pre:open event is available. This event is fired when the web chat window is opened, but before the welcome message or chat history are loaded. For more information, see [window:pre:open](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-eventswindowpreopen).
* A new chat history widget is available for embedding in service desk agent UIs. This new widget is based on a read-only view of the standard web chat widget. For information about using the new chat history widget in integrations built using the starter kit, see [Embedded agent application](https://github.com/watson-developer-cloud/assistant-web-chat-service-desk-starter/blob/main/docs/AGENT_APP.md).







 4.4.1 

Release date: 6 July 2021



* Bug fixes.







 4.4.0 

Release date: 25 June 2021



* Bug fixes.







 4.3.0 

Release date: 7 June 2021



* Search suggestions: If a search skill is configured for your assistant, the suggestions include a new View related content section. This section contains search results that are relevant to the user input.
* Focus trap: A new enableFocusTrap option enables maintaining focus inside the web chat widget while it is open.
For more information, see [Changing background website](https://cloud.ibm.com/docs/watson-assistant?topic=watson-assistant-preview-sharepreview-change-background).
* Customize web chat: Customize your draft web chat channel to match your brand or website. For more information, see [Web chat setup overview](https://cloud.ibm.com/docs/watson-assistant?topic=watson-assistant-web-chat-config).



![Image of the Preview page](https://cloud.ibm.com/docs-content/v1/content/ca9232b3702768f24bb897f48f10778fcda28718/watson-assistant/images/preview-page.png)





 Copying a link to share 

You can share an unauthenticated version of your assistant with your team by sending them a link. The link opens a sample web page with an interactive web chat widget where you can test out your assistant as if you were a customer. Your subject-matter experts can test your in-progress assistant without needing access to Watson Assistant itself. The experience is identical to using Preview this environment on the draft environment tab.

To share a link:



1. On the Preview page, click Copy link to share.
2. Send the link to your team.



The preview link is not accessible if web chat security is enabled. For more information about web chat security, see [Securing the web chat](https://cloud.ibm.com/docs/watson-assistant?topic=watson-assistant-web-chat-security).





 Changing background website 

You can visualize how your assistant would look as a web chat widget on your organization's website. You can enter a URL or upload an image.



 Entering a URL 

You can enter a URL of your organization's website. Watson Assistant captures an image of your website to use as the Preview page background.

Your website must be publicly available to all users. Private or intranet sites can’t be accessed.
If you don't want to use a home screen, go to the Home screen tab and toggle the switch to Off.
8. Optional: To configure support for transferring conversations to a service desk agent, click the Live agent tab. For more information, see [Adding service desk support](https://cloud.ibm.com/docs/assistant?topic=assistant-deploy-web-chatdeploy-web-chat-haa).
9. Optional: The web chat gives your customers a way to reset the conversation if they get stuck by showing them a list of suggestions. Suggestions are enabled automatically. You can control how often suggestions are displayed and what they include. Click the Suggestions tab. For more information, see [Showing more suggestions](https://cloud.ibm.com/docs/assistant?topic=assistant-deploy-web-chatdeploy-web-chat-alternate).
10. Optional: To secure the web chat, click the Security tab. For more information, see [Securing the web chat](https://cloud.ibm.com/docs/assistant?topic=assistant-web-chat-security).
11. Click the Embed tab.

A code snippet is displayed that defines the chat window implementation. You will add this code snippet to your web page. The code snippet contains an HTML script element. The script calls JavaScript code that is hosted on an IBM site. The code creates an instance of a widget that communicates with the assistant. The generated code includes a region and unique integration ID. Do not change these parameter values.
12. Copy the script HTML element. You add this script to your website in the next section, [Deploy your assistant in production](https://cloud.ibm.com/docs/assistant?topic=assistant-deploy-web-chatdeploy-web-chat-snippet).
13. If you made any customizations, click Save and exit. Otherwise, click Close.

The web chat instance is created as soon as you click the Create button, and does not need to be saved.
For a tutorial the shows you how, see [Using a custom launcher](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=tutorials-launcher).
* Change how the web chat widget opens. For example, you might want to launch the web chat from some other button or process that exists on your website, or maybe open it in a different location, or at a different size. For a tutorial that shows you how, see [Render to a custom element](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=tutorials-example-element).
* Hide the launcher icon entirely and automatically start the web widget in open state, at its full length. For more information, see the [openChatByDefault method](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-configurationconfigurationobject).
* Hide the close button so users cannnot close the web chat widget. For more information, see the [hideCloseButton method](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-configurationconfigurationobject).







 Change the conversation 

The core of the conversation is defined in your skill. If you use more than one integration type, focus on defining an engaging conversation in the underlying skill. The same skill is used for all integrations. To customize the conversation for the web chat only, you can take the following actions:



* Update the text of a message before it is sent or after it is received, such as to hide personally-identifiable information.
* Pass contextual information, such as the customer's name, from the web chat to the underlying skill. For examples of how to complete common tasks, see [Passing values](https://cloud.ibm.com/docs/assistant-data?topic=assistant-data-web-chat-configweb-chat-config-context).
* Change the language that is used by the web chat.
For more information about these response types, see [Rich responses](https://cloud.ibm.com/docs/assistant?topic=assistant-dialog-overviewdialog-overview-multimedia).
* Link to start web chat: You can now create a set of HTML links that go directly to your web chat and start conversations on specific topics. For example, you might want to send an email inviting customers to update their account information; you can include a link that opens the web chat on your site and sends the initial message I want to update my account. For more information, see [Creating links to web chat](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-configurationpageLinks).
* CSS improvements: Support for CSS styles has been improved to change the way the web chat resets styles in areas where you can include your own custom content, such as user-defined responses and writeable elements. The new approach better protects custom content from accidental style overrides. For more information about custom content and CSS classes, see [Theming & custom content](https://web-chat.global.assistant.watson.cloud.ibm.com/testfest.html?to=api-render).

If you have any custom content (such as user-defined responses or writeable elements), verify that any styling is still rendering as you expect. Consider using the new [ibm-web-chat--default-styles class](https://web-chat.global.assistant.watson.cloud.ibm.com/testfest.html?to=api-renderhelper_classes) to maintain consistency with the web chat default styles.
* Support for Carbon components: As part of the new styling support, you can now use [Carbon components](https://www.carbondesignsystem.com/components/overview/) in user-defined responses and web chat writeable elements. These components will inherit any theming customizations you have made to the web chat.
* New embedded script: The embedded script you use to add the web chat to your website has been updated to avoid unexpected code changes when you lock on to a web chat version.
* "User is typing" support: The web chat now supports displaying the "user is typing" message for service desks. This feature is supported for the Salesforce and Zendesk integrations, as well as any [starter kit](https://github.com/watson-developer-cloud/assistant-web-chat-service-desk-starter) integration that implements it.
* Bug fixes.







 5.1.0 

Release date: 28 October 2021



* Custom Panels: The web chat now supports customizable panels you can use to display any custom HTML content (for example, a feedback form or a multistep process). Your code can use instance methods to dynamically populate a custom panel, as well as open and close it. For more information, see [Custom Panels](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-instance-methodscustompanels).







 5.0.2 

Release date: 4 October 2021



* A [new tutorial](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=tutorials-react-portals) is now available that shows how to use Carbon components to customize user-defined responses and writeable elements.
* Bug fixes.







 5.0.1 

Release date: 20 September 2021



* Bug fixes.







 5.0.0 

Release date: 16 September 2021



* New response types: The web chat now supports the new video, audio, and iframe response types. For more information about these response types, see [Rich responses](https://cloud.ibm.com/docs/assistant?topic=assistant-dialog-overviewdialog-overview-multimedia).
* Link to start web chat: You can now create a set of HTML links that go directly to your web chat and start conversations on specific topics. For example, you might want to send an email inviting customers to update their account information; you can include a link that opens the web chat on your site and sends the initial message I want to update my account.
Make your assistant the go-to help resource for customers by adding it as a chat widget to your company website. If none of the built-in integrations fit your needs, use the APIs to build your own custom app. 
 Track customer engagement and satisfaction Use built-in metrics to analyze logs from conversations between customers and your assistant to gauge how well it's doing and identify areas for improvement. 





 How it works 

This diagram illustrates how the product delivers an exceptional, omnichannel customer experience:

![Flow diagram of the service](https://cloud.ibm.com/docs-content/v1/content/417db917d18067d9dcc4cf2612564a9a87c3ddc8/assistant/images/arch-detail.png)



* Customers interact with the assistant through one or more of these channels:



* An existing social media messaging platform, such as Slack, Facebook Messenger, or WhatsApp
* A phone call or text message
* A web chat that you embed in your company website and that can transfer complex requests to a customer support representative.
* A custom application that you develop, such as a mobile app or a robot with a voice interface



* The assistant receives a message from a customer and sends it down the appropriate resolution path.

If you want to preprocess incoming messages, this is where you would use webhooks to inject logic that calls an external service that can process the messages before the assistant routes them. Likewise, you can process responses from the assistant before they are returned to the customer.
* The assistant chooses the appropriate resolution from among these options:



* A conversational skill interprets the customer's message further, then directs the flow of the conversation. The skill gathers any information it needs to respond or perform a transaction on the customer's behalf.
* A search skill leverages existing FAQ or other curated content that you own to find relevant answers to customer questions.
* If a customer wants more personalized help or wants to discuss a sensitive subject, the assistant can connect the customer with someone from your support team through the web chat integration.
* Support for Carbon components: As part of the new styling support, you can now use [Carbon components](https://www.carbondesignsystem.com/components/overview/) in user-defined responses and web chat writeable elements. These components will inherit any theming customizations you have made to the web chat.
* New embedded script: The embedded script you use to add the web chat to your website has been updated to avoid unexpected code changes when you lock on to a web chat version. (For more information about web chat versioning, see [Versioning](https://cloud.ibm.com/docs/assistant?topic=assistant-web-chat-basicsweb-chat-basics-versions).) The previous version of the script will continue to work but is now deprecated. If you want to upgrade your existing web chat deployments to use the new script, copy the updated code snippet from the Embed tab of the web chat integration settings. (Remember to reapply any customizations you have made.)
* Removal of deprecated methods and events:



* The error event has been replaced by the onError method in the [configuration object](https://web-chat.global.assistant.watson.cloud.ibm.com/testfest.html?to=api-configurationconfigurationobject).
* The getID method has been removed.



* Microsoft Internet Explorer 11 is no longer a supported browser.







 4.5.1 

Release date: 30 August 2021



* Bug fixes for the interactive launcher beta feature. (For more information about this feature, see the launcherBeta configuration option at [Configuration options object](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-configurationconfigurationobject).)







 4.5.0 

Release date: 29 July 2021



* A new scrollToMessage method is available for scrolling the web chat view to a specified message in the chat history.
A preview pane is displayed that shows you what the web chat looks like when it is embedded in a web page. If a message is displayed that starts with, There is an error, it means you haven't added a conversational skill to your assistant yet. After you add a skill, you can test the conversation from the preview pane.
4. Click Create to create a web chat instance.

You can skip this step if the web chat integration was created for you automatically.

![Plus or higher plans only](https://cloud.ibm.com/docs-content/v1/content/417db917d18067d9dcc4cf2612564a9a87c3ddc8/assistant/images/plus.png) For environments where private endpoints are in use, keep in mind that the web chat integration sends traffic over the internet. For more information, see [Private network endpoints](https://cloud.ibm.com/docs/assistant?topic=assistant-securitysecurity-private-endpoints).
5. Optional: Customize the style of the chat window. You can make the following changes:



* Assistant's name as known by customers: The name by which the assistant is known to users. This name is displayed in the header of the chat window. The name can be up to 64 characters in length.
* Primary color: The color of the web chat header.

Click the white dot to open a color switcher where you can choose a color. The color is saved as an HTML color code, such as FF33FC for pink and 329A1D for green. Alternatively, you can add an HTML color code directly to the field to set the color.
* Secondary color: The color of the user input message bubble.
* Accent color: The color of interactive elements, including:



* Chat launcher button that is embedded in your web page
* Send button associated with the input text field
* Input text field border when in focus
* Marker that shows the start of the assistant’s response
* Border of a button after it is clicked
* Border of the drop-down list field as the user chooses an option
In the Message before link to web chat field, edit the introductory message to display to the user (in the originating channel) before the link that initiates the transfer. By default, this message is OK, click this link for additional help. Chat will continue on a new web page.
3. In the URL to web chat field, type the URL for your website where the web chat widget is embedded.



In the integration that processes the Channel transfer response, the introductory message is displayed, followed by a link to the URL you specify. The user must then click the link to initiate the transfer.

When a conversation is transferred from one channel to another, the session history and context are preserved, so the destination channel can continue the conversation from where it left off. Note that the message output that contains the Channel transfer response is processed first by the channel that initiates the transfer, and then by the target channel. If the output contains multiple responses (perhaps using different response types), these will be processed by both channels (before and after the transfer). If you want to target individual responses to specific channels, you can do so by editing the response using the JSON editor. For more information, see [Targeting specific integrations](https://cloud.ibm.com/docs/assistant?topic=assistant-dialog-responses-jsondialog-responses-json-target-integrations).





 Adding an Image response type 

Sometimes a picture is worth a thousand words. Include images in your response to do things like illustrate a concept, show off merchandise for sale, or maybe to show a map of your store location.

To add an Image response type, complete the following steps:



1. Choose Image.
2. Add the full URL to the hosted image file into the Image source field.

The image must be in .jpg, .gif, or .png format. The image file must be stored in a location that is publicly addressable by an https: URL.

For example: https://www.example.com/assets/common/logo.png.

If you want to display an image title and description above the embedded image in the response, then add them in the fields provided.
Tutorial: Customizing the size and position of the web chat 

This tutorial shows how you can change the size and position of the web chat by rendering it in a custom element.

For a complete, working version of the example described in this tutorial, see [Custom elements for Watson Assistant web chat](https://github.com/watson-developer-cloud/assistant-toolkit/tree/master/integrations/webchat/examples/custom-element).

By default, the web chat interface on your website is rendered in a host div element that is styled to appear in a fixed location on the page. If you want to change the size or position of the web chat, you can specify a custom element as the host location for the web chat. This host element is used as the location for both the main web chat interface and for the web chat launcher (unless you are using a custom launcher).

When you use a custom element, you also take control of showing and hiding the web chat when it is opened or closed (such as when the customer clicks the launcher icon or the minimize button). This gives you the opportunity to apply additional effects, such as opening and closing animations. You can control showing and hiding the main window by using the [addClassName() and removeClassName()](https://web-chat.global.assistant.watson.cloud.ibm.com/docs.html?to=api-instance-methodselements-get-main-window) functions.

To use a custom element, follow these steps:



1. In your website code, define the custom element where you want the web chat to be rendered. There are many ways of doing this, depending on the framework you are using. A simple example is to define an empty HTML element with an ID:

<div id="WebChatContainer"></div>
2. Get a reference to your custom element so you can reference it in the web chat configuration. To get a reference, use whatever mechanism makes sense for the library you are using. For example, you can save the reference returned from document.createElement(), or you can use a query function to look up the element in the DOM.
<div id="WebChatContainer"></div>
2. Get a reference to your custom element so you can reference it in the web chat configuration. To get a reference, use whatever mechanism makes sense for the library you are using. For example, you can save the reference returned from document.createElement(), or you can use a query function to look up the element in the DOM. This example looks up the element using the ID we assigned to it:

const customElement = document.querySelector('WebChatContainer');
3. In the web chat embed script, set the element property, specifying the reference to your custom element.

window.watsonAssistantChatOptions = {
integrationID: "YOUR_INTEGRATION_ID",
region: "YOUR_REGION",
serviceInstanceID: "YOUR_SERVICE_INSTANCE_ID",

// The important piece.
element: customElement,

onLoad: function(instance) {
instance.render();
}
};
4. Make sure that the main web chat window is hidden by default. You can do this in the onLoad event handler, after render has been called. You must also add handlers to listen for the window:open and window:close events so the customer can open and close the web chat after the page loads. In our example, we are using a CSS class called HideWebChat to do this (see the [full example](https://github.com/watson-developer-cloud/assistant-toolkit/blob/master/integrations/webchat/examples/custom-element/client/javascript-animation/index.html) for the definition of this class):

function onLoad(instance) {
instance.render();
instance.on({ type: 'window:close', handler: closeHandler });
instance.on({ type: 'window:open', handler: openHandler });
instance.elements.getMainWindow().addClassName('HideWebChat');