Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add instructions/bubba2koldd-design/opengenerativeui/claude-mdgit clone --depth 1 https://github.com/bubba2koldd-design/OpenGenerativeUIWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/instructions/bubba2koldd-design/opengenerativeui/claude-md)<a href="https://agentmods.dev/instructions/bubba2koldd-design/opengenerativeui/claude-md"><img src="https://agentmods.dev/badge/instructions/bubba2koldd-design/opengenerativeui/claude-md.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.02345 | $0.02345 |
| Opus 5 | $0.01172 | $0.01172 |
| Sonnet 5 | $0.00469 | $0.00469 |
| Haiku 4.5 | $0.00234 | $0.00234 |
Grade A, and why
OpenGenerativeUI CLAUDE.md scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 5d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
This is a copy
98% identical to OpenGenerativeUI CLAUDE.md — 8 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
How it starts
The opening of the file, as written. The whole thing — 287 lines — stays where its author put it; the contents beside it link to each section on GitHub.
CopilotKit + LangGraph Todo Demo
Purpose
This repository serves as both a showcase and template for building AI agents with CopilotKit and LangGraph. It demonstrates how CopilotKit can drive interactive UI beyond just chat, using a collaborative todo list as the primary example.
Target audience: Developers evaluating CopilotKit or starting new projects with AI agents.
Core Concept
The todo list demonstrates agent-driven UI where:
- The agent can manipulate application state (adding todos, updating status, organizing tasks)
- Users can interact with the same state (editing titles, checking off tasks, deleting todos)
- Both agent and user changes update the same shared state
- The UI reactively updates based on agent state changes
This uses CopilotKit's v2 agent state pattern where state lives in the agent and syncs to the frontend.
Architecture
This is a Turborepo monorepo with three apps:
Repository Structure
apps/
├── app/ # Next.js frontend
│ ├── src/
│ │ ├── app/
│ │ │ ├── page.tsx # Main page - wires up all components
│ │ │ └── api/copilotkit/ # CopilotKit API route
│ │ ├── components/
│ │ │ ├── canvas/ # Todo list UI
│ │ │ │ ├── index.tsx # Canvas container
│ │ │ │ ├── todo-list.tsx # Todo list with columns
│ │ │ │ ├── todo-column.tsx # Column (pending/completed)
│ │ │ │ └── todo-card.tsx # Individual todo card
│ │ │ ├── example-layout/ # Layout: chat + canvas side-by-side
│ │ │ └── generative-ui/ # Example generative UI components
│ │ └── hooks/
│ │ ├── use-generative-ui-examples.tsx # Example CopilotKit patterns
│ │ └── use-example-suggestions.tsx # Chat suggestions
├── agent/ # LangGraph Python agent
│ ├── main.py # Agent entry point
│ └── src/
│ ├── todos.py # Todo tools and state schema
│ └── query.py # Example data query tool
└── mcp/ # MCP (Model Context Protocol) integration
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 5d ago First seen · 287 lines · 2,345 tokens per session scan A 1364834464a4
OpenGenerativeUI CLAUDE.md is an instructions file published in the GitHub repository bubba2koldd-design/OpenGenerativeUI (2 stars, last pushed 3d ago), licensed MIT. It adds 2,345 tokens to every session, about $0.0117 per session on Opus 5. A static security scan graded it A with 0 findings. It is 98% identical to OpenGenerativeUI CLAUDE.md, differing in 8 lines, and is treated as a copy.
Other instructions, from other repositories
OpenGenerativeUI CLAUDE.md
Instructions for CopilotKit/OpenGenerativeUI, covering copilotkit + langgraph todo demo, purpose, core concept, architecture and repository structure.
hindsight CLAUDE.md
Claude Code instructions for vectorize-io/hindsight, covering claude.md, project overview, development commands, local development (api + ui) and start both api server and control plane ui.
codedb AGENTS.md
AGENTS.md instructions for justrach/codedb, covering codedb agent guidelines, what codedb is (and isn't), review guidelines, pre-merge verification and security-sensitive areas.
claude-code-settings copilot-instructions.md
Instructions for feiskyer/claude-code-settings, covering claude.md, environment setup, required dependencies, configuration and skills.
pi CLAUDE.md
Instructions for share-skills/pi, covering 强制, 内部目标（不可写入公开文件）, 跑分规范 and eval 驱动优化规则.
harness-sdk CLAUDE.md
Claude Code instructions for strands-agents/harness-sdk, a project described as: Build an agent harness and control it end-to-end. Open-source SDK for production AI agents in Python & TypeScript - any model, any cloud.