Interactive components

Create approval flows where the agent pauses and waits for human input.


Not supported on LangGraph (Python)
LangGraph (Python) doesn't support Human in the Loop: Interrupts. See the framework grid for which integrations support this feature.

What is this?#

Interactive generative UI creates flows where the agent pauses execution and waits for user input before continuing. This enables approval workflows, confirmation dialogs, and any scenario where human judgment is needed mid-execution.

When should I use this?#

Use interactive generative UI when you need:

  • Approval/rejection flows (e.g. "Run this command?")
  • User decisions that the agent should know about
  • Confirmation dialogs with structured responses
  • Any flow where the agent pauses for human judgment

How it works in code#

Install the LangGraph Python SDK

uv add copilotkit
poetry add copilotkit
pip install copilotkit --extra-index-url https://copilotkit.gateway.scarf.sh/simple/
conda install copilotkit -c copilotkit-channel

Wire CopilotKit middleware into your graph

For useHumanInTheLoop tool-based HITL, the tool is defined entirely on the frontend and forwarded to the agent. CopilotKitMiddleware is what forwards it — drop it into your create_agent call.

frontend_tools.py
from langchain.agents import create_agent
from langchain_openai import ChatOpenAI
from copilotkit import CopilotKitMiddleware

graph = create_agent(
    model=ChatOpenAI(model="gpt-5.4"),
    tools=[],
    middleware=[CopilotKitMiddleware()],
    system_prompt="You are a helpful, concise assistant.",
)

For the useInterrupt graph-paused pattern, you'll also use LangGraph's native interrupt(...) primitive inside a graph node — no extra CopilotKit setup beyond the middleware above.

On the frontend, register an interrupt renderer with useInterrupt. When the agent pauses, your component mounts inline in the chat, captures the user's choice, and resumes the run with that input.

Not supported on LangGraph (Python)
LangGraph (Python) doesn't support Human in the Loop: Interrupts. See the framework grid for which integrations support this feature.

On the backend, the agent calls into the interrupt primitive and waits for the resumed response before continuing the graph.

Not supported on LangGraph (Python)
LangGraph (Python) doesn't support Human in the Loop: Interrupts. See the framework grid for which integrations support this feature.