@agent-native/core 0.76.5 → 0.76.6

package/corpus/core/docs/content/locales/de-DE/template-content.md

@@ -0,0 +1,402 @@
+---
+title: "Inhalt"
+description: "Open-Source-Obsidian für MDX: Bearbeiten Sie lokale Markdown/MDX-Dateien, generieren Sie umfangreiche interaktive benutzerdefinierte Blöcke und schreiben Sie mit einem KI-Agenten."
+---
+
+# Inhalt
+
+Der Inhalt ist Open-Source-Obsidian für MDX: ein lokal dateifreundliches Dokument
+Arbeitsbereich, in dem der Agent Seiten lesen, schreiben, neu organisieren und veröffentlichen kann
+du. Öffnen Sie ein Dokument und fragen Sie „Diesen Absatz umschreiben, um ihn prägnanter zu gestalten“ oder „Erstellen Sie einen
+Seite namens „Q4-Planung mit Unterseiten für Ziele, Kennzahlen und Risiken“ – gleich
+Ergebnis, egal ob Sie es selbst machen oder fragen.
+
+```an-wireframe
+{
+  "surface": "desktop",
+  "html": "<div style='display:grid;grid-template-columns:210px 1fr;gap:14px;padding:16px;min-height:500px;box-sizing:border-box'><aside class='wf-card' style='display:flex;flex-direction:column;gap:10px'><strong>Content</strong><span class='wf-pill accent'>Q3 Roadmap</span><span class='wf-pill'>Goals</span><span class='wf-pill'>Metrics</span><span class='wf-pill'>Risks</span><hr/><span class='wf-pill'>Engineering wiki</span><span class='wf-pill'>Reading list</span><span class='wf-pill'>Weekly sync</span></aside><main style='display:flex;flex-direction:column;gap:12px;min-width:0;padding:8px 20px'><div style='display:flex;align-items:center;gap:10px'><h1 style='margin:0'>Q3 Roadmap</h1><div style='flex:1'></div><button>Share</button><button class='primary'>Publish</button></div><div class='wf-card' style='flex:1;display:flex;flex-direction:column;gap:12px;padding:22px'><h2 style='margin:0'>Launch goals</h2><p style='margin:0'>Ship the onboarding flow, reduce setup time, and document owner handoffs.</p><div class='wf-box'>At a glance · owner, window, status</div><div class='wf-box'>Top objectives</div><div class='wf-box'>Workstreams table</div></div></main></div>"
+}
+```
+
+Wenn Sie die App öffnen, sehen Sie neben dem Editor einen Seitenbaum. Der Agent weiß immer, welche Seite Sie gerade anzeigen und welchen Text Sie ausgewählt haben, sodass Dokumentänderungen auf der aktuellen Seite verankert bleiben können.
+
+```an-diagram title="One document, many editors" summary="You and the agent both write through the same Yjs pipeline. SQL is the canonical store; local files and Notion are optional sync surfaces."
+{
+  "html": "<div class=\"diagram-flow\"><div class=\"diagram-col\"><div class=\"diagram-node\">You type<br><small class=\"diagram-muted\">slash menu, toolbar</small></div><div class=\"diagram-node\">Agent edits<br><small class=\"diagram-muted\">edit-document find/replace</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\"><span class=\"diagram-pill accent\">Yjs CRDT</span><small class=\"diagram-muted\">live, conflict-free merge</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\">documents (markdown)<br><small class=\"diagram-muted\">canonical SQL store</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&harr;</div><div class=\"diagram-col\"><div class=\"diagram-box\">Local .md / .mdx<br><small class=\"diagram-muted\">/local-files</small></div><div class=\"diagram-box\">Notion pages<br><small class=\"diagram-muted\">pull · push</small></div></div></div>",
+  "css": ".diagram-flow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-flow .diagram-col{display:flex;flex-direction:column;gap:10px}.diagram-flow .diagram-arrow{font-size:22px;line-height:1}.diagram-flow .center{display:flex;flex-direction:column;align-items:center;gap:4px}"
+}
+```
+
+## Was Sie damit machen können
+
+- **Schreiben Sie Rich-Text** mit Überschriften, Listen, Tabellen, Codeblöcken, Bildern und Links. Schrägstrichbefehle (`/`) fügen Blöcke ein; Wenn Sie Text auswählen, wird eine Formatierungssymbolleiste angezeigt.
+- **Seiten in einer Baumstruktur organisieren** – unbegrenzt verschachteln, zum Neuanordnen ziehen, Lieblingsseiten, die Sie häufig verwenden.
+- **Alles durchsuchen** mit Volltextsuche über Titel und Inhalte hinweg.
+- **Bearbeiten Sie lokale Markdown/MDX-Dateien wie Obsidian.** Verwenden Sie die `/local-files`-Ansicht
+  Um Ihren Arbeitsbereich in Dateien zu exportieren, diese in Ihren eigenen Tools zu bearbeiten und eine Vorschau anzuzeigen
+  Änderungen und importieren Sie sie zurück. Im lokalen Dateimodus schreibt der Inhalt direkt nach
+  die ausgewählte `.md`- oder `.mdx`-Datei.
+- **Generieren Sie umfangreiche interaktive benutzerdefinierte Blöcke.** Registrieren Sie lokale React-Komponenten,
+  Fügen Sie sie als MDX ein und lassen Sie den Agent Komponentendateien erstellen oder aktualisieren
+  Ihre Dokumente.
+- **Mit Notion synchronisieren.** Verknüpfen Sie ein lokales Dokument mit einer Notion-Seite und ziehen oder übertragen Sie Inhalte in beide Richtungen. Kommentare werden auch in beide Richtungen synchronisiert.
+- **Zusammenarbeit in Echtzeit.** Mehrere Personen (und der Agent) können dasselbe Dokument gleichzeitig bearbeiten.
+- **Teilen Sie Dokumente** mit Teamkollegen oder machen Sie sie öffentlich – standardmäßig privat, mit den Rollen Betrachter/Bearbeiter/Administrator.
+- **Bitten Sie den Agenten um etwas**: „Schreiben Sie diesen Absatz neu.“ „Fügen Sie oben ein TL;DR hinzu.“ „Hier finden Sie alle meine Besprechungsnotizen von letzter Woche.“ „Machen Sie diesen Ton formeller.“
+
+## Erste Schritte
+
+Live-Demo: [content.agent-native.com](https://content.agent-native.com).
+
+Wenn Sie die App öffnen, klicken Sie in der Seitenleiste auf **+ Neue Seite**, geben Sie ihr einen Titel und beginnen Sie mit dem Schreiben. Um den Agenten zu verwenden, geben Sie in der Seitenleiste Folgendes ein:
+
+- „Erstellen Sie eine Seite mit dem Namen „Onboarding“ und fügen Sie darunter drei Unterseiten hinzu.“
+- "Schreiben Sie diesen Absatz um, um ihn prägnanter zu gestalten." (bei geöffneter Seite)
+- „Fügen Sie einen Abschnitt über die Preise mit drei Aufzählungspunkten hinzu.“
+- „Fassen Sie dieses Dokument oben in einem TL;DR zusammen.“
+- "Laden Sie die neueste Version von Notion herunter." (nach der Verlinkung einer Notion-Seite)
+
+Wählen Sie Text aus und drücken Sie Befehl+I, um den Agenten mit dieser vorinstallierten Auswahl zu fokussieren – „machen Sie dies aussagekräftiger“ und bearbeiten Sie dann genau das, was Sie hervorgehoben haben.
+
+## Lokale Markdown/MDX-Dateien {#local-files}
+
+Content kann Dokumente durch lokale Dateien weiterleiten, ohne sie zu klonen oder auszuführen
+die Content-App lokal. Es fühlt sich an wie Obsidian für MDX: Dateien bleiben einsehbar
+und bearbeitbar, während die App Ihnen einen umfangreichen Editor, Agent actions, Teilen und
+benutzerdefinierte Blöcke. Öffnen Sie `/local-files` und wählen Sie einen Ordner in Ihrem Browser oder Agent
+Native Desktop und exportieren Sie den aktuellen Dokumentbaum als Markdown/MDX unter
+`content/`.
+
+Jede exportierte Datei enthält Vorlagen für Dokumentmetadaten (`id`, `title`,
+`parentId`, `position`, Favoriten-/Such-/Sichtbarkeitsflags und `updatedAt`) plus
+der Dokumentkörper als Markdown. Sie können diese Dateien in Ihrem normalen Editor bearbeiten
+Kehren Sie dann zu `/local-files` zurück, um eine Vorschau anzuzeigen und die Änderungen wieder in Content zu importieren.
+
+Dieser Workflow ist nützlich, wenn Sie Inhalte in der Quellcodeverwaltung haben und stapelweise verarbeiten möchten
+Bearbeiten Sie Dokumente mit lokalen Tools oder wünschen Sie sich einen Pfad ohne Klonen für Teams, die Dateien bevorzugen
+als Überprüfungsoberfläche. Die gehostete App bleibt die Quelle der Wahrheit für das Teilen.
+Kommentare, Berechtigungen und Live-Zusammenarbeit; Der lokale Ordner ist ein expliziter
+Oberfläche synchronisieren.
+
+Inhalte können auch im **Lokalen Dateimodus** ausgeführt werden, wobei Dateien die Quelle sind
+Wahrheit statt SQL Dokumente. `agent-native.json` zu einem Repo hinzufügen, set
+`mode: "local-files"` und konfigurieren Sie Roots wie `docs/`, `blog/`
+`content/` und `resources/`. Der Standard-Inhaltseditor füllt dann dessen
+linkte Seitenleiste aus diesen lokalen `.md`/`.mdx`-Dateien und schreibt Änderungen zurück in die
+ausgewählte Datei durch das normale Dokument actions. Verwenden Sie dies für Repo-First-Dokumente
+Blogs, Ressourcenbibliotheken oder persönliche Inhalte im Obsidian-Stil mit MDX-Unterstützung
+Komponenten; Wechseln Sie zurück in den Datenbankmodus, wenn Sie eine gehostete Zusammenarbeit wünschen und
+SQL-gestütztes Teilen. Siehe [Local File Mode](/docs/local-file-mode) für
+eigenständiges Repo-Layout, Konfiguration, benutzerdefinierte MDX-Komponenten, lokal
+`extensions/`-Widgets und Leitfaden zur Produktionssicherheit.
+
+So installieren Sie den Content Local-Files-Skill in einem vorhandenen Repository:
+
+```bash
+npx @agent-native/core@latest skills add content --mode local-files --scope project
+```
+
+Das Installationsprogramm kopiert den `content`-Skill für Ihren Coding-Agent und schreibt oder
+aktualisiert `agent-native.json` mit Inhaltswurzeln für `docs/`, `blog/`, `content/`
+und `resources/`. Wenn eine lokale Content-App, Agent Native Desktop oder vertrauenswürdig
+Lokale Bridge läuft, Agenten sollten Content actions wie
+`list-documents`, `get-document`, `edit-document`, `update-document` und
+`share-local-file-document` anstelle von unformatierten Dateisystem-Schreibvorgängen. Ohne dieses lokale
+bridge, der installierte Skill gibt dem Agent weiterhin den Repo-Bearbeitungsvertrag für
+sichere Markdown/MDX-Änderungen.
+
+## Für Entwickler
+
+Der Rest dieses Dokuments richtet sich an alle, die die Inhaltsvorlage verzweigen oder erweitern.
+
+### Schnellstart
+
+Erstellen Sie ein Gerüst für einen neuen Arbeitsbereich mit der Inhaltsvorlage:
+
+```bash
+npx @agent-native/core@latest create my-workspace --standalone --template content
+cd my-workspace
+pnpm install
+pnpm dev
+```
+
+Öffnen Sie `http://localhost:8083` und erstellen Sie Ihre erste Seite. Bitten Sie dann den Agenten, „eine Seite mit dem Namen „Onboarding“ zu erstellen und darunter drei Unterseiten hinzuzufügen.
+
+### Hauptfunktionen {#key-features}
+
+**Verschachtelte Seiten.** Dokumente bilden einen ziehbaren Baum mit Favoriten, Symbolen, Reihenfolge und Freigabe auf Seitenebene.
+
+**Umfangreicher MDX-Editor.** Tiptap unterstützt Überschriften, Listen, Tabellen, Codeblöcke, Bilder, Links, Schrägstrichbefehle, Auswahlsymbolleisten und lokale React-Komponenten.
+
+**Live-Zusammenarbeit.** Yjs hält die Bearbeitungen mehrerer Redakteure und Agenten synchron, ohne sich gegenseitig zu behindern.
+
+**Suche und Kommentare.** Volltextsuche, verankerte Kommentare, Versionsverlauf und Wiederherstellungsabläufe sind in die Dokumentoberfläche integriert.
+
+**Oberflächen synchronisieren.** Dokumente können mit Notion oder lokalen Markdown/MDX-Ordnern synchronisiert werden, wobei SQL als kollaborative Cache-/Verlaufsebene fungiert.
+
+### Lokale Dateisynchronisierung
+
+Die geschützte `/local-files`-Route verwendet den Browser-Dateisystemzugriff API oder einen
+Geschützte native Ordnerbrücke im Agent Native Desktop zum Lesen und Schreiben
+Markdown/MDX-Dateien aus einem vom Benutzer ausgewählten Ordner. Nachdem der Ordner verknüpft wurde und
+Importiert wird die ausgewählte Datei als Autorität behandelt: Beim Öffnen der Seite wird Folgendes angezeigt:
+die Datei, und der normale Editor speichert zuerst die Datei. SQL wird dann als
+Cache-/Verlaufsebene für das vorhandene Dokument UI, Such- und Versionsfenster, nicht
+als Quelle der Wahrheit. Das Seitenmenü oben rechts zeigt den lokalen Quellpfad an:
+Der relative Pfad ist immer verfügbar, der absolute Pfad ist in der echten lokalen Datei verfügbar
+-Modus und Agent Native Desktop, und „Im Finder anzeigen“ ist über den
+Desktop Bridge oder servergestützter lokaler Dateimodus.
+
+Die Massensynchronisierungsroutenaufrufe:
+
+- `export-content-source` – liest den zugänglichen Dokumentbaum und gibt ein
+  deterministisches `content/`-Dateipaket.
+- `import-content-source` – validiert Dateien, erstellt neue private Dokumente
+  aktualisiert Dokumente, bei denen der Aufrufer Editorzugriff hat, und behält die Version bei
+  Verlauf und lehnt ungültige übergeordnete Zyklen ab.
+
+Das Quellformat befindet sich in `shared/content-source.ts`. Behalten Sie diese Datei als
+Einzelvertrag für Dateinamen, Frontmatter, Parsing und Serialisierung.
+
+Lokale Dateiarbeitsbereiche können über das auch repo-lokale React-Komponenten bereitstellen
+konfigurierter `components`-Ordner. Der Content-Entwicklungsserver importiert PascalCase
+Exportiert aus diesen Dateien und rendert passende MDX-Tags wie `<ImpactCounter />`
+im Editor und stellt sie im Slash-Menü unter „Lokale Komponenten“ bereit.
+Dies ist die Ebene „Obsidian für MDX“: Benutzerdefinierte MDX-Blöcke bleiben lokal auf der
+Arbeitsbereich, aber der Editor kann sie rendern und der Agent kann sie generieren oder aktualisieren
+ihre Quelle, ohne die Content-App zu klonen. Eine minimale Arbeitsbereichskomponente kann
+sein:
+
+```tsx
+// components/ImpactCounter.tsx
+import { useState } from "react";
+
+export function ImpactCounter({
+  label = "points",
+  start = 3,
+}: {
+  label?: string;
+  start?: number;
+}) {
+  const [count, setCount] = useState(start);
+  return (
+    <button type="button" onClick={() => setCount(count + 1)}>
+      Impact: {count} {label}
+    </button>
+  );
+}
+
+export const ImpactCounterInputs = {
+  label: { type: "string", label: "Label", default: "points" },
+  start: { type: "number", label: "Starting count", default: 3 },
+};
+```
+
+Verwenden Sie es im lokalen MDX als `<ImpactCounter />` oder fügen Sie es über den Editor-Schrägstrich ein
+Menü unter Lokale Komponenten. Wenn Eingabemetadaten exportiert werden, wählen Sie die Option
+Komponente im Editor zeigt eine Eckbearbeitungsschaltfläche an, die die MDX-Requisiten neu schreibt
+in der lokalen Datei.
+
+Die **Lokale Dateien**-Auswahl des Browsers kann `.md`- und `.mdx`-Dateien lesen und schreiben
+seine eigenen, aber ausführbaren React-Komponentenvorschauen erfordern einen lokalen Compiler. Ausführen
+Inhalt lokal oder verwenden Sie Agent Native Desktop, damit der ausgewählte Arbeitsbereichspfad möglich ist
+müssen beim lokalen Content-Entwicklungsserver registriert sein. Vite importiert dann
+`components/*.tsx`, lädt Änderungen an vorhandenen Komponentendateien im laufenden Betrieb neu und lädt
+die Komponentenregistrierung, wenn Dateien hinzugefügt oder entfernt werden. Agenten können
+`list-local-component-files` und `write-local-component-file` zur Inspektion oder
+Aktualisieren Sie registrierte Komponentendateien, während der Editor von derselben Quelle aktualisiert.
+
+### Kommentare
+
+Thread-Kommentare zu Dokumenten mit zitierten Textankern, Antworten und Lösungsstatus. Unterstützt durch die Tabelle `document_comments` und `app/components/editor/CommentsSidebar.tsx`. Actions: `list-comments`, `add-comment`. Notion-Kommentare können über `sync-notion-comments` in beide Richtungen synchronisiert werden.
+
+### Versionsverlauf
+
+Jedes bedeutende Update erstellt einen Snapshot einer Zeile in der `document_versions`-Tabelle. Der UI stellt diese in `app/components/editor/VersionHistoryPanel.tsx` dar.
+
+### Teilen und Sichtbarkeit
+
+Dokumente sind standardmäßig privat. Sie können die Sichtbarkeit auf `org` oder `public` ändern oder Rollen pro Benutzer und pro Organisation gewähren (`viewer`, `editor`, `admin`). Die automatisch gemountete Freigabe des Frameworks actions funktioniert sofort:
+
+- `share-resource --resourceType document --resourceId <id> --principalType user --principalId <email> --role editor`
+- `unshare-resource` / `list-resource-shares` / `set-resource-visibility`
+
+Siehe den `sharing`-Skill.
+
+### Teams
+
+Eine spezielle Teamseite bei `/team` (siehe `app/routes/_app.team.tsx`) nutzt die `TeamPage`-Komponente des Frameworks zum Erstellen von Organisationen und zum Verwalten von Mitgliedern.
+
+### Zusammenarbeit mit dem Agenten
+
+Da der Agent Ihren aktuellen Bildschirm sieht, müssen Sie bei den meisten Eingabeaufforderungen nicht explizit auf ein Dokument verweisen. Wenn Sie eine Seite geöffnet haben, bedeutet „dies“ diese Seite.
+
+Für kleine Änderungen verwendet der Agent `edit-document --find ... --replace ...`, sodass nur der geänderte Text durch Yjs fließt – Sie sehen, wie der Unterschied direkt angewendet wird und nicht die gesamte Seite neu gerendert wird. Für größere Umschreibungen wird `update-document --content ...` verwendet.
+
+Wenn Sie Text auswählen und Befehl+I drücken (oder den Agentenbereich fokussieren), wird die Auswahl mit Ihrer nächsten Nachricht als Kontext übertragen, sodass „dies aussagekräftiger machen“ genau das betrifft, was Sie hervorgehoben haben.
+
+### Datenbanken und Eigenschaften
+
+Dokumente können Inline-Datenbanken hosten – Tabellen im Notion-Stil, bei denen jede Zeile selbst ein Dokument ist. Der Agent kann über actions: `create-content-database`, `add-database-item`, `set-document-property` Datenbanken erstellen, Elemente hinzufügen, Spaltendefinitionen konfigurieren und Eigenschaftswerte festlegen. Eigenschaftsdefinitionen (Typ, Sichtbarkeit, Optionen, Position) sind live in `document_property_definitions`; Werte pro Zeile leben in `document_property_values`.
+
+### Zusätzliches actions
+
+Über die CRUD-Oberfläche im Datenmodell hinaus enthält die Vorlage `export-document` zum Konvertieren einer Seite in Markdown oder HTML, `transcribe-media` zum Anhängen eines Transkripts an eine Seite und `restore-document-version` zum Zurücksetzen auf einen früheren Snapshot.
+
+### Datenmodell
+
+Neun Tabellen, alle definiert in `server/db/schema.ts`:
+
+- **`documents`** – der Seitenbaum. Spalten: `id`, `parent_id`, `title`, `content` (Abschlag), `icon`, `position`, `is_favorite`, `visibility`, `owner_email`, `org_id`, `created_at`, `updated_at`.
+- **`document_versions`** – vollständige Schnappschüsse von Titel und Inhalt für den Versionsverlauf. Rollback mit `restore-document-version`.
+- **`document_comments`** – Thread-Kommentare mit `thread_id`, `parent_id`, `quoted_text`, `resolved` und einem optionalen `notion_comment_id` für bidirektionale Notion-Synchronisierung.
+- **`document_sync_links`** – eine Zeile pro mit Notion verknüpfter Dokumentverfolgung, Remote-Seiten-ID, letzte Synchronisierungszeiten, Konfliktstatus, Inhalts-Hash und Fehler.
+- **`document_property_definitions`** – Spaltendefinitionen für Inline-Datenbanken: Name, Typ, Sichtbarkeit, Optionen und Position.
+- **`content_databases`** – Inline-Datenbankobjekte, die an einen `document_id` mit einer Titel- und Ansichtskonfiguration JSON angehängt sind.
+- **`content_database_items`** – Zeilen in einer Inline-Datenbank, die jeweils einen `database_id` mit einem `document_id` verknüpfen.
+- **`document_property_values`** – Eigenschaftswerte pro Dokument (`property_id` → `value_json`).
+- **`document_shares`** – über `createSharesTable` erstellte Zuschüsse pro Benutzer und pro Organisation.
+
+```an-schema title="Content data model" summary="Nine tables in server/db/schema.ts. documents is the page tree; the rest hang off it for versions, comments, Notion sync, inline databases, and sharing."
+{
+  "entities": [
+    {
+      "id": "documents",
+      "name": "documents",
+      "note": "The page tree (ownable, markdown body)",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "parent_id", "type": "id", "fk": "documents.id", "nullable": true, "note": "infinite nesting" },
+        { "name": "title", "type": "string" },
+        { "name": "content", "type": "markdown" },
+        { "name": "icon", "type": "string", "nullable": true },
+        { "name": "position", "type": "int", "note": "sibling ordering" },
+        { "name": "is_favorite", "type": "bool" },
+        { "name": "visibility", "type": "enum", "note": "private | org | public" },
+        { "name": "owner_email", "type": "string" },
+        { "name": "org_id", "type": "id", "nullable": true }
+      ]
+    },
+    {
+      "id": "document_versions",
+      "name": "document_versions",
+      "note": "Full title/content snapshots for version history",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "document_id", "type": "id", "fk": "documents.id" },
+        { "name": "title", "type": "string" },
+        { "name": "content", "type": "markdown" }
+      ]
+    },
+    {
+      "id": "document_comments",
+      "name": "document_comments",
+      "note": "Threaded comments with quoted-text anchors",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "document_id", "type": "id", "fk": "documents.id" },
+        { "name": "thread_id", "type": "id" },
+        { "name": "parent_id", "type": "id", "fk": "document_comments.id", "nullable": true },
+        { "name": "quoted_text", "type": "string", "nullable": true },
+        { "name": "resolved", "type": "bool" },
+        { "name": "notion_comment_id", "type": "string", "nullable": true, "note": "bidirectional Notion sync" }
+      ]
+    },
+    {
+      "id": "document_sync_links",
+      "name": "document_sync_links",
+      "note": "One row per Notion-linked document",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "document_id", "type": "id", "fk": "documents.id" },
+        { "name": "notion_page_id", "type": "string" },
+        { "name": "conflict", "type": "bool" },
+        { "name": "content_hash", "type": "string" }
+      ]
+    },
+    {
+      "id": "content_databases",
+      "name": "content_databases",
+      "note": "Inline database objects attached to a document",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "document_id", "type": "id", "fk": "documents.id" },
+        { "name": "title", "type": "string" },
+        { "name": "view_config", "type": "json" }
+      ]
+    },
+    {
+      "id": "content_database_items",
+      "name": "content_database_items",
+      "note": "Rows in an inline database (each row is a document)",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "database_id", "type": "id", "fk": "content_databases.id" },
+        { "name": "document_id", "type": "id", "fk": "documents.id" }
+      ]
+    },
+    {
+      "id": "document_property_definitions",
+      "name": "document_property_definitions",
+      "note": "Column definitions for inline databases",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "name", "type": "string" },
+        { "name": "type", "type": "string" },
+        { "name": "options", "type": "json", "nullable": true },
+        { "name": "position", "type": "int" }
+      ]
+    },
+    {
+      "id": "document_property_values",
+      "name": "document_property_values",
+      "note": "Per-document property values",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "document_id", "type": "id", "fk": "documents.id" },
+        { "name": "property_id", "type": "id", "fk": "document_property_definitions.id" },
+        { "name": "value_json", "type": "json" }
+      ]
+    },
+    {
+      "id": "document_shares",
+      "name": "document_shares",
+      "note": "Per-user and per-org grants (createSharesTable)",
+      "fields": [
+        { "name": "id", "type": "id", "pk": true },
+        { "name": "document_id", "type": "id", "fk": "documents.id" },
+        { "name": "principal", "type": "string" },
+        { "name": "role", "type": "enum", "note": "viewer | editor | admin" }
+      ]
+    }
+  ],
+  "relations": [
+    { "from": "documents", "to": "documents", "kind": "1-n", "label": "has children" },
+    { "from": "documents", "to": "document_versions", "kind": "1-n", "label": "has snapshots" },
+    { "from": "documents", "to": "document_comments", "kind": "1-n", "label": "has comments" },
+    { "from": "documents", "to": "document_sync_links", "kind": "1-1", "label": "links to Notion" },
+    { "from": "documents", "to": "content_databases", "kind": "1-n", "label": "hosts databases" },
+    { "from": "content_databases", "to": "content_database_items", "kind": "1-n", "label": "has rows" },
+    { "from": "document_property_definitions", "to": "document_property_values", "kind": "1-n", "label": "has values" },
+    { "from": "documents", "to": "document_shares", "kind": "1-n", "label": "has share grants" }
+  ]
+}
+```
+
+Inhalt wird als Markdown gespeichert. Der Editor konvertiert im Speicher zum und vom Tiptap JSON-Modell; Die SQL-Zeile ist immer ein Markdown, sodass actions, Suche und Notion-Synchronisierung in einem einzigen kanonischen Format ausgeführt werden können.
+
+Alle besitzbaren Tabellen umfassen `owner_email` und `org_id` über `ownableColumns()`, sodass jede Zeile ab dem Zeitpunkt ihrer Erstellung auf den angemeldeten Benutzer (und optional dessen aktive Organisation) beschränkt ist.
+
+### Anpassen
+
+Die vier Orte, an denen Sie bei einer Verhaltensänderung suchen sollten:
+
+- **`actions/`** – jede Operation, die der Agent oder UI ausführen kann. Fügen Sie mit `defineAction` eine neue Datei wie `actions/publish-to-wordpress.ts` hinzu und beide Seiten erhalten sie kostenlos. Schlüssel bestehender actions: `create-document.ts`, `edit-document.ts`, `update-document.ts`, `delete-document.ts`, `list-documents.ts`, `search-documents.ts`, `get-document.ts`, `pull-notion-page.ts`, `push-notion-page.ts`, `add-comment.ts`, `view-screen.ts`, `navigate.ts`.
+- **`app/routes/`** – die Seitenoberfläche. `_app.tsx` ist das weglose Layout, bei dem die Seitenleiste und das Agentenfeld montiert bleiben; `_app._index.tsx` ist die Landeansicht; `_app.page.$id.tsx` ist die Editor-Route; `_app.team.tsx` ist die Seite mit den Teameinstellungen.
+- **`app/components/editor/`** – der Tiptap-Editor. Fügen Sie unter `extensions/` einen neuen Knotentyp hinzu und registrieren Sie ihn in `DocumentEditor.tsx`. Die Blasensymbolleiste, das Schrägstrichmenü und die Hover-Vorschau sind alles Komponentendateien, die Sie bearbeiten können.
+- **`.agents/skills/`** – Anleitung, die der Agent liest, bevor er handelt. Wenn Sie eine neue Funktion hinzufügen (z. B. eine CMS-Veröffentlichungspipeline), legen Sie eine `SKILL.md` in einem neuen Skill-Ordner ab, damit der Agent sie korrekt verwendet. Vorhandene skills: `document-editing`, `notion-integration`, `real-time-sync`, `delegate-to-agent`, `storing-data`, `self-modifying-code`, `security`, `frontend-design`, `create-skill`, `capture-learnings`.
+- **`AGENTS.md`** – der Leitfaden für Agenten der obersten Ebene mit dem Aktions-Spickzettel und der Tabelle mit häufigen Aufgaben. Aktualisieren Sie es, wann immer Sie eine wichtige Funktion hinzufügen, damit der Agent sie erkennt, ohne sie erkunden zu müssen.
+- **`server/db/schema.ts`** – Datenmodell. Fügen Sie hier eine Spalte oder Tabelle hinzu. Die Inhaltsvorlage enthält kein `db:push`-Skript. Es basiert auf streng additiven Migrationen, die beim Start ausgeführt werden. Bearbeiten Sie `server/db/schema.ts`, schreiben Sie eine entsprechende additive Migration, und die Änderung wird beim nächsten Start der App übernommen. Schemaaktualisierungen dürfen niemals vorhandene Tabellen oder Spalten löschen, umbenennen oder destruktiv ändern (Richtlinien finden Sie unter [Database](/docs/database#migrations)).
+- **`shared/notion-markdown.ts`** – Konvertierung von Abschriften in Notion-Blöcke. Erweitern Sie dies, wenn Sie neue Blocktypen hinzufügen, die einen Roundtrip durch Notion erfordern.
+
+Der Agent kann alle diese Änderungen selbst vornehmen – bitten Sie ihn, „Dokumenten eine Tag-Spalte hinzuzufügen und sie in der Seitenleiste anzuzeigen“, und er aktualisiert das Schema, migriert, verbindet UI und schreibt die Aktion.

package/corpus/core/docs/content/locales/de-DE/template-design.md

@@ -0,0 +1,173 @@
+---
+title: "Design"
+description: "Ein agentennatives HTML-Prototyping-Studio – generieren, verfeinern, zeigen Sie eine Vorschau an und exportieren Sie interaktive Alpine/Tailwind-Designs mit einem Agenten."
+---
+
+# Design
+
+Design ist ein agentennatives Prototyping-Studio. Anstelle einer geschichteten Zeichenfläche generiert der Agent vollständige, eigenständige Alpine/Tailwind HTML-Prototypen, rendert sie in einem Iframe und ermöglicht Ihnen die Verfeinerung des Ergebnisses mit Eingabeaufforderungen und Optimierungssteuerelementen.
+
+```an-wireframe
+{
+  "surface": "desktop",
+  "html": "<div style='display:flex;flex-direction:column;gap:14px;padding:18px;min-height:520px;box-sizing:border-box'><div style='display:flex;align-items:center;gap:10px'><h1 style='margin:0'>Product launch page</h1><span class='wf-pill accent'>Desktop</span><span class='wf-pill'>Tablet</span><span class='wf-pill'>Mobile</span><div style='flex:1'></div><button>Preview</button><button class='primary'>Export code</button></div><div class='wf-card' style='flex:1;display:grid;grid-template-rows:auto 1fr auto;gap:12px'><div style='display:flex;gap:8px'><span class='wf-pill accent'>Hero</span><span class='wf-pill'>Pricing</span><span class='wf-pill'>FAQ</span></div><div class='wf-box' style='display:flex;align-items:center;justify-content:center;min-height:230px'><strong>Generated HTML prototype</strong></div><div class='wf-card' style='display:flex;align-items:center;gap:10px'><span class='wf-muted'>Make the hero denser and the CTA clearer.</span><div style='flex:1'></div><button class='primary'>Apply revision</button></div></div></div>"
+}
+```
+
+Wenn Sie die App öffnen, befindet sich der generierte Prototyp im Mittelpunkt des Arbeitsbereichs, mit Vorschaumodi, Eingabeaufforderungen für Überarbeitungen und Exportsteuerelementen in unmittelbarer Nähe. Alles, was der Agent produziert, ist echtes HTML, das Sie verfeinern, exportieren oder weitergeben können.
+
+```an-diagram title="One artifact, no translation" summary="The agent generates standalone Alpine/Tailwind HTML; the iframe, the editable source, and every export all read the same files. A linked design system feeds tokens into each pass."
+{
+  "html": "<div class=\"diagram-design\"><div class=\"diagram-col\"><div class=\"diagram-node\">Prompt<br><small class=\"diagram-muted\">describe screen / page</small></div><div class=\"diagram-pill\">Design system</div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough><span class=\"diagram-pill accent\">Agent generate</span><small class=\"diagram-muted\">standalone HTML / JSX files</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>iframe preview<br><small class=\"diagram-muted\">tweak knobs · Cmd+I refine</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&#8635;</div><div class=\"diagram-panel center\"><span class=\"diagram-pill ok\">Export</span><small class=\"diagram-muted\">HTML · ZIP · PDF · handoff</small></div></div>",
+  "css": ".diagram-design{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-design .diagram-col{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.diagram-design .diagram-box{display:flex;flex-direction:column;gap:4px}.diagram-design .diagram-arrow{font-size:20px;line-height:1}.diagram-design .center{display:flex;flex-direction:column;align-items:center;gap:4px}"
+}
+```
+
+## Wann soll es ausgewählt werden?
+
+- **Sie möchten ein ausgefeiltes Landingpage-Konzept, eine Produktausrichtung oder eine Markenerkundung**, die das Tool als echtes HTML zurücklassen können – und nicht als mehrschichtige Zeichenfläche.
+- **Sie möchten einen funktionierenden interaktiven Prototyp** mit Alpine interactions- und Tailwind-Stil anstelle statischer Modelle.
+- **Sie möchten Wegbeschreibungen schnell vergleichen**, ein paar Varianten generieren, die stärkste auswählen und weiter verfeinern.
+- **Sie möchten, dass die Designausgabe Ihnen gehört** – exportieren Sie HTML, ZIP oder PDF oder übergeben Sie den Prototyp einem Codierungstool.
+
+## Was Sie damit machen können
+
+- **Generieren Sie vollständige Prototypen.** Beschreiben Sie den Bildschirm oder die Seite, die Sie benötigen, und der Agent erstellt ein funktionierendes HTML-Dokument mit Tailwind-Stil und Alpine interactions.
+- **Varianten vergleichen.** Beginnen Sie mit mehreren Richtungen, wählen Sie die stärkste aus und verfeinern Sie sie dann weiter.
+- **Optimieren Sie visuell.** Verwenden Sie die integrierten Optimierungssteuerelemente für häufige Änderungen oder bitten Sie den Agenten um Aktualisierungen von Text, Layout, Farbe, Abstand und Interaktion.
+- **Wenden Sie Designsysteme an.** Speichern Sie Designsystemeinstellungen und verwenden Sie sie wieder, damit die generierte Arbeit näher an Ihrer Marke bleibt.
+- **Referenzen importieren.** Vorhandenes HTML oder Referenzmaterial als Kontext für einen neuen Designdurchlauf einbinden.
+- **Echte Dateien exportieren.** HTML, ZIP oder PDF aus dem generierten Prototyp exportieren.
+
+## Erste Schritte
+
+Live-Demo: [design.agent-native.com](https://design.agent-native.com).
+
+1. **Beschreiben Sie das Artefakt.** Fragen Sie nach dem Bildschirm, Ablauf, der Zielseite oder dem visuellen Element
+   Gewünschte Richtung. Berücksichtigen Sie Zielgruppe, Ton und Produktbeschränkungen.
+2. **Anweisungen vergleichen.** Generieren Sie einige Varianten, wählen Sie die stärkste aus und
+   Verfeinern Sie weiter, anstatt von vorne zu beginnen.
+3. **Optimieren Sie die Details.** Verwenden Sie Optimierungssteuerelemente für häufige visuelle Änderungen oder fragen Sie nach.
+   der Agent für Layout-, Kopier-, Reaktions- und Interaktionsänderungen.
+4. **Exportieren, wenn es nützlich ist.** Laden Sie HTML, ZIP oder PDF einmal als Prototyp herunter
+   ist bereit zur Weitergabe an ein anderes Werkzeug oder einen Teamkollegen.
+
+### Nützliche Eingabeaufforderungen
+
+- „Erstellen Sie drei Landingpage-Anweisungen für ein technisches Analyseprodukt.“
+- „Machen Sie dieses Dashboard kompakter und für ein Betriebsteam einfacher zu durchsuchen.“
+- „Wenden Sie unser gespeichertes Designsystem an und vereinfachen Sie das mobile Layout.“
+- „Exportieren Sie diesen Prototyp als ZIP, sobald die endgültige Variante ausgewählt ist.“
+- „Verwandeln Sie dieses HTML in eine stärkere Preisseite, ohne die Markenfarben zu ändern.“
+
+## Für Entwickler
+
+Der Rest dieses Dokuments richtet sich an alle, die die Design-Vorlage verzweigen oder erweitern.
+
+### Schnellstart
+
+```bash
+npx @agent-native/core@latest create my-design --standalone --template design
+cd my-design
+pnpm install
+pnpm dev
+```
+
+### Datenmodell
+
+Alle Daten befinden sich in SQL über Drizzle ORM. Schema: `templates/design/server/db/schema.ts`. Designs und Designsysteme verfügen über den Standard `ownableColumns` und eine passende Framework-Freigabentabelle, sodass sie in das Freigabemodell pro Benutzer/pro Organisation passen.
+
+| Tabelle                                  | Was es enthält                                                                                                                                      |
+| ---------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `designs`                                | Ein Designprojekt – `title`, `description`, `project_type` (`prototype` / `other`), der `data` JSON Blob und ein optionaler `design_system_id`-Link |
+| `design_files`                           | Einzelne Dateien, die zu einem Design gehören (`filename`, `content`, `file_type`, standardmäßig `html`)                                            |
+| `design_versions`                        | Zeitpunkt-`snapshot`s eines Designs mit einem optionalen `label` für Verlauf und Rollback                                                           |
+| `design_systems`                         | Wiederverwendbare Markentokens – `data` (Farben/Typografie/Abstände), `assets`, `custom_instructions` und eine `is_default`-Flagge                  |
+| `design_shares` / `design_system_shares` | Framework teilt Tabellen, die Prinzipale (Benutzer oder Organisationen) Rollen (Betrachter, Bearbeiter, Administrator) zuordnen                     |
+
+```an-schema title="Design data model" summary="A design owns its files and versioned snapshots, and optionally links a reusable design system. Both designs and systems are ownable, each with a framework shares table."
+{
+  "entities": [
+    { "id": "designs", "name": "designs", "note": "A design project (ownable)", "fields": [
+      { "name": "id", "type": "id", "pk": true },
+      { "name": "title", "type": "text" },
+      { "name": "description", "type": "text", "nullable": true },
+      { "name": "project_type", "type": "text", "note": "prototype / other" },
+      { "name": "data", "type": "json", "note": "starts as {}" },
+      { "name": "design_system_id", "type": "id", "fk": "design_systems.id", "nullable": true }
+    ] },
+    { "id": "files", "name": "design_files", "note": "Files in a design", "fields": [
+      { "name": "design_id", "type": "id", "fk": "designs.id" },
+      { "name": "filename", "type": "text" },
+      { "name": "content", "type": "text" },
+      { "name": "file_type", "type": "text", "note": "defaults to html" }
+    ] },
+    { "id": "versions", "name": "design_versions", "note": "History / rollback", "fields": [
+      { "name": "design_id", "type": "id", "fk": "designs.id" },
+      { "name": "snapshot", "type": "json" },
+      { "name": "label", "type": "text", "nullable": true }
+    ] },
+    { "id": "systems", "name": "design_systems", "note": "Reusable brand tokens (ownable)", "fields": [
+      { "name": "id", "type": "id", "pk": true },
+      { "name": "data", "type": "json", "note": "colors / typography / spacing" },
+      { "name": "assets", "type": "json", "nullable": true },
+      { "name": "custom_instructions", "type": "text", "nullable": true },
+      { "name": "is_default", "type": "boolean" }
+    ] },
+    { "id": "design_shares", "name": "design_shares", "note": "Framework shares table", "fields": [
+      { "name": "design_id", "type": "id", "fk": "designs.id" },
+      { "name": "role", "type": "text", "note": "viewer / editor / admin" }
+    ] },
+    { "id": "system_shares", "name": "design_system_shares", "note": "Framework shares table", "fields": [
+      { "name": "design_system_id", "type": "id", "fk": "design_systems.id" },
+      { "name": "role", "type": "text", "note": "viewer / editor / admin" }
+    ] }
+  ],
+  "relations": [
+    { "from": "designs", "to": "files", "kind": "1-n" },
+    { "from": "designs", "to": "versions", "kind": "1-n" },
+    { "from": "systems", "to": "designs", "kind": "1-n", "label": "applied to" },
+    { "from": "designs", "to": "design_shares", "kind": "1-n" },
+    { "from": "systems", "to": "system_shares", "kind": "1-n" }
+  ]
+}
+```
+
+Ein Designprojekt ist eine Hülle, bis es Inhalt hat: `create-design` erstellt eine leere Zeile (`data: "{}"`), dann schreibt `generate-design` die eigentlichen eigenständigen HTML/JSX-Dateien. Das generierte Artefakt, die bearbeitbare Quelle und jeder Export stammen alle aus demselben HTML, sodass kein separates „AI-Mockup“-Format übersetzt werden muss. Ein verknüpftes Designsystem stellt Token und `custom_instructions` bereit, die der Agent bei jedem Generationsdurchlauf berücksichtigt.
+
+Routen im UI live unter `templates/design/app/routes/`: `_index.tsx` (Liste), `design.$id.tsx` (Herausgeber), `present.$id.tsx` (Präsentation), `design-systems.tsx` und `design-systems_.setup.tsx`, `templates.tsx`, `examples.tsx` sowie `settings.tsx` und `team.tsx`.
+
+### Schlüssel actions
+
+Jeder vom Agenten aufrufbare Vorgang ist eine TypeScript-Datei in `templates/design/actions/`, die automatisch bei `POST /_agent-native/actions/:name` gemountet wird und vom CLI als `pnpm action <name>` ausgeführt werden kann. Die Gruppierungen:
+
+- **Designs** – `create-design` (leere Shell), `generate-design` (generierten HTML/JSX-Inhalt schreiben), `update-design`, `get-design`, `list-designs`, `duplicate-design`, `delete-design` und `apply-tweaks` zum Beibehalten von Live-Tweak-Knopf-Werten (Akzentfarbe, Dichte, usw.).
+- **Dateien** – `create-file`, `update-file`, `list-files`, `delete-file` für die Dateien in einem Designprojekt.
+- **Designsysteme** – `create-design-system`, `update-design-system`, `get-design-system`, `list-design-systems`, `delete-design-system`, `set-default-design-system` und `analyze-brand-assets` zum Sammeln von Markendaten vor der Analyse.
+- **Importieren** – `import-code`, `import-figma`, `import-github`, `import-from-url`, `import-document` (DOCX/PPTX/PDF/XLSX) und `import-design-project`, um ein Designsystem aus einem vorhandenen Projekt zu entfernen.
+- **Export & Übergabe** – `export-html`, `export-pdf`, `export-svg`, `export-zip` und `export-coding-handoff`, um ein Design in eine Codierungstool-Übergabe umzuwandeln.
+- **Kontext und Navigation** – `view-screen` (aktuelles Design, offene Datei, Ansicht, ausstehende Frage oder Variantenraster), `get-design-snapshot` (aktueller Status, von dem aus ein externer Agent fortfahren kann) und `navigate`.
+
+### Zusammenarbeit mit dem Agenten
+
+Der Agent weiß immer, was Sie offen haben. Das aktuelle Design, die geöffnete Datei, die aktive Ansicht und alle ausstehenden Fragen oder Variantenraster werden von `view-screen` zurückgegeben und in jede Nachricht eingefügt, sodass Sie sagen können: „Machen Sie dies dichter“ oder „Exportieren Sie diese Variante“, ohne das Design zu benennen.
+
+Da es sich bei einem Design lediglich um eigenständige HTML/JSX-Dateien handelt, bearbeitet der Agent dieselbe Quelle, die der Iframe rendert, und jeder Export stammt aus – es gibt kein separates „AI-Mockup“-Format zum Übersetzen. Ein verknüpftes Designsystem liefert Token und `custom_instructions`, die der Agent bei jedem Generationsdurchlauf ehrt. Wählen Sie in der Vorschau Text oder einen Bereich aus und drücken Sie Befehl+I, um den Agenten genau auf diesen Teil zu konzentrieren.
+
+### Anpassen
+
+Design ist eine vollständige, klonbare Vorlage. Einige praktische Erweiterungsideen:
+
+- „Fügen Sie mit unseren Tokens und Beispielkomponenten ein wiederverwendbares E-Commerce-Designsystem hinzu.“
+- „Fügen Sie einen Exportschritt hinzu, der ZIP in unser internes Überprüfungssystem hochlädt.“
+- „Lassen Sie mich die vorhandene Zielseite HTML einfügen und den Agenten um drei stärkere Versionen bitten.“
+- „Fügen Sie eine gespeicherte Eingabeaufforderungsbibliothek für Produktseiten-, Dashboard- und Onboarding-Bildschirm-Briefings hinzu.“
+- „Fügen Sie eine benutzerdefinierte PDF-Exportvoreinstellung zur Überprüfung durch Stakeholder hinzu.“
+
+Der Agent bearbeitet Routen, Komponenten, actions- und SQL-gestützte Modelle nach Bedarf. Siehe [Templates](/docs/cloneable-saas) für den vollständigen Klon-, Anpassungs- und Bereitstellungsablauf und [Getting Started](/docs/getting-started), wenn dies Ihre erste agentennative Vorlage ist.
+
+## Was kommt als nächstes?
+
+- [**Templates**](/docs/cloneable-saas) – das Modell zum Klonen und Besitzen
+- [**Context Awareness**](/docs/context-awareness) – wie der Agent weiß, was der Benutzer sieht
+- [**Creating Templates**](/docs/creating-templates) – aktuelle Build-Muster für agentennative Vorlagen