Authorization
API Resources
NL Interpreter
Search
Assist
Generative Ai
Generative AI
This component displays an AI-generated answer that is shown when the user makes a query. It includes a disclaimer message that shows when the user hovers over an info icon and tells the user that the answer has been generated by an AI.
Optionally, a consent dialog is displayed before an AI answer can be shown. The dialog can include links displayed beneath the dialog, a message, and buttons allowing the user to accept or decline their consent. If the user accepts, an AI-generated answer can be returned. If the user declines, this component will not work. User consent must be asked every time there is a new session.
You can also choose to display the AI-generated answer in chunks, so it looks like the answer is being streamed.
Component image
This is what the Generative AI component looks like:
AI-generated answer
Consent dialog
Usage
This is how you create the component:
sdk.component('generative-ai-response', target: HTMLElement|String, options: Object);Options
| Name | Type | Default | Description |
|---|---|---|---|
| enable | Boolean | false | Enable or disable Generative AI responses. |
| consent | Object | Configure the consent dialog. | |
| consent.enable | Boolean | false | Enable or disable the consent dialog. |
| consent.title | String | [consent prompt title] | The title of the consent dialog. |
| consent.body | String | "" | The text displayed in the consent dialog. Allows sanitized HTML. |
| consent.acceptButton | String | "" | Label for the accept button |
| consent.declineButton | String | "" | Label for the decline button |
| consent.links | Array of links | "" | Optional |
| consent.links[].text | String | "" | The link text |
| consent.links[].url | String | "" | The link URL |
| disclaimer | Object String | "" | Disclaimer message shown when user hovers over the info icon |
| errors | Object String | {notResponse => 'Error message'} | Contains the error message shown if an answer cannot be retrieved. |
| charsPerChunk | Number | 3 | Sets the maximum number of characters displayed in a chunk. If there aren't enough characters to reach the maximum, the remaining characters will be displayed. |
| delayOnChunk | Number | 50 | Sets the time delay in milliseconds before the next chunk is displayed. |
| context.enable | Boolean | false | Enable to display the context used to generate the answer. |
| context.answer.enable | Boolean | false | Enable to also display a sample of the answer context. |
| context.showTotal | Boolean | false | Enable to display a message counting the total number of sources used to generate the answer. |
Methods
The following methods can be used in this component:
| Name | Description |
|---|---|
| linkTo(component: Component) | Use this method to link to other components, including the search-box component. When components are created using the sdk.build method, they are automatically linked. If you manually create the components, you also need to link them manually. |
| generateAnswer(userQuestion: String, questionTrackingCode: String, options: Object) | Use this method to return an AI-generated response to a user query, based on the search results matching that query. |
| trackUserQuestion(userQuestion: String) | Use this method to obtain the log ID of the user query, which is used as for the questionTrackingCode parameter in generateAnswer. |
Events
Events to listen on this component.
| Name | Data | Description |
|---|---|---|
| contextClick |
```js
{
"title": |
Sent when the user clicks on a context URL. It returns data about the content from the GenAI source that is used as context. * Content title * Content answer (if applicable) * Content URL |
Tracking
Generative AI responses use the GENERATIVE_AI_ANSWER external tracking type.
Example
This is a configuration that can be passed to the component:
{
//Enables or disables the Generative AI
"enable": true,
"consent": {
//Enables or disables the consent dialog
"enable": true,
//Consent dialog body text
"body": "Do you accept the use of Generative AI to generate responses to your questions? <a href=\"https://inbenta.com\" target=\"_blank\">Learn more about how we use GenAI</a>.",
//Accept button label
"acceptButton": "Accept",
//Decline button label
"declineButton": "Decline",
//Optional. Links shown next to the dialog.
"links": [
{
"text": "Acme",
"url": "https://acme.com"
}
]
},
//Disclaimer text that displays when you hover over the info icon
"disclaimer": {
"body": "This answer was generated by AI"
},
//Error message shown if an AI response cannot be returned.
"error": {
"notResponse": "Sorry, I don’t have a response for your query."
},
// Set the number of characters per chunk
"charsPerChunk": 3,
// Set the time delay in milliseconds before the next chunk is displayed
"delayOnChunk": 50
}