Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 16 additions & 7 deletions advanced-features/mcp.mdx
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
---
title: "MCP Servers"
title: "MCP"
description: Model Control Protocol (MCP) allows you to integrate external tool providers with your Chainlit application. This enables your AI models to use tools through standardized interfaces.
---

## Overview

MCP provides a mechanism for Chainlit applications to connect to either server-sent events (SSE) based services or command-line (stdio) based tools. Once connected, your application can discover available tools, execute them, and integrate their responses into your application's flow.
MCP provides a mechanism for Chainlit applications to connect to either server-sent events (SSE) or streamable HTTP based services, or command-line (stdio) based tools. Once connected, your application can discover available tools, execute them, and integrate their responses into your application's flow.

<Card
title="Chainlit MCP Cookbook"
Expand All @@ -31,10 +31,15 @@ We're working with companies to create their MCP stacks, enabling AI agents to c

## Connections Types

Chainlit supports two types of MCP connections:
| WebSockets | HTTP+SSE | Streamable HTTP | stdio |
| ---------- | -------- | --------------- | ----- |
| ❌ | ✅ | ✅ | ✅ |

Chainlit supports three types of MCP connections:

1. **SSE (Server-Sent Events)**: Connect to a remote service via HTTP
2. **stdio**: Execute a local command and communicate via standard I/O
2. **Streamable HTTP**: Send HTTP requests to a server and receive JSON responses or connect using SSE streams
3. **stdio**: Execute a local command and communicate via standard I/O

> ⚠️ **Security Warning**: The stdio connection type spawns actual subprocesses on the Chainlit server. Only use this with trusted commands in controlled environments. Ensure proper validation of user inputs to prevent command injection vulnerabilities.

Expand All @@ -44,7 +49,7 @@ Chainlit supports two types of MCP connections:

You can control which MCP connection types are enabled globally and restrict allowed stdio commands by modifying your project's `config.toml` file (usually located at the root of your project or `.chainlit/config.toml`).

Under the `[features.mcp]` section, you can configure SSE and stdio separately:
Under the `[features.mcp]` section, you can configure SSE, Streamable HTTP and stdio separately:

