Subgraphs

What are Subgraphs?#

A subgraph is simply a graph used as a node inside another graph. Think of it as encapsulation for LangGraph: each subgraph is a self-contained unit that can be combined to build larger, more complex systems.

When should I use this?#

Subgraphs are useful when you need to structure a graph into smaller, reusable pieces. They let you build multi-agent systems, reuse node sets across multiple graphs, and let different teams develop separate parts of a graph independently.

How does CopilotKit support this?#

CopilotKit supports streaming directly from subgraphs, so nested graphs can emit events in real time just like a single graph.

Using this feature requires no extra steps on the agent side. All you need to do is subscribe to the agent state in your frontend:

import { injectAgentStore } from "@copilotkit/angular";

export class AgentStatusComponent {
  readonly store = injectAgentStore("sample_agent");

  // Read this.store().state() in the template or another computed signal.
  // Subgraph streaming updates it automatically.
}

The subgraph nodes will stream as usual, and you can also use interrupt() directly from a subgraph.