packages question

[Hiraveb]

To use following packages and v2 UI design system:

"@copilotkit/react-core": "1.51.2",
"@copilotkit/react-ui": "1.51.2",
"@copilotkit/runtime": "1.51.2" and in backend copilotkit 0.1.78,

do we need to use:
"@ag-ui/client": "^0.0.42",
"@ag-ui/langgraph": "0.0.18", and from ag_ui_langgraph import add_langgraph_fastapi_endpoint

[copilotkit-support-bot]

Yes. To use the v2 UI (CoAgents) with those package versions, you need the @Ag-ui packages on the frontend and the Python integration on the backend. Specifically, @ag-ui/client (and sometimes @ag-ui/langgraph) on the frontend, and ag_ui_langgraph with add_langgraph_fastapi_endpoint on the backend.

Details

To use the v2 UI design system (CoAgents) with the specified package versions (1.51.2), you do need to use the @ag-ui packages and the Python integration.

These packages are part of the underlying architecture for CoAgents, which powers the v2 UI features, agent state synchronization, and human-in-the-loop interactions.

1. Frontend Requirements

On the frontend, @ag-ui/client is required because the v2 hooks (like useAgent) and components depend on it for agent subscriptions and protocol handling.

• Package: @ag-ui/client (and occasionally @ag-ui/langgraph if you are using specific frontend LangGraph types/utilities).
• Usage: It is typically used alongside the /v2 entry points of CopilotKit.

  import { useAgent } from "@copilotkit/react-core/v2";
  import type { AgentSubscriber } from "@ag-ui/client"; // Required for types/logic

2. Backend Requirements (Python)

For a LangGraph-powered backend using the v2 architecture, the ag_ui_langgraph package is essential to expose your graph to the CopilotKit Runtime.

• Function: add_langgraph_fastapi_endpoint
• Why: This function wraps your LangGraph instance and creates the necessary FastAPI routes that the CopilotKit Runtime communicates with via the new protocol.
• Example Integration:

  from fastapi import FastAPI
  from copilotkit import LangGraphAGUIAgent
  from ag_ui_langgraph import add_langgraph_fastapi_endpoint
  from .agent import graph
  
  app = FastAPI()
  
  add_langgraph_fastapi_endpoint(
      app=app,
      agent=LangGraphAGUIAgent(
          name="sample_agent",
          graph=graph,
      ),
      path="/copilotkit",
  )

Summary of required packages:

• Frontend:
  • npm install @ag-ui/client
• Backend (Python):
  • pip install ag-ui-langgraph
  • pip install copilotkit==0.1.78

Documentation References:

• LangGraph Quickstart (CoAgents/v2)
• useAgent Hook Reference

Confidence Assessment: High (These packages are the bridge between the traditional CopilotKit and the new CoAgents/v2 system).

---

Was this helpful?

If this solution worked for you, please click on the appropriate option below to help us improve:

✅ This was helpful | ❌ Need more help