How to render the ChatKit widgets from MCP tools?

API
,
1

I created a new workflow using AgentKit. In the “Tools” section, I added an MCP server. For each tool exposed by that server, I created a widget and linked it in the popup. However, when I go to “Preview” and run the workflow, it continues to give me text-based responses. I even tried changing output mode on the Agent node and that just blurted out a json response. Furthermore, I tried cloning the sample chatkit embedding NextJS repo – same issue, it just gives me the JSON response without actually rendering the widgets!

2

Welcome to the forum.

You need to change the output (and upload your widget) in the agent that calls the mcp:

image
image516×773 26.7 KB

Preview:

image
image1166×623 33.6 KB

Chatkit:

image
image1322×536 24.8 KB

In case you have different mcp servers and/or widgets, you might need to add also an orchestrator to triage the request towards the correct agent.

3

I have multiple tools though in the same mcp server and I need to define the widget per tool. Is that not possible?

4

I think it is possible. But since you can only choose one widget as output per agent, you would need a classifier and an if node with a different agent+widget on each output type.

5

I see, but out of curiosity: when you add MCP server as a tool on the Agent node, it lets you select a widget per row but that doesn’t get used, so what is that widget field there for and where is it used?

image
image1018×262 9.16 KB

6

Nice find, I totally missed that. Makes a lot more sense.
I was able to retrieve the first widget, but not the other one when using the latest chatkit example. The preview failed on both.

image
image712×166 5.39 KB

image
image1147×695 21.5 KB

7

I even have a lot of errors when displaying a showcased chatkit, they have too many bugs

8

I reached out to support a few days ago and they told me this:

Thank you for reaching out to OpenAI Support.

We understand how it can be confusing to see your tool returning structured content correctly, only for the Agent to respond with plain text instead of rendering the assigned widget. You’ve clearly set things up with care, and we appreciate you highlighting the issue.

After reviewing this behavior, we can confirm that it is not a bug, but rather a current limitation of the Agent Builder system. While you can map widgets to individual MCP tools, the platform does not yet support rendering different widgets dynamically within the same Agent node based on which tool is called. Instead, widget rendering is tied to the overall Agent output, meaning only one widget can be assigned at a time at the node level.

We recognize that this behavior may feel unintuitive, especially since the UI allows tool-level widget assignment. We’ve shared your feedback with the product team, as enabling more flexible, per-tool widget rendering is a request we’ve heard from other users as well.

We apologize for the inconvenience, and thank you for understanding.