Skip to main content

Overview

The Chat component creates an AI-powered assistant that can answer questions based on your study materials. It supports web search, RAG (Retrieval Augmented Generation), and multi-step reasoning.

Creating a Chat Component

Configuration Parameters

name
string
required
Name of the chat component
type
string
required
Must be "chat"
config
object
required
Chat configuration object

Response

Adding Guardrails

Guardrails allow you to apply server-side content policy rules to AI responses. When enabled, the AI’s responses are evaluated against your configured rules before being returned to the user.

Example: Academic Integrity Guardrails

Example: Safety and Content Moderation

Guardrail Actions Explained

  • BLOCK: Completely prevents the response and shows your custom message to the user
  • WARN: Allows the response but adds a warning message before or after it
  • MODIFY: Instructs the AI to revise its response to comply with the rule

Embedding This Component

Once you’ve created a Chat component, you can embed it on your website using the embedding API.

Generate Embed URL

Chat-Specific Embedding Features

Allow the chat to search the web for current information
features.enableHistory
boolean
default:"true"
Show conversation history and allow users to continue previous chats
features.enableVoice
boolean
default:"false"
Enable voice input for asking questions
features.enableFollowUps
boolean
default:"true"
Show suggested follow-up questions after responses
features.enableComponentCreation
boolean
default:"false"
Allow users to create other components (flashcards, tests) from chat
features.placeholderText
string
default:"Ask a question..."
Custom placeholder text for the chat input
features.enableWebSearchSources
boolean
default:"true"
Show web search sources when web search is used
features.enableImageSources
boolean
default:"true"
Display image sources in responses when relevant
features.enableBadWordsFilter
boolean
default:"true"
required
Enable filtering of inappropriate language (required)
features.enablePromptingScore
boolean
default:"false"
Enable prompting quality scoring for user messages (1-4 scale)
features.enableResponsibilityScore
boolean
default:"false"
Enable responsibility scoring for user messages (1-4 scale)
features.enableReferenceMode
boolean
default:"false"
Show reference titles and URLs instead of source content in citations
features.enableGuardrails
boolean
default:"false"
Apply guardrail rules configured on the component to embedded chat
features.enableOutline
boolean
default:"false"
Enable document outline navigation (for document-based components)
features.enableTranscript
boolean
default:"false"
Enable transcript view (for video/audio-based components)

Embed in Your HTML

Streaming Chat Responses

The Chat API supports real-time streaming responses using Server-Sent Events (SSE). This allows you to display responses as they’re generated, providing a more interactive experience.

Stream Chat Response

Stream Parameters

componentId
string
ID of the chat component to use
sessionId
string
Session ID to maintain conversation context
userId
string
User ID for tracking and personalization
groupIds
array
Array of group IDs for access control
context
object
Additional context to pass to the chat
messages
array
Messages array for AI SDK format. Each message should have:
  • role: “system”, “user”, or “assistant”
  • content: The message content
message
object
Single message for custom format

Stream Response Format

The streaming endpoint returns Server-Sent Events (SSE) with the following event types:

Example: Building a Streaming Chat Interface

Managing Chat Embed Context

The context API allows you to dynamically push contextual information to specific embedded chat instances. This is particularly useful for applications where the chat component remains persistent while the surrounding content changes, such as:
  • Practice Tests: Update context as users navigate between questions
  • Multi-page Tutorials: Provide page-specific context without resetting chat history
  • Dynamic Content: Keep the AI informed about what the user is currently viewing

Push Context

Add context information to an embedded chat component:

Retrieve Context

Get the current context for an embedded chat component:

Clear Context

Clear all context from an embedded chat component:

Complete Example: Practice Test with Context

Here’s a complete example of using context management in a practice test application:

Context API Parameters

token
string
required
The embed token for the specific chat instance. Obtained from generateEmbed() response.
context
string
required
The context string to add to the chat. Can include any relevant information about what the user is currently viewing or doing.

Retrieving Chat Feedback

You can retrieve feedback data (thumbs up/down) from users interacting with your chat components:

Feedback Parameters

componentId
string
Filter feedback by specific component ID
userId
string
Filter feedback by specific user ID
startDate
string
Start date for feedback range (ISO 8601 format)
endDate
string
End date for feedback range (ISO 8601 format)
feedbackType
enum
Filter by feedback type:
  • thumbsUp - Positive feedback
  • thumbsDown - Negative feedback
limit
string
default:"100"
Number of records to return
skip
string
default:"0"
Number of records to skip (for pagination)

Retrieving Feedback Context

Get the specific message and full conversation for a feedback item to understand the context of user feedback:

Feedback Context Parameters

feedbackId
string
required
The ID of the feedback item to retrieve context for