```toml
[features]
Expand All @@ -54,6 +59,10 @@ Under the `[features.mcp]` section, you can configure SSE and stdio separately:
# Enable or disable the SSE connection type globally
enabled = true

[features.mcp.streamable-http]
# Enable or disable the Streamable HTTP connection type globally
enabled = true

[features.mcp.stdio]
# Enable or disable the stdio connection type globally
enabled = true
Expand Down Expand Up @@ -92,8 +101,8 @@ async def on_mcp_disconnect(name: str, session: ClientSession):
The client needs to provide the connection details through the Chainlit interface. This includes:

- Connection name (unique identifier)
- Client type (`sse` or `stdio`)
- For SSE: URL endpoint
- Client type (`sse`, `streamable-http` or `stdio`)
- For SSE and Streamable HTTP: URL endpoint
- For stdio: Full command (e.g., `npx your-tool-package` or `uvx your-tool-package`)

<Frame caption="Adding an MCP">
Expand Down
2 changes: 1 addition & 1 deletion api-reference/ask/ask-for-action.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ If a project ID is configured, the messages will be uploaded to the cloud storag
<ParamField path="timeout" type="int" optional default={90}>
The number of seconds to wait for an answer before raising a TimeoutError.
</ParamField>
<ParamField path="raise_on_timeout" type="bool" optional default="False">
<ParamField path="raise_on_timeout" type="bool" optional default={false}>
Whether to raise a socketio TimeoutError if the user does not answer in time.
</ParamField>

Expand Down
2 changes: 1 addition & 1 deletion api-reference/ask/ask-for-element.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ If a project ID is configured, the messages will be uploaded to the cloud storag
<ParamField path="timeout" type="int" optional default={90}>
The number of seconds to wait for an answer before raising a TimeoutError.
</ParamField>
<ParamField path="raise_on_timeout" type="bool" optional default="False">
<ParamField path="raise_on_timeout" type="bool" optional default={false}>
Whether to raise a socketio TimeoutError if the user does not answer in time.
</ParamField>

Expand Down
2 changes: 1 addition & 1 deletion api-reference/ask/ask-for-file.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ If a project ID is configured, the messages will be uploaded to the cloud storag
<ParamField path="timeout" type="int" optional default={90}>
The number of seconds to wait for an answer before raising a TimeoutError.
</ParamField>
<ParamField path="raise_on_timeout" type="bool" optional default="False">
<ParamField path="raise_on_timeout" type="bool" optional default={false}>
Whether to raise a socketio TimeoutError if the user does not answer in time.
</ParamField>

Expand Down
2 changes: 1 addition & 1 deletion api-reference/ask/ask-for-input.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ If a project ID is configured, the messages will be uploaded to the cloud storag
<ParamField path="timeout" type="int" optional default={60}>
The number of seconds to wait for an answer before raising a TimeoutError.
</ParamField>
<ParamField path="raise_on_timeout" type="bool" optional default="False">
<ParamField path="raise_on_timeout" type="bool" optional default={false}>
Whether to raise a socketio TimeoutError if the user does not answer in time.
</ParamField>

Expand Down
2 changes: 1 addition & 1 deletion api-reference/step-class.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ The `Step` class is a Python Context Manager that can be used to create steps in
https://react-code-blocks-rajinwonderland.vercel.app/?path=/story/codeblock--supported-languages
for a list of supported languages.
</ParamField>
<ParamField path="show_input" type="Union[bool, str]" default="False" optional>
<ParamField path="show_input" type="Union[bool, str]" default={false} optional>
By default only the output of the step is shown. Set this to `True` to also
show the input. You can also set this to a language like `json` or `python` to
syntax highlight the input.
Expand Down
2 changes: 1 addition & 1 deletion api-reference/step-decorator.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ Under the hood, the step decorator is using the [cl.Step](/api-reference/step-cl
https://react-code-blocks-rajinwonderland.vercel.app/?path=/story/codeblock--supported-languages
for a list of supported languages.
</ParamField>
<ParamField path="show_input" type="Union[bool, str]" default="False" optional>
<ParamField path="show_input" type="Union[bool, str]" default={false} optional>
By default only the output of the step is shown. Set this to `True` to also
show the input. You can also set this to a language like `json` or `python` to
syntax highlight the input.
Expand Down
95 changes: 73 additions & 22 deletions backend/config/features.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,60 +2,111 @@
title: Features
---

### Options
## Options

<ParamField path="unsafe_allow_html" type="bool" default={false}>
Process and display HTML in messages. This can be a security risk (see
https://stackoverflow.com/questions/19603097/why-is-it-dangerous-to-render-user-generated-html-or-javascript).
</ParamField>

<ParamField path="edit_message" type="bool" default={true}>
Allow the user to edit their messages.
</ParamField>

<ParamField path="latex" type="bool" default={false}>
Process and display mathematical expressions. This can clash with "$"
characters in messages.
</ParamField>
### File Upload

<ParamField path="spontaneous_file_upload.enabled" type="bool" default={true}>
<ParamField path="spontaneous_file_upload.enabled" type="bool" optional>
Authorize users to upload files with messages. The files are then accessible
in [cl.on_message](/api-reference/lifecycle-hooks/on-message).
</ParamField>

<ParamField
path="spontaneous_file_upload.accept"
type="Union[List[str], Dict[str, List[str]]]"
default={["*/*"]}
optional
>
Restrict user to only upload accepted mime file types. Example: ["text/plain",
"application/pdf", "image/x-png"]
</ParamField>

<ParamField path="spontaneous_file_upload.max_files" type="int" default={20}>
<ParamField path="spontaneous_file_upload.max_files" type="int" optional>
Restrict user to upload maximum number of files at a time.
</ParamField>

<ParamField path="spontaneous_file_upload.max_size_mb" type="int" default={500}>
<ParamField path="spontaneous_file_upload.max_size_mb" type="int" optional>
Restrict uploading file size (MB).
</ParamField>

<ParamField path="auto_tag_thread" type="bool">
### Audio

<ParamField path="audio.enabled" type="bool" default={false}>
Restrict uploading file size (MB).
</ParamField>

<ParamField path="audio.sample_rate" type="int" default={24000}>
Audio sample rate in hertz. Defaults to 24kHz
</ParamField>

### MCP

See [MCP server-side configuration](/advanced-features/mcp#server-side-configuration-config-toml)

### Slack

See [Slack integration documentation](/deploy/slack)

### Other

<ParamField path="latex" type="bool" default={false}>
Process and display mathematical expressions. This can clash with "$"
characters in messages.
</ParamField>

<ParamField path="user_message_autoscroll" type="bool" default={true}>
Autoscroll new user messages at the top of the window.
</ParamField>

<ParamField path="unsafe_allow_html" type="bool" default={false}>
Process and display HTML in messages. This can be a security risk (see
https://stackoverflow.com/questions/19603097/why-is-it-dangerous-to-render-user-generated-html-or-javascript).
</ParamField>

<ParamField path="auto_tag_thread" type="bool" default={true}>
Automatically tag threads with the current chat profile (if a chat profile is
used)
</ParamField>

### Default configuration
<ParamField path="edit_message" type="bool" default={true}>
Allow the user to edit their messages.
</ParamField>

## Default configuration

```toml
[features]
edit_message = true
# Process and display HTML in messages. This can be a security risk (see https://stackoverflow.com/questions/19603097/why-is-it-dangerous-to-render-user-generated-html-or-javascript)
unsafe_allow_html = false

# Process and display mathematical expressions. This can clash with "$" characters in messages.
latex = false

# Autoscroll new user messages at the top of the window
user_message_autoscroll = true

# Automatically tag threads with the current chat profile (if a chat profile is used)
auto_tag_thread = true

# Allow users to edit their own messages
edit_message = true

# Authorize users to spontaneously upload files with messages
[features.spontaneous_file_upload]
enabled = true
# Define accepted file types using MIME types
# Examples:
# 1. For specific file types:
# accept = ["image/jpeg", "image/png", "application/pdf"]
# 2. For all files of certain type:
# accept = ["image/*", "audio/*", "video/*"]
# 3. For specific file extensions:
# accept = {{ "application/octet-stream" = [".xyz", ".pdb"] }}
# Note: Using "*/*" is not recommended as it may cause browser warnings
accept = ["*/*"]
max_files = 20
max_size_mb = 500
auto_tag_thread = true

[features.audio]
# Sample rate of the audio
sample_rate = 24000
```
46 changes: 24 additions & 22 deletions backend/config/project.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,50 +2,52 @@
title: Project
---

### Options

<ParamField path="enable_telemetry" type="bool" default={true}>
Whether to enable telemetry (default: true). No personal data is collected.
</ParamField>
## Options

<ParamField path="allow_origins" type="List[str]" default={["*"]}>
Authorized origins to access the app/copilot.
</ParamField>

<ParamField path="user_env" type="List[str]" default={[]}>
List of environment variables to be provided by each user to use the app.
<ParamField path="transports" type="List[str]" optional>
Socket.io client transports option
</ParamField>

<ParamField path="session_timeout" type="int" default={3600}>
Duration (in seconds) during which the session is saved when the connection is
lost
<ParamField path="user_env" type="List[str]" optional>
List of environment variables to be provided by each user to use the app. If empty, no environment variables will be asked to the user.
</ParamField>

<ParamField path="cache" type="bool" default={false}>
Enable third parties caching (e.g LangChain cache)
<ParamField path="lc_cache_path" type="str" optional>
Path to the local langchain cache database
</ParamField>

<ParamField path="session_timeout" type="int" default={300}>
Duration (in seconds) during which the session is saved when the connection is lost
</ParamField>

<ParamField path="follow_symlink" type="bool" default={false}>
Follow symlink for asset mount (see
https://github.com/Chainlit/chainlit/issues/317)
<ParamField path="user_session_timeout" type="int" default={1296000}>
Duration (in seconds) of the user session expiry. 15 days by default
</ParamField>

### Default configuration
<ParamField path="cache" type="bool" default={false}>
Enable third parties caching (e.g LangChain cache)
</ParamField>

## Default configuration

```toml
[project]
# Whether to enable telemetry (default: true). No personal data is collected.
enable_telemetry = true

# List of environment variables to be provided by each user to use the app.
user_env = []

# Duration (in seconds) during which the session is saved when the connection is lost
session_timeout = 3600

# Enable third parties caching (e.g LangChain cache)
# Duration (in seconds) of the user session expiry
user_session_timeout = 1296000 # 15 days

# Enable third parties caching (e.g., LangChain cache)
cache = false

# Follow symlink for asset mount (see https://github.com/Chainlit/chainlit/issues/317)
# follow_symlink = false
# Authorized origins
allow_origins = ["*"]
```
4 changes: 2 additions & 2 deletions backend/config/ui.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: UI
---

### Options
## Options

<ParamField path="name" type="str" default="'Assistant'">
The name of both the application and the chatbot.
Expand Down Expand Up @@ -90,7 +90,7 @@ title: UI
</ParamField>


### Default configuration
## Default configuration

```toml
[UI]
Expand Down
Loading