copilotkit-integrations
CopilotKit Integrations — практический навык для подключения внешнего agent framework к приложению на CopilotKit через протокол AG-UI. В исходном SKILL.md AG-UI описан как потоковый протокол двустороннего обмена между пользовательским интерфейсом и агентом. Типовая схема состоит из четырёх частей: сервер агента, адаптер AG-UI, runtime CopilotKit и фронтенд. Сервер запускает выбранный framework как HTTP-сервис; для Python это обычно FastAPI или uvicorn, а для JavaScript и TypeScript — маршрут Express или Next.js. Адаптер переводит собственный интерфейс framework в wire-протокол AG-UI. Runtime создаёт CopilotRuntime, соединяет приложение с агентом через подходящий AG-UI client и подключается к catch-all API route Next.js через V2 multi-route Hono handler. На фронтенде React-компоненты получают агентские возможности через хуки CopilotKit. Навык охватывает несколько вариантов интеграции. Для LangGraph предусмотрены отдельные клиенты для Python self-hosted, LangGraph Platform и JavaScript. CrewAI разделён на Flows и Crews. Также описаны PydanticAI, Mastra, Google ADK, LlamaIndex, Agno, Strands и Microsoft Agent Framework для Python или .NET. Для распределённых сценариев выделен A2A Middleware, а MCP Apps подключаются как middleware поверх BuiltInAgent. Выбор не сводится к одному универсальному импорту: для TypeScript или JavaScript сначала нужно определить, используется ли Mastra или LangGraph JS; для остальных JS-сценариев исходник указывает BuiltInAgent с MCP Apps middleware либо общий HttpAgent. Для Python и .NET отправной точкой служит конкретный framework, а при нескольких агентах — A2A. На клиентской стороне навык показывает общий набор CopilotKit v2: провайдер CopilotKit, useAgent для доступа к агенту и его shared state, useFrontendTool для вызова фронтенд-инструментов, useRenderTool для generative UI и useHumanInTheLoop для действий с участием пользователя. Состояние на стороне агента зависит от framework, но через AG-UI передаётся одинаковым способом: агент отправляет события STATE_SNAPSHOT, после чего интерфейс обновляет состояние. Для API и UI используются @copilotkit/react-core/v2, @copilotkit/runtime/v2 и соответствующий клиент из @copilotkit/runtime/langgraph, @ag-ui/client, @ag-ui/crewai, @ag-ui/mastra, @ag-ui/llamaindex, @ag-ui/a2a-middleware или @ag-ui/mcp-apps-middleware. Практическая ценность навыка — в выборе связки и границ ответственности до написания кода: какой сервер поднимает агент, какой адаптер предоставляет AG-UI, какой client импортируется в route.ts и как фронтенд получает поток, состояние, инструменты и подтверждения пользователя. Это подходит для чатов поверх LangGraph, CrewAI или PydanticAI, для подключения Mastra и Google ADK, для отображения результатов агента в React и для сценариев human-in-the-loop. Ограничение важно учитывать заранее: SKILL.md не заменяет документацию конкретного framework и отсылает к отдельным integration guides; запущенный HTTP-сервер агента, совместимый адаптер и согласованный client остаются обязательными частями рабочей конфигурации.
Для чего подходит
- Интеграция agent framework с CopilotKit
- Настройка AG-UI streaming и state sync
- Подключение human-in-the-loop и MCP Apps
Установка
Сначала прочитайте SKILL.md и scripts в исходном репозитории. Затем выполните команду в каталоге проекта:
npx skills add https://github.com/CopilotKit/CopilotKit/tree/main/skills/copilotkit-integrations