Ermöglicht es einem AI-Client, lokale MDX-Dokumente zu bearbeiten und gemeinsame Actions über ein speziell entwickeltes Agent-UI auszuführen.
Auch bekannt als BuilderIO/agent-native, agent-native-content
- Stars
- 7.707
- Tools
- —
- Downloads, 30 Tage
- —
- Neueste Version
- 1.0.0
- Letzter Commit
- 15. Nov. 2026
- Lizenz
- MIT
Was ist Agent-Native MCP?
Agent-Native ist ein MCP server. Ermöglicht es einem AI-Client, lokale MDX-Dokumente zu bearbeiten und gemeinsame Actions über ein speziell entwickeltes Agent-UI auszuführen.
Zusammenfassung generiert aus dem README des Projekts
Über Agent-Native MCP server
Entwickler, die autonome Agents mit dedizierten User Interfaces bauen, können dieses TypeScript Framework nutzen, um die Lücke zwischen AI-Tools und visuellen Applikationsoberflächen zu schließen. Es ermöglicht dir, eine Capability einmalig als gemeinsame Action zu definieren, die dann sowohl als Tool für den Agent als auch als aufrufbare Funktion innerhalb des UI fungiert. Das stellt sicher, dass sowohl der menschliche Nutzer als auch die AI mit derselben Validierungs-, Berechtigungs- und Implementierungslogik arbeiten.
Das System verwaltet gemeinsame Daten und den Application State, sodass die vom Agent ausgeführte Arbeit sofort im UI sichtbar ist und manuelle Änderungen in der Oberfläche für den Agent zugänglich sind. Es unterstützt ein PostgreSQL-Backend für Produktionsumgebungen und PGlite für die lokale Entwicklung. Mit diesem Framework kannst du spezialisierte Agents für Aufgaben wie Content-Management, Interface-Design oder Datenanalyse bauen und den Nutzern gleichzeitig vertraute Wege bieten, um die Arbeit des Agents zu inspizieren und freizugeben.
Was du damit machen kannst
- 1Visuelle ApplikationsbearbeitungEin Entwickler kann einen visuellen Edit-Befehl nutzen, um UI-Elemente wie Button-Farben oder Abstände auf einem Canvas anzupassen, bevor diese Änderungen im Source Code angewendet werden.
- 2Automatisierte WissensarbeitNutzer können komplexe Aufgaben an spezialisierte Agents delegieren, die in einem gemeinsamen Workspace unter Verwendung von persistentem Memory und Skills arbeiten.
Geschrieben aus dem README des Projekts. Jeder Use Case wurde gegen ein Zitat daraus geprüft.
So installierst du Agent-Native MCP
Formate geprüft am 10. Nov. 2026Zu Cursor hinzufügenZu Goose hinzufügenAgent-Native MCP in Claude Code installieren
$ claude mcp add --transport http agent-native-content https://content.agent-native.com/mcpAgent-Native MCP in Cursor installieren
~/.cursor/mcp.json
{
"mcpServers": {
"agent-native-content": {
"url": "https://content.agent-native.com/mcp"
}
}
}Agent-Native MCP in VS Code installieren
.vscode/mcp.json
{
"servers": {
"agent-native-content": {
"type": "http",
"url": "https://content.agent-native.com/mcp"
}
}
}Agent-Native MCP in VS Code CLI installieren
$ code --add-mcp '{"name":"agent-native-content","type":"http","url":"https://content.agent-native.com/mcp"}'Agent-Native MCP in Codex installieren
$ codex mcp add agent-native-content --url https://content.agent-native.com/mcpAgent-Native MCP in Codex config.toml installieren
~/.codex/config.toml
[mcp_servers.agent-native-content] url = "https://content.agent-native.com/mcp"
Agent-Native MCP in Gemini CLI installieren
$ gemini mcp add -s user --transport http agent-native-content https://content.agent-native.com/mcpAgent-Native MCP in Gemini settings.json installieren
~/.gemini/settings.json
{
"mcpServers": {
"agent-native-content": {
"url": "https://content.agent-native.com/mcp",
"type": "http"
}
}
}Automatisierte Checks
Geluften am 12. Nov. 2026Vollständiger Bericht →Unsere automatisierten Checks bestanden. Das ist kein Security-Audit: Lies den Code und gib dem Server nur den minimal notwendigen Zugriff. Wie die Checks funktionieren
- Source Repository verknüpft und erreichbarBestanden
- Open Source Lizenz (OSI)Bestanden
- Commit oder Release im letzten JahrBestanden
- Package-Name ähnelt keinem populären PackageNicht geprüft
- Remote Endpoint nutzt HTTPSBestanden
- Destruktive Tools sind markiertNicht geprüft
- Keine versteckten Anweisungen an das ModellBestanden
- Keine kritischen Advisories im Paket oder seinen AbhängigkeitenNicht geprüft
README
Auf GitHub ansehenAgent-Native
Agent-Native is an open-source TypeScript framework for building agents that pair autonomous work with a purpose-built UI. Define each capability once as an action: the agent uses it as a tool, and the UI calls it from code.
Quick start
npx --yes @agent-native/core@latest create my-agent --standalone --template chat
Follow the getting started guide for a full intro to the framework.
Why build agents with UIs?
Coding agents work with more than a text box. Their environment provides context, tools, files, tests, and previews that make their capabilities and results visible.
Knowledge work needs that same kind of environment. A UI shows what an agent can do and gives people familiar ways to inspect, edit, approve, and share its work.
How Agent-Native works
- Shared actions. The agent calls each capability as a tool, and the UI calls it from code. Both paths use the same validation, permissions, and implementation.
- Shared data. Work done by the agent appears in the UI, and work done in the UI is available to the agent.
- Shared application state. The agent receives relevant UI state, such as the current page, selected record, or active view.
The agent does not click through the UI. It works through the same action layer as the UI.
Example: a shared action
Create actions/hello.ts:
import { defineAction } from "@agent-native/core/action";
import { z } from "zod";
// One action powers every app surface: UI, agent, HTTP, MCP, A2A, and CLI.
export default defineAction({
description: "Return a friendly greeting.",
schema: z.object({
name: z.string().default("world").describe("Name to greet"),
}),
http: { method: "GET" },
run: async ({ name }) => {
return { message: `Hello, ${name}!` };
},
});
The agent receives hello as a tool. React calls the same function with useActionQuery("hello", { name: "Alex" }). Agent-Native also exposes it through HTTP, MCP, A2A, and the CLI.
Included
- Agent chat: Let people delegate work, ask questions, and review results in the same UI.
- Authentication and permissions: Control who can access and change shared work.
- Skills and memory: Give agents reusable expertise and persistent context.
- Automations: Run agent work on schedules or events.
- Agent teams: Delegate work to specialist agents in the same workspace or across connected agents.
- PostgreSQL backend: Use PostgreSQL in production and PGlite for local development on any Nitro-compatible host.
Example: edit a running app visually
Use /visual-edit in Claude Code to edit a running app on a canvas instead of
prompting for each small UI nudge. Compare live pages together, then ask Claude
to apply the chosen edits to your source. For example:
/visual-edit the onboarding flow, plus home at every breakpoint
Review the onboarding screens alongside Home at desktop, tablet, and mobile sizes, adjust a button's color or spacing directly, then ask Claude to apply the pending edits to your source. See the Visual Edit guide for the full walkthrough and sharing details.
Bring your LLM, SQL database, tools, and infrastructure. Everything you build stays yours.
See Agent-Native in action:
https://github.com/user-attachments/assets/ef51644b-6506-46d8-8083-0af7b7e5b65c
Open-source agents
Start from one of these agents or use it as an example for your own. For a source-to-answer architecture example, see Brain’s visual overview.
Clips
Record and understand meetings, screens, and voice notes.
Design
Generate and refine interactive designs.
Slides
Create and edit on-brand presentations.
Analytics
Ask questions of your data and build dashboards.
Calendar
Find time, schedule events, and manage bookings.
Prioritize email, draft replies, and follow up.
Assets
Create and organize on-brand media.
Content
Draft, organize, and publish content.
Plans
Create and review visual plans with diagrams, wireframes, and prototypes.
Explore the full app gallery, or start with the framework guide.
Documentation and community
- Read the documentation.
- Join Discord to ask questions, share what you're building, and get help.
Contributing
Want to send a change back? Start with CONTRIBUTING.md. DEVELOPMENT.md covers local setup, workspace structure, and guard scripts.
License
MIT
Agent-Native MCP Fragen
Wie füge ich Agent-Native MCP zu Claude Code hinzu?
Führe claude mcp add --transport http agent-native-content https://content.agent-native.com/mcp in deinem Terminal aus. Füge --scope user hinzu, damit der Server in jedem Projekt verfügbar ist.
Wie füge ich Agent-Native MCP zu Cursor hinzu?
Öffne ~/.cursor/mcp.json und füge den Server unter mcpServers hinzu, mit der Cursor-Config aus dem Installationsabschnitt oben.
Was ist Agent-Native?
Es ist ein Open-Source TypeScript Framework zum Bauen von Agents, das autonome Arbeit mit einem speziell entwickelten UI kombiniert. Capabilities werden einmalig als Actions definiert, die sowohl der Agent als auch das UI nutzen.
Wie interagiert der Agent mit dem UI?
Der Agent klickt sich nicht durch das UI; er arbeitet über dieselbe Action-Layer wie das UI und nutzt dabei dieselbe Validierung, Berechtigungen und Implementierung.
Welche Backend-Datenbank nutzt Agent-Native?
Es nutzt PostgreSQL in der Produktion und PGlite für die lokale Entwicklung auf jedem Nitro-kompatiblen Host.
Wie erstelle ich ein neues Agent-Projekt?
Führe den create-Befehl mit npx aus, der ein Projekt anhand eines Templates wie chat erstellt.
Welche Interfaces exponieren eine Action?
Eine einzelne Action-Definition wird über das UI, den Agent, HTTP, MCP, A2A und das CLI bereitgestellt.