[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6C5EVQW0SAAFQAE2DP4D0FG":3,"skill-same:01M6C5EVQW0SAAFQAE2DP4D0FG":118},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":34,"publishedAt":54,"linkOnly":55,"markdownContent":56,"markdownBody":57,"frontMatter":58,"refName":63,"commitSha":64,"skillDirectory":65,"forksCount":14,"repositoryHtmlUrl":66,"repositoryHomepageUrl":6,"ownerHtmlUrl":67,"ownerBlogUrl":68,"ownerDescription":6,"updatedAt":69,"install":70,"resources":83},"01M6C5EVQW0SAAFQAE2DP4D0FG","copilotkit",null,"Build AI copilots, chatbots, and agentic UIs in React and Next.js using CopilotKit. Use this skill when the user wants to add an AI assistant, copilot, chat interface, AI-powered textarea, or agentic UI to their app. Covers setup, hooks (useCopilotAction, useCopilotReadable, useCoAgent, useAgent), chat components (CopilotPopup, CopilotSidebar, CopilotChat), generative UI, human-in-the-loop, CoAgents with LangGraph, AG-UI protocol, MCP Apps, and Python SDK integration. Triggers on CopilotKit, copilotkit, useCopilotAction, useCopilotReadable, useCoAgent, useAgent, CopilotRuntime, CopilotChat, CopilotSidebar, CopilotPopup, CopilotTextarea, AG-UI, agentic frontend, in-app AI copilot, AI assistant React, chatbot React, useFrontendTool, useRenderToolCall, useDefaultTool, useCoAgentStateRender, useLangGraphInterrupt, useCopilotChat, useCopilotAdditionalInstructions, useCopilotChatSuggestions, useHumanInTheLoop, CopilotTask, copilot runtime, LangGraphAgent, BasicAgent, BuiltInAgent, CopilotKitRemoteEndpoint, A2UI, MCP Apps, AI textarea, AI form completion, add AI to React app.","CoralShades\u002Facm-ai","CoralShades","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F220297585?v=4","01M6C5211QSJHZ8HXSDDWCR507","Coral Shades AI Agency","01M6C52161FNQDRQ0FRR8DAA9D",0,"MIT","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002FSKILL.md",[18,23,26,29],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",{"categoryNo":24,"categoryName":25,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000010","后端与接口",{"categoryNo":27,"categoryName":28,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",{"categoryNo":30,"categoryName":31,"taxonomyType":32,"taxonomyTypeDesc":33},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[5,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53],"nextjs","hooks","use","python sdk","loop","human-in-the-loop","Next.js","angular","langgraph","frontend","ui","copilot","react","components","sdk","agentic","python","assistant","MCP","2026-11-10 10:12:30",false,"---\nname: copilotkit\ndescription: Build AI copilots, chatbots, and agentic UIs in React and Next.js using CopilotKit. Use this skill when the user wants to add an AI assistant, copilot, chat interface, AI-powered textarea, or agentic UI to their app. Covers setup, hooks (useCopilotAction, useCopilotReadable, useCoAgent, useAgent), chat components (CopilotPopup, CopilotSidebar, CopilotChat), generative UI, human-in-the-loop, CoAgents with LangGraph, AG-UI protocol, MCP Apps, and Python SDK integration. Triggers on CopilotKit, copilotkit, useCopilotAction, useCopilotReadable, useCoAgent, useAgent, CopilotRuntime, CopilotChat, CopilotSidebar, CopilotPopup, CopilotTextarea, AG-UI, agentic frontend, in-app AI copilot, AI assistant React, chatbot React, useFrontendTool, useRenderToolCall, useDefaultTool, useCoAgentStateRender, useLangGraphInterrupt, useCopilotChat, useCopilotAdditionalInstructions, useCopilotChatSuggestions, useHumanInTheLoop, CopilotTask, copilot runtime, LangGraphAgent, BasicAgent, BuiltInAgent, CopilotKitRemoteEndpoint, A2UI, MCP Apps, AI textarea, AI form completion, add AI to React app.\nlicense: MIT\nmetadata:\n  author: nihalnihalani\n  version: \"1.1\"\n  tags: copilotkit, ai, react, nextjs, copilot, chatbot, agent, agentic-ui, langgraph, coagents, ag-ui, mcp, angular\n---\n\n# CopilotKit\n\nFull-stack open-source framework (MIT, v1.51.3, Python SDK v0.1.78) for building agentic applications with AI copilots embedded directly in React and Angular UIs. Angular support via `@copilotkitnext\u002Fangular` (Angular 18+19). 28k+ GitHub stars.\n\n## When to Use This Skill\n- User wants to add an AI copilot, assistant, or chatbot to a React\u002FNext.js app\n- User is working with CopilotKit hooks, components, or runtime\n- User asks about AI-powered text areas or form completion\n- User needs to connect a Python agent (LangGraph\u002FCrewAI) to a React frontend\n- User is implementing human-in-the-loop or generative UI patterns\n- User asks about AG-UI protocol or MCP Apps\n- User wants to sync state between a UI and an AI agent\n\n## Architecture\n\n```\n┌─────────────────────────────────────────────────────────────────┐\n│                                                                 │\n│   F R O N T E N D    @copilotkit\u002Freact-core + react-ui          │\n│                                                                 │\n│   ┌──────────────────┐  ┌──────────────────┐  ┌──────────────┐ │\n│   │  \u003CCopilotPopup>  │  │ \u003CCopilotSidebar> │  │ \u003CCopilotChat>│ │\n│   │  \u003CCopilotTextarea>│  │   Headless UI    │  │  Custom UI   │ │\n│   └────────┬─────────┘  └────────┬─────────┘  └──────┬───────┘ │\n│            └──────────────┬──────┘                    │         │\n│                           ▼                           │         │\n│   ┌───────────────────────────────────────────────────┘         │\n│   │  React Hooks                                                │\n│   │  ├─ useCopilotAction()       → Define callable tools        │\n│   │  ├─ useCopilotReadable()     → Expose app state to LLM     │\n│   │  ├─ useAgent()               → Bidirectional state (v2)    │\n│   │  ├─ useFrontendTool()        → Generative UI rendering     │\n│   │  ├─ useCopilotChat()         → Headless chat control       │\n│   │  └─ useLangGraphInterrupt()  → Human-in-the-loop           │\n│   └─────────────────────────┬───────────────────────────────────│\n│                             │                                   │\n└─────────────────────────────┼───────────────────────────────────┘\n                              │\n                    ┌─────────▼─────────┐\n                    │    AG-UI Protocol  │\n                    │  (HTTP event stream│\n                    │   17 event types)  │\n                    └─────────┬─────────┘\n                              │\n┌─────────────────────────────┼───────────────────────────────────┐\n│                             │                                   │\n│   B A C K E N D    @copilotkit\u002Fruntime                          │\n│                             ▼                                   │\n│   ┌─────────────────────────────────────────────────────────┐   │\n│   │  CopilotRuntime                                         │   │\n│   │  ┌──────────────┐ ┌───────────────┐ ┌────────────────┐ │   │\n│   │  │ LLM Adapters │ │ Backend       │ │ Thread         │ │   │\n│   │  │ OpenAI       │ │ Actions       │ │ Persistence    │ │   │\n│   │  │ Anthropic    │ │ (server-side  │ │ InMemory \u002F     │ │   │\n│   │  │ Google       │ │  tools)       │ │ SQLite         │ │   │\n│   │  │ Groq         │ │               │ │                │ │   │\n│   │  └──────────────┘ └───────────────┘ └────────────────┘ │   │\n│   │  ┌──────────────────────────────────────────────────┐   │   │\n│   │  │ Agent Router                                     │   │   │\n│   │  │ ├─ BuiltInAgent   (direct LLM + middleware)      │   │   │\n│   │  │ ├─ BasicAgent     (lightweight, no middleware)    │   │   │\n│   │  │ └─ CustomHttpAgent (remote Python\u002FJS agents) ────┼───┼─┐ │\n│   │  └──────────────────────────────────────────────────┘   │ │ │\n│   └─────────────────────────────────────────────────────────┘ │ │\n│                                                               │ │\n└───────────────────────────────────────────────────────────────┼─┘\n                                                                │\n                    ┌───────────────────┐                       │\n                    │    AG-UI \u002F HTTP    │◄──────────────────────┘\n                    └─────────┬─────────┘\n                              │\n┌─────────────────────────────┼───────────────────────────────────┐\n│                             ▼                                   │\n│   A G E N T   L A Y E R   (optional, any AG-UI framework)      │\n│                                                                 │\n│   Python: copilotkit SDK v0.1.78 + FastAPI \u002F Flask              │\n│                                                                 │\n│   ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐  │\n│   │ LangGraph  │ │  CrewAI    │ │ Google ADK │ │ AWS Strands│  │\n│   └────────────┘ └────────────┘ └────────────┘ └────────────┘  │\n│   ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐  │\n│   │  Mastra    │ │ PydanticAI │ │    AG2     │ │ LlamaIndex │  │\n│   └────────────┘ └────────────┘ └────────────┘ └────────────┘  │\n│                                                                 │\n│   Protocols:  AG-UI (↔ user)  ·  MCP (↔ tools)  ·  A2A (↔ agents)│\n│                                                                 │\n└─────────────────────────────────────────────────────────────────┘\n```\n\n## Quick Start\n\n### New project\n```bash\nnpx copilotkit@latest create -f next\n```\n\n### Existing project\n```bash\nnpm install @copilotkit\u002Freact-core @copilotkit\u002Freact-ui @copilotkit\u002Fruntime\n```\n\n### Environment\n```bash\n# .env.local\nOPENAI_API_KEY=\"sk-...\"\n# or ANTHROPIC_API_KEY, GOOGLE_API_KEY, GROQ_API_KEY\n```\n\n### Backend API route (`app\u002Fapi\u002Fcopilotkit\u002Froute.ts`)\n```typescript\nimport {\n  CopilotRuntime,\n  OpenAIAdapter, \u002F\u002F or AnthropicAdapter, GoogleGenerativeAIAdapter, GroqAdapter, LangChainAdapter\n  copilotRuntimeNextJSAppRouterEndpoint,\n} from \"@copilotkit\u002Fruntime\";\nimport { NextRequest } from \"next\u002Fserver\";\n\nconst serviceAdapter = new OpenAIAdapter({ model: \"gpt-4o\" });\nconst runtime = new CopilotRuntime();\n\nexport const POST = async (req: NextRequest) => {\n  const { handleRequest } = copilotRuntimeNextJSAppRouterEndpoint({\n    runtime,\n    serviceAdapter,\n    endpoint: \"\u002Fapi\u002Fcopilotkit\",\n  });\n  return handleRequest(req);\n};\n```\n\n### Frontend provider (`layout.tsx`)\n```typescript\nimport { CopilotKit } from \"@copilotkit\u002Freact-core\";\nimport \"@copilotkit\u002Freact-ui\u002Fstyles.css\";\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    \u003Chtml lang=\"en\">\n      \u003Cbody>\n        \u003CCopilotKit runtimeUrl=\"\u002Fapi\u002Fcopilotkit\">\n          {children}\n        \u003C\u002FCopilotKit>\n      \u003C\u002Fbody>\n    \u003C\u002Fhtml>\n  );\n}\n```\n\n### Chat UI (`page.tsx`)\n```typescript\nimport { CopilotPopup } from \"@copilotkit\u002Freact-ui\"; \u002F\u002F or CopilotSidebar, CopilotChat\n\nexport default function Home() {\n  return (\n    \u003C>\n      \u003CYourApp \u002F>\n      \u003CCopilotPopup\n        instructions=\"You are an AI assistant for this app.\"\n        labels={{ title: \"Assistant\", initial: \"How can I help?\" }}\n      \u002F>\n    \u003C\u002F>\n  );\n}\n```\n\n## Core Hooks\n\n### `useCopilotReadable` -- Expose app state to LLM\n```typescript\nuseCopilotReadable({\n  description: \"Current user profile and preferences\",\n  value: { name: user.name, role: user.role, preferences },\n});\n```\n\n### `useCopilotAction` -- Define executable actions\n```typescript\nuseCopilotAction({\n  name: \"addItem\",\n  description: \"Add a new item to the list\",\n  parameters: [\n    { name: \"title\", type: \"string\", required: true },\n    { name: \"priority\", type: \"string\", description: \"low, medium, or high\" },\n  ],\n  handler: async ({ title, priority = \"medium\" }) => {\n    setItems(prev => [...prev, { id: Date.now().toString(), title, priority }]);\n    return `Added \"${title}\" with ${priority} priority`;\n  },\n});\n```\n\n### `useCopilotChat` -- Programmatic chat control\n```typescript\nconst { appendMessage, stopGeneration, reset, reloadMessages } = useCopilotChat();\n```\n\n### `useCopilotAdditionalInstructions` -- Dynamic context-aware prompts\n```typescript\nuseCopilotAdditionalInstructions({\n  instructions: \"User is on the settings page. Help them configure preferences.\",\n});\n```\n\n### `useCopilotChatSuggestions` -- Auto-generate suggestions from app state\n```typescript\nuseCopilotChatSuggestions({\n  instructions: \"Suggest actions based on the current app state.\",\n});\n```\n\n### `useAgent` -- v2 agent state sync (superset of useCoAgent)\n```typescript\nconst { state, setState, run, stop } = useAgent({ name: \"my_agent\" });\n```\n`useAgent` is the v2 replacement for `useCoAgent`. It includes all `useCoAgent` functionality plus time-travel debugging and improved state management. Prefer `useAgent` for new projects.\n\n### `CopilotTask` -- Run one-off programmatic tasks\n```typescript\nimport { CopilotTask } from \"@copilotkit\u002Freact-core\";\n\nconst task = new CopilotTask({ instructions: \"Summarize the data\" });\nawait task.run(context);\n```\n\n## Advanced Patterns\n\nDetailed guides organized by topic -- load only what's needed:\n\n- **Generative UI** (static AG-UI, declarative A2UI, open-ended MCP Apps): See [references\u002Fgenerative-ui.md](references\u002Fgenerative-ui.md)\n- **Shared State & CoAgents** (useCoAgent, useAgent, bidirectional sync, LangGraph): See [references\u002Fcoagents-shared-state.md](references\u002Fcoagents-shared-state.md)\n- **Human-in-the-Loop** (buildtime\u002Fruntime HITL, approval flows, agent steering): See [references\u002Fhuman-in-the-loop.md](references\u002Fhuman-in-the-loop.md)\n- **Runtime & Adapters** (all LLM adapters, framework endpoints, backend actions): See [references\u002Fruntime-adapters.md](references\u002Fruntime-adapters.md)\n- **Python SDK** (LangGraphAgent, FastAPI, actions, state, events): See [references\u002Fpython-sdk.md](references\u002Fpython-sdk.md)\n- **Styling & Customization** (CSS, custom components, headless mode): See [references\u002Fstyling-customization.md](references\u002Fstyling-customization.md)\n- **Troubleshooting** (common issues, CORS, env vars, Docker): See [references\u002Ftroubleshooting.md](references\u002Ftroubleshooting.md)\n- **AG-UI Protocol** (events, architecture, CLI scaffolding): See [references\u002Fag-ui-protocol.md](references\u002Fag-ui-protocol.md)\n\n## UI Components\n\n| Component | Import | Use case |\n|-----------|--------|----------|\n| `CopilotChat` | `@copilotkit\u002Freact-ui` | Embedded inline chat panel |\n| `CopilotSidebar` | `@copilotkit\u002Freact-ui` | Collapsible sidebar chat |\n| `CopilotPopup` | `@copilotkit\u002Freact-ui` | Floating popup chat |\n| `CopilotTextarea` | `@copilotkit\u002Freact-ui` | AI-powered textarea drop-in |\n\nAll accept `instructions`, `labels`, `suggestions`, custom message\u002Finput components, and `observabilityHooks`.\n\n## CopilotKit Provider Props\n\n| Prop | Type | Purpose |\n|------|------|---------|\n| `runtimeUrl` | `string` | Self-hosted runtime endpoint |\n| `publicApiKey` | `string` | Copilot Cloud API key |\n| `headers` | `object` | Custom auth headers |\n| `credentials` | `string` | Cookie handling (`\"include\"` for cross-origin) |\n| `agent` | `string` | Default agent name |\n| `properties` | `object` | Thread metadata, authorization |\n| `onError` | `function` | Error handler callback |\n| `showDevConsole` | `boolean` | Dev error banners |\n| `enableInspector` | `boolean` | Debugging inspector tool |\n| `renderActivityMessages` | `array` | Custom renderers (A2UI, etc.) |\n\n## Agent Protocols\n\n| Protocol | Purpose | Package |\n|----------|---------|---------|\n| **AG-UI** | Agent \u003C-> User interaction, event streaming | `@ag-ui\u002Fcore`, `@ag-ui\u002Fclient` |\n| **MCP** | Agent \u003C-> External tools | MCP server integration |\n| **A2A** | Agent \u003C-> Agent communication | A2A protocol support |\n\n## Supported Agent Frameworks\n\nLangGraph, CrewAI, Google ADK, AWS Strands, Microsoft Agent Framework, Mastra, PydanticAI, AG2, LlamaIndex, Agno, VoltAgent, Blaxel.\n\n## LLM Adapters\n\n`OpenAIAdapter`, `AnthropicAdapter`, `GoogleGenerativeAIAdapter`, `GroqAdapter`, `LangChainAdapter`, `OpenAIAssistantAdapter`.\n\n## Key Packages\n\n| Package | Purpose |\n|---------|---------|\n| `@copilotkit\u002Freact-core` | Provider + all hooks |\n| `@copilotkit\u002Freact-ui` | Chat UI components + styles |\n| `@copilotkit\u002Fruntime` | Backend runtime + LLM adapters + framework endpoints |\n| `copilotkit` (Python) | Python SDK for LangGraph\u002FCrewAI agents |\n| `@copilotkitnext\u002Fangular` | Angular SDK (Angular 18+19) |\n| `@ag-ui\u002Fcore` | AG-UI protocol types\u002Fevents |\n| `@ag-ui\u002Fclient` | AG-UI client implementation |\n\n## Error Handling\n\n### Frontend `onError` callback\n\n```typescript\n\u003CCopilotKit\n  runtimeUrl=\"\u002Fapi\u002Fcopilotkit\"\n  onError={(error) => {\n    console.error(\"CopilotKit error:\", error);\n    toast.error(\"AI assistant encountered an error\");\n  }}\n>\n```\n\n### Tool render `\"failed\"` status\n\nAll render functions receive `status === \"failed\"` when a tool errors. Always handle this:\n\n```typescript\nrender: ({ status, args, result }) => {\n  if (status === \"failed\") return \u003CErrorCard message=\"Tool execution failed\" \u002F>;\n  \u002F\u002F ...\n}\n```\n\n### Python SDK exception types\n\n| Exception | Meaning |\n|-----------|---------|\n| `ActionNotFoundException` | Requested action not registered |\n| `AgentNotFoundException` | Requested agent not found in endpoint |\n\n## Versioning\n\nCurrent version: **v1.51.3** (Python SDK **v0.1.78**). The v2 runtime interface is available at the `\u002Fv2` path. Next-generation packages use the `@copilotkitnext\u002F*` namespace (e.g., `@copilotkitnext\u002Fangular`).\n\n## Common Anti-Patterns\n\n| Don't | Do Instead |\n|-------|-----------|\n| Put API keys in client-side code | Use server-side env vars + runtime endpoint |\n| Create a new CopilotRuntime per request | Instantiate once, reuse across requests |\n| Skip `status` checks in render functions | Always handle \"inProgress\", \"complete\", \"failed\" |\n| Use `useCoAgent` for new projects | Prefer `useAgent` (v2 superset with time travel) |\n| Hardcode instructions in every component | Use `useCopilotAdditionalInstructions` for page-specific context |\n| Forget to import styles | Add `import \"@copilotkit\u002Freact-ui\u002Fstyles.css\"` in layout |\n| Mix `runtimeUrl` and `publicApiKey` without reason | Pick one deployment mode unless you need hybrid |\n| Put heavy computation in action handlers | Return data from handlers, compute in render |\n\n## Common Patterns Cheat Sheet\n\n| Want to... | Use |\n|-----------|-----|\n| Show a chat bubble | `\u003CCopilotPopup>` |\n| Give LLM app context | `useCopilotReadable()` |\n| Let LLM call functions | `useCopilotAction()` |\n| Render UI from tool calls | `useFrontendTool()` or `useRenderToolCall()` |\n| Default fallback tool renderer | `useDefaultTool()` |\n| Sync state bidirectionally | `useCoAgent()` |\n| Use v2 agent state sync | `useAgent()` (superset of useCoAgent) |\n| Show agent progress | `useCoAgentStateRender()` |\n| Ask user for approval | `useHumanInTheLoop()` |\n| Handle LangGraph interrupts | `useLangGraphInterrupt()` |\n| Control chat programmatically | `useCopilotChat()` |\n| Run one-off tasks | `CopilotTask` |\n| Connect Python agent | `CopilotKitRemoteEndpoint` + `LangGraphAgent` |\n| Scaffold AG-UI app | `npx create-ag-ui-app` |\n| Persist conversations | Thread model + StorageRunners |\n","# CopilotKit\n\nFull-stack open-source framework (MIT, v1.51.3, Python SDK v0.1.78) for building agentic applications with AI copilots embedded directly in React and Angular UIs. Angular support via `@copilotkitnext\u002Fangular` (Angular 18+19). 28k+ GitHub stars.\n\n## When to Use This Skill\n- User wants to add an AI copilot, assistant, or chatbot to a React\u002FNext.js app\n- User is working with CopilotKit hooks, components, or runtime\n- User asks about AI-powered text areas or form completion\n- User needs to connect a Python agent (LangGraph\u002FCrewAI) to a React frontend\n- User is implementing human-in-the-loop or generative UI patterns\n- User asks about AG-UI protocol or MCP Apps\n- User wants to sync state between a UI and an AI agent\n\n## Architecture\n\n```\n┌─────────────────────────────────────────────────────────────────┐\n│                                                                 │\n│   F R O N T E N D    @copilotkit\u002Freact-core + react-ui          │\n│                                                                 │\n│   ┌──────────────────┐  ┌──────────────────┐  ┌──────────────┐ │\n│   │  \u003CCopilotPopup>  │  │ \u003CCopilotSidebar> │  │ \u003CCopilotChat>│ │\n│   │  \u003CCopilotTextarea>│  │   Headless UI    │  │  Custom UI   │ │\n│   └────────┬─────────┘  └────────┬─────────┘  └──────┬───────┘ │\n│            └──────────────┬──────┘                    │         │\n│                           ▼                           │         │\n│   ┌───────────────────────────────────────────────────┘         │\n│   │  React Hooks                                                │\n│   │  ├─ useCopilotAction()       → Define callable tools        │\n│   │  ├─ useCopilotReadable()     → Expose app state to LLM     │\n│   │  ├─ useAgent()               → Bidirectional state (v2)    │\n│   │  ├─ useFrontendTool()        → Generative UI rendering     │\n│   │  ├─ useCopilotChat()         → Headless chat control       │\n│   │  └─ useLangGraphInterrupt()  → Human-in-the-loop           │\n│   └─────────────────────────┬───────────────────────────────────│\n│                             │                                   │\n└─────────────────────────────┼───────────────────────────────────┘\n                              │\n                    ┌─────────▼─────────┐\n                    │    AG-UI Protocol  │\n                    │  (HTTP event stream│\n                    │   17 event types)  │\n                    └─────────┬─────────┘\n                              │\n┌─────────────────────────────┼───────────────────────────────────┐\n│                             │                                   │\n│   B A C K E N D    @copilotkit\u002Fruntime                          │\n│                             ▼                                   │\n│   ┌─────────────────────────────────────────────────────────┐   │\n│   │  CopilotRuntime                                         │   │\n│   │  ┌──────────────┐ ┌───────────────┐ ┌────────────────┐ │   │\n│   │  │ LLM Adapters │ │ Backend       │ │ Thread         │ │   │\n│   │  │ OpenAI       │ │ Actions       │ │ Persistence    │ │   │\n│   │  │ Anthropic    │ │ (server-side  │ │ InMemory \u002F     │ │   │\n│   │  │ Google       │ │  tools)       │ │ SQLite         │ │   │\n│   │  │ Groq         │ │               │ │                │ │   │\n│   │  └──────────────┘ └───────────────┘ └────────────────┘ │   │\n│   │  ┌──────────────────────────────────────────────────┐   │   │\n│   │  │ Agent Router                                     │   │   │\n│   │  │ ├─ BuiltInAgent   (direct LLM + middleware)      │   │   │\n│   │  │ ├─ BasicAgent     (lightweight, no middleware)    │   │   │\n│   │  │ └─ CustomHttpAgent (remote Python\u002FJS agents) ────┼───┼─┐ │\n│   │  └──────────────────────────────────────────────────┘   │ │ │\n│   └─────────────────────────────────────────────────────────┘ │ │\n│                                                               │ │\n└───────────────────────────────────────────────────────────────┼─┘\n                                                                │\n                    ┌───────────────────┐                       │\n                    │    AG-UI \u002F HTTP    │◄──────────────────────┘\n                    └─────────┬─────────┘\n                              │\n┌─────────────────────────────┼───────────────────────────────────┐\n│                             ▼                                   │\n│   A G E N T   L A Y E R   (optional, any AG-UI framework)      │\n│                                                                 │\n│   Python: copilotkit SDK v0.1.78 + FastAPI \u002F Flask              │\n│                                                                 │\n│   ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐  │\n│   │ LangGraph  │ │  CrewAI    │ │ Google ADK │ │ AWS Strands│  │\n│   └────────────┘ └────────────┘ └────────────┘ └────────────┘  │\n│   ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐  │\n│   │  Mastra    │ │ PydanticAI │ │    AG2     │ │ LlamaIndex │  │\n│   └────────────┘ └────────────┘ └────────────┘ └────────────┘  │\n│                                                                 │\n│   Protocols:  AG-UI (↔ user)  ·  MCP (↔ tools)  ·  A2A (↔ agents)│\n│                                                                 │\n└─────────────────────────────────────────────────────────────────┘\n```\n\n## Quick Start\n\n### New project\n```bash\nnpx copilotkit@latest create -f next\n```\n\n### Existing project\n```bash\nnpm install @copilotkit\u002Freact-core @copilotkit\u002Freact-ui @copilotkit\u002Fruntime\n```\n\n### Environment\n```bash\n# .env.local\nOPENAI_API_KEY=\"sk-...\"\n# or ANTHROPIC_API_KEY, GOOGLE_API_KEY, GROQ_API_KEY\n```\n\n### Backend API route (`app\u002Fapi\u002Fcopilotkit\u002Froute.ts`)\n```typescript\nimport {\n  CopilotRuntime,\n  OpenAIAdapter, \u002F\u002F or AnthropicAdapter, GoogleGenerativeAIAdapter, GroqAdapter, LangChainAdapter\n  copilotRuntimeNextJSAppRouterEndpoint,\n} from \"@copilotkit\u002Fruntime\";\nimport { NextRequest } from \"next\u002Fserver\";\n\nconst serviceAdapter = new OpenAIAdapter({ model: \"gpt-4o\" });\nconst runtime = new CopilotRuntime();\n\nexport const POST = async (req: NextRequest) => {\n  const { handleRequest } = copilotRuntimeNextJSAppRouterEndpoint({\n    runtime,\n    serviceAdapter,\n    endpoint: \"\u002Fapi\u002Fcopilotkit\",\n  });\n  return handleRequest(req);\n};\n```\n\n### Frontend provider (`layout.tsx`)\n```typescript\nimport { CopilotKit } from \"@copilotkit\u002Freact-core\";\nimport \"@copilotkit\u002Freact-ui\u002Fstyles.css\";\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    \u003Chtml lang=\"en\">\n      \u003Cbody>\n        \u003CCopilotKit runtimeUrl=\"\u002Fapi\u002Fcopilotkit\">\n          {children}\n        \u003C\u002FCopilotKit>\n      \u003C\u002Fbody>\n    \u003C\u002Fhtml>\n  );\n}\n```\n\n### Chat UI (`page.tsx`)\n```typescript\nimport { CopilotPopup } from \"@copilotkit\u002Freact-ui\"; \u002F\u002F or CopilotSidebar, CopilotChat\n\nexport default function Home() {\n  return (\n    \u003C>\n      \u003CYourApp \u002F>\n      \u003CCopilotPopup\n        instructions=\"You are an AI assistant for this app.\"\n        labels={{ title: \"Assistant\", initial: \"How can I help?\" }}\n      \u002F>\n    \u003C\u002F>\n  );\n}\n```\n\n## Core Hooks\n\n### `useCopilotReadable` -- Expose app state to LLM\n```typescript\nuseCopilotReadable({\n  description: \"Current user profile and preferences\",\n  value: { name: user.name, role: user.role, preferences },\n});\n```\n\n### `useCopilotAction` -- Define executable actions\n```typescript\nuseCopilotAction({\n  name: \"addItem\",\n  description: \"Add a new item to the list\",\n  parameters: [\n    { name: \"title\", type: \"string\", required: true },\n    { name: \"priority\", type: \"string\", description: \"low, medium, or high\" },\n  ],\n  handler: async ({ title, priority = \"medium\" }) => {\n    setItems(prev => [...prev, { id: Date.now().toString(), title, priority }]);\n    return `Added \"${title}\" with ${priority} priority`;\n  },\n});\n```\n\n### `useCopilotChat` -- Programmatic chat control\n```typescript\nconst { appendMessage, stopGeneration, reset, reloadMessages } = useCopilotChat();\n```\n\n### `useCopilotAdditionalInstructions` -- Dynamic context-aware prompts\n```typescript\nuseCopilotAdditionalInstructions({\n  instructions: \"User is on the settings page. Help them configure preferences.\",\n});\n```\n\n### `useCopilotChatSuggestions` -- Auto-generate suggestions from app state\n```typescript\nuseCopilotChatSuggestions({\n  instructions: \"Suggest actions based on the current app state.\",\n});\n```\n\n### `useAgent` -- v2 agent state sync (superset of useCoAgent)\n```typescript\nconst { state, setState, run, stop } = useAgent({ name: \"my_agent\" });\n```\n`useAgent` is the v2 replacement for `useCoAgent`. It includes all `useCoAgent` functionality plus time-travel debugging and improved state management. Prefer `useAgent` for new projects.\n\n### `CopilotTask` -- Run one-off programmatic tasks\n```typescript\nimport { CopilotTask } from \"@copilotkit\u002Freact-core\";\n\nconst task = new CopilotTask({ instructions: \"Summarize the data\" });\nawait task.run(context);\n```\n\n## Advanced Patterns\n\nDetailed guides organized by topic -- load only what's needed:\n\n- **Generative UI** (static AG-UI, declarative A2UI, open-ended MCP Apps): See [references\u002Fgenerative-ui.md](references\u002Fgenerative-ui.md)\n- **Shared State & CoAgents** (useCoAgent, useAgent, bidirectional sync, LangGraph): See [references\u002Fcoagents-shared-state.md](references\u002Fcoagents-shared-state.md)\n- **Human-in-the-Loop** (buildtime\u002Fruntime HITL, approval flows, agent steering): See [references\u002Fhuman-in-the-loop.md](references\u002Fhuman-in-the-loop.md)\n- **Runtime & Adapters** (all LLM adapters, framework endpoints, backend actions): See [references\u002Fruntime-adapters.md](references\u002Fruntime-adapters.md)\n- **Python SDK** (LangGraphAgent, FastAPI, actions, state, events): See [references\u002Fpython-sdk.md](references\u002Fpython-sdk.md)\n- **Styling & Customization** (CSS, custom components, headless mode): See [references\u002Fstyling-customization.md](references\u002Fstyling-customization.md)\n- **Troubleshooting** (common issues, CORS, env vars, Docker): See [references\u002Ftroubleshooting.md](references\u002Ftroubleshooting.md)\n- **AG-UI Protocol** (events, architecture, CLI scaffolding): See [references\u002Fag-ui-protocol.md](references\u002Fag-ui-protocol.md)\n\n## UI Components\n\n| Component | Import | Use case |\n|-----------|--------|----------|\n| `CopilotChat` | `@copilotkit\u002Freact-ui` | Embedded inline chat panel |\n| `CopilotSidebar` | `@copilotkit\u002Freact-ui` | Collapsible sidebar chat |\n| `CopilotPopup` | `@copilotkit\u002Freact-ui` | Floating popup chat |\n| `CopilotTextarea` | `@copilotkit\u002Freact-ui` | AI-powered textarea drop-in |\n\nAll accept `instructions`, `labels`, `suggestions`, custom message\u002Finput components, and `observabilityHooks`.\n\n## CopilotKit Provider Props\n\n| Prop | Type | Purpose |\n|------|------|---------|\n| `runtimeUrl` | `string` | Self-hosted runtime endpoint |\n| `publicApiKey` | `string` | Copilot Cloud API key |\n| `headers` | `object` | Custom auth headers |\n| `credentials` | `string` | Cookie handling (`\"include\"` for cross-origin) |\n| `agent` | `string` | Default agent name |\n| `properties` | `object` | Thread metadata, authorization |\n| `onError` | `function` | Error handler callback |\n| `showDevConsole` | `boolean` | Dev error banners |\n| `enableInspector` | `boolean` | Debugging inspector tool |\n| `renderActivityMessages` | `array` | Custom renderers (A2UI, etc.) |\n\n## Agent Protocols\n\n| Protocol | Purpose | Package |\n|----------|---------|---------|\n| **AG-UI** | Agent \u003C-> User interaction, event streaming | `@ag-ui\u002Fcore`, `@ag-ui\u002Fclient` |\n| **MCP** | Agent \u003C-> External tools | MCP server integration |\n| **A2A** | Agent \u003C-> Agent communication | A2A protocol support |\n\n## Supported Agent Frameworks\n\nLangGraph, CrewAI, Google ADK, AWS Strands, Microsoft Agent Framework, Mastra, PydanticAI, AG2, LlamaIndex, Agno, VoltAgent, Blaxel.\n\n## LLM Adapters\n\n`OpenAIAdapter`, `AnthropicAdapter`, `GoogleGenerativeAIAdapter`, `GroqAdapter`, `LangChainAdapter`, `OpenAIAssistantAdapter`.\n\n## Key Packages\n\n| Package | Purpose |\n|---------|---------|\n| `@copilotkit\u002Freact-core` | Provider + all hooks |\n| `@copilotkit\u002Freact-ui` | Chat UI components + styles |\n| `@copilotkit\u002Fruntime` | Backend runtime + LLM adapters + framework endpoints |\n| `copilotkit` (Python) | Python SDK for LangGraph\u002FCrewAI agents |\n| `@copilotkitnext\u002Fangular` | Angular SDK (Angular 18+19) |\n| `@ag-ui\u002Fcore` | AG-UI protocol types\u002Fevents |\n| `@ag-ui\u002Fclient` | AG-UI client implementation |\n\n## Error Handling\n\n### Frontend `onError` callback\n\n```typescript\n\u003CCopilotKit\n  runtimeUrl=\"\u002Fapi\u002Fcopilotkit\"\n  onError={(error) => {\n    console.error(\"CopilotKit error:\", error);\n    toast.error(\"AI assistant encountered an error\");\n  }}\n>\n```\n\n### Tool render `\"failed\"` status\n\nAll render functions receive `status === \"failed\"` when a tool errors. Always handle this:\n\n```typescript\nrender: ({ status, args, result }) => {\n  if (status === \"failed\") return \u003CErrorCard message=\"Tool execution failed\" \u002F>;\n  \u002F\u002F ...\n}\n```\n\n### Python SDK exception types\n\n| Exception | Meaning |\n|-----------|---------|\n| `ActionNotFoundException` | Requested action not registered |\n| `AgentNotFoundException` | Requested agent not found in endpoint |\n\n## Versioning\n\nCurrent version: **v1.51.3** (Python SDK **v0.1.78**). The v2 runtime interface is available at the `\u002Fv2` path. Next-generation packages use the `@copilotkitnext\u002F*` namespace (e.g., `@copilotkitnext\u002Fangular`).\n\n## Common Anti-Patterns\n\n| Don't | Do Instead |\n|-------|-----------|\n| Put API keys in client-side code | Use server-side env vars + runtime endpoint |\n| Create a new CopilotRuntime per request | Instantiate once, reuse across requests |\n| Skip `status` checks in render functions | Always handle \"inProgress\", \"complete\", \"failed\" |\n| Use `useCoAgent` for new projects | Prefer `useAgent` (v2 superset with time travel) |\n| Hardcode instructions in every component | Use `useCopilotAdditionalInstructions` for page-specific context |\n| Forget to import styles | Add `import \"@copilotkit\u002Freact-ui\u002Fstyles.css\"` in layout |\n| Mix `runtimeUrl` and `publicApiKey` without reason | Pick one deployment mode unless you need hybrid |\n| Put heavy computation in action handlers | Return data from handlers, compute in render |\n\n## Common Patterns Cheat Sheet\n\n| Want to... | Use |\n|-----------|-----|\n| Show a chat bubble | `\u003CCopilotPopup>` |\n| Give LLM app context | `useCopilotReadable()` |\n| Let LLM call functions | `useCopilotAction()` |\n| Render UI from tool calls | `useFrontendTool()` or `useRenderToolCall()` |\n| Default fallback tool renderer | `useDefaultTool()` |\n| Sync state bidirectionally | `useCoAgent()` |\n| Use v2 agent state sync | `useAgent()` (superset of useCoAgent) |\n| Show agent progress | `useCoAgentStateRender()` |\n| Ask user for approval | `useHumanInTheLoop()` |\n| Handle LangGraph interrupts | `useLangGraphInterrupt()` |\n| Control chat programmatically | `useCopilotChat()` |\n| Run one-off tasks | `CopilotTask` |\n| Connect Python agent | `CopilotKitRemoteEndpoint` + `LangGraphAgent` |\n| Scaffold AG-UI app | `npx create-ag-ui-app` |\n| Persist conversations | Thread model + StorageRunners |\n",{"name":5,"license":15,"metadata":59,"description":7},{"tags":60,"author":61,"version":62},"copilotkit, ai, react, nextjs, copilot, chatbot, agent, agentic-ui, langgraph, coagents, ag-ui, mcp, angular","nihalnihalani","1.1","main","1ca81b0a7de199942400f965edd4d7544077ac5d",".claude\u002Fskills\u002Fcopilotkit","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai","https:\u002F\u002Fgithub.com\u002FCoralShades","coralshades.com.au","2026-04-18 00:45:07",{"source":8,"skillName":5,"commands":71,"prompt":81,"zipAvailable":82},[72,75,78],{"tool":73,"command":74},"npx","npx skills add CoralShades\u002Facm-ai --skill copilotkit",{"tool":76,"command":77},"bunx","bunx skills add CoralShades\u002Facm-ai --skill copilotkit",{"tool":79,"command":80},"pnpm","pnpm dlx skills add CoralShades\u002Facm-ai --skill copilotkit","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002FSKILL.md",true,[84,90,94,98,102,106,110,114],{"path":85,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":88,"sourceHtmlUrl":89},"references\u002Fag-ui-protocol.md","REFERENCE","参考文档",6804,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fag-ui-protocol.md",{"path":91,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":92,"sourceHtmlUrl":93},"references\u002Fcoagents-shared-state.md",8823,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fcoagents-shared-state.md",{"path":95,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":96,"sourceHtmlUrl":97},"references\u002Fgenerative-ui.md",7939,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fgenerative-ui.md",{"path":99,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":100,"sourceHtmlUrl":101},"references\u002Fhuman-in-the-loop.md",6305,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fhuman-in-the-loop.md",{"path":103,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":104,"sourceHtmlUrl":105},"references\u002Fpython-sdk.md",12532,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fpython-sdk.md",{"path":107,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":108,"sourceHtmlUrl":109},"references\u002Fruntime-adapters.md",10674,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fruntime-adapters.md",{"path":111,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":112,"sourceHtmlUrl":113},"references\u002Fstyling-customization.md",4410,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Fstyling-customization.md",{"path":115,"resourceType":86,"resourceTypeDesc":87,"sizeBytes":116,"sourceHtmlUrl":117},"references\u002Ftroubleshooting.md",11939,"https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fcopilotkit\u002Freferences\u002Ftroubleshooting.md",[119,135,148,163,181,191],{"skillNo":120,"name":121,"nameZh":6,"description":122,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":123,"categories":124,"keywords":126,"publishedAt":54},"01M6C63HKXA890HHV47WBAX0TB","uncodixfy","Prevents generic AI\u002FCodex UI patterns when generating frontend code. Use this skill whenever generating HTML, CSS, React, Vue, Svelte, or any frontend UI code to enforce clean, human-designed aesthetics inspired by Linear, Raycast, Stripe, and GitHub instead of typical AI-generated UI.","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.qwen\u002Fskills\u002Funcodixfy\u002FSKILL.md",[125],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},[121,127,44,128,129,47,130,131,45,132,133,37,134],"github","css","codex","code","linear","vue","generated","html",{"skillNo":136,"name":137,"nameZh":6,"description":138,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":139,"licenseFileUrl":6,"sourceHtmlUrl":140,"categories":141,"keywords":142,"publishedAt":54},"01M6C63FJ2GEBBGZ5XSMV40KXB","runpodctl","Runpod CLI to manage your GPU workloads.","Apache-2.0","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.qwen\u002Fskills\u002Frunpodctl\u002FSKILL.md",[],[137,143,144,145,146,147],"macos","cli","linux","gpu","Bash",{"skillNo":149,"name":150,"nameZh":6,"description":151,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":152,"categories":153,"keywords":154,"publishedAt":54},"01M6C63DPAV46TFVQ01SFYPJ7X","langgraph-persistence","INVOKE THIS SKILL when your LangGraph needs to persist state, remember conversations, travel through history, or configure subgraph checkpointer scoping. Covers checkpointers, thread_id, time travel, Store, and subgraph persistence modes.","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.qwen\u002Fskills\u002Flanggraph-persistence\u002FSKILL.md",[],[155,43,156,157,158,159,160,161,162],"langgraph persistence","persistence","travel","history","scoping","remember","state","configure",{"skillNo":164,"name":165,"nameZh":6,"description":166,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":167,"categories":168,"keywords":172,"publishedAt":54},"01M6C63BNS9CQEBTB8RNSSBFPA","langgraph-human-in-the-loop","INVOKE THIS SKILL when implementing human-in-the-loop patterns, pausing for approval, or handling errors in LangGraph. Covers interrupt(), Command(resume=...), approval\u002Fvalidation workflows, and the 4-tier error handling strategy.","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.qwen\u002Fskills\u002Flanggraph-human-in-the-loop\u002FSKILL.md",[169],{"categoryNo":170,"categoryName":171,"taxonomyType":32,"taxonomyTypeDesc":33},"01JBSEEDCAT000000000000038","人力资源",[173,39,43,174,175,176,40,177,178,179,180],"langgraph human in the loop","workflows","error handling","validation","command","strategy","approval","resume",{"skillNo":182,"name":183,"nameZh":6,"description":184,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":185,"categories":186,"keywords":187,"publishedAt":54},"01M6C639GVYZFX3NFPV5FBDR4F","langgraph-fundamentals","INVOKE THIS SKILL when writing ANY LangGraph code. Covers StateGraph, state schemas, nodes, edges, Command, Send, invoke, streaming, and error handling.","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.qwen\u002Fskills\u002Flanggraph-fundamentals\u002FSKILL.md",[],[188,43,175,161,189,190,177,130],"langgraph fundamentals","streaming","writing",{"skillNo":192,"name":193,"nameZh":6,"description":194,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":195,"categories":196,"keywords":197,"publishedAt":54},"01M6C6375N34YX2GZ3SD3R7XR2","langchain-rag","INVOKE THIS SKILL when building ANY retrieval-augmented generation (RAG) system. Covers document loaders, RecursiveCharacterTextSplitter, embeddings (OpenAI), and vector stores (Chroma, FAISS, Pinecone).","https:\u002F\u002Fgithub.com\u002FCoralShades\u002Facm-ai\u002Fblob\u002Fmain\u002F.qwen\u002Fskills\u002Flangchain-rag\u002FSKILL.md",[],[198,199,200,201,202,203,204,205,206,207],"rag","langchain rag","langchain","embeddings","vector","openai","chroma","faiss","vector stores","system"]