copilotkit
CopilotKit integration patterns for providers, runtime wiring, `useCoAgent`, `useCopilotAction`, `useLangGraphInterrupt`, shared state, and HITL with LangGraph. Use when building agent-native product UX.
npx skills add majiayu000/claude-skill-registry --skill copilotkit --agent copilot
Same command for any agent — swap --agent for claude-code, codex, cursor.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# CopilotKit Use this skill to implement CopilotKit-based agent UX with correct provider wiring, runtime selection, shared state, frontend actions, and interrupt handling. ## Quick Triage - Use this skill for CopilotKit provider setup, runtime endpoints, hooks, shared-state rendering, and human-in-the-loop UX. - Switch to `$langgraph` when backend graph behavior is the main issue. - Switch to `$ag-ui` when protocol event compliance is the main issue. - Switch to `$langchain` when core model/tool orchestration logic is the main issue. ## Workflow 1. Choose runtime topology. Decide LangGraph platform endpoint vs remote backend runtime before UI edits. 2. Configure provider boundary. Set `<CopilotKit>` provider and runtime endpoint settings first. 3. Select hooks by responsibility. Use `useCoAgent` for state coupling, `useCopilotAction` for frontend actions, and interrupt hooks for HITL flow. 4. Define shared state contract. Separate input/output/internal state and keep serialization stable. 5. Implement HITL path. Map interrupt payloads to explicit frontend action handlers. 6. Implement persistence behavior. Choose thread/message persistence strategy and ensure resume consistency. 7.
- Quick Triage
- Workflow
- Default Patterns
- Failure Modes
- Reference Map
What does the copilotkit skill do?
CopilotKit integration patterns for providers, runtime wiring, `useCoAgent`, `useCopilotAction`, `useLangGraphInterrupt`, shared state, and HITL with LangGraph. Use when building agent-native product UX.
How do I install it?
Run `npx skills add majiayu000/claude-skill-registry --skill copilotkit --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From majiayu000/claude-skill-registry, a repository with 534 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.