Update docs: tool counts 75/78 → 87/90, schema.ts → tools/ directory, add RPC bridge
This commit is contained in:
Danila Poyarkov
parent
9882375b4f
commit
5ac70a5976
|
|
@ -9,7 +9,7 @@ packages/
|
|||
cli/ @open-pencil/cli — Headless-CLI für .fig-Operationen
|
||||
src/commands/ info, tree, find, export, eval, analyze
|
||||
mcp/ @open-pencil/mcp — MCP-Server für KI-Werkzeuge
|
||||
src/ stdio + HTTP (Hono) Transporte, 75 Werkzeuge
|
||||
src/ stdio + HTTP (Hono) Transporte, 87 Werkzeuge
|
||||
src/
|
||||
components/ Vue SFCs (Canvas, Panels, Werkzeugleiste, Farbauswahl)
|
||||
properties/ Eigenschaftspanel-Abschnitte
|
||||
|
|
@ -84,7 +84,7 @@ Engine-Quellcode lebt in `packages/core/src/`. Die `src/engine/`- und `src/kiwi/
|
|||
| `packages/core/src/vector.ts` | Vektornetzwerk-Modell |
|
||||
| `packages/core/src/kiwi/codec.ts` | Kiwi-Binär-Encoder/Decoder |
|
||||
| `packages/core/src/kiwi/fig-import.ts` | .fig-Datei-Import-Logik |
|
||||
| `packages/core/src/tools/schema.ts` | Vereinheitlichte Werkzeugdefinitionen (KI, MCP, CLI) |
|
||||
| `packages/core/src/tools/` | Vereinheitlichte Werkzeugdefinitionen (KI, MCP, CLI) |
|
||||
| `packages/core/src/figma-api.ts` | Figma Plugin API-Implementierung |
|
||||
| `packages/mcp/src/server.ts` | MCP-Server-Factory |
|
||||
| `packages/cli/src/index.ts` | CLI-Einstiegspunkt |
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@ Komponenten, Instanzen, Overrides, Komponenten-Sets, Variablen (COLOR/FLOAT/STRI
|
|||
- @open-pencil/core extrahiert in packages/core/ (keine DOM-Abhängigkeiten)
|
||||
- @open-pencil/cli mit headless .fig-Operationen (info, tree, find, export, analyze, node, pages, variables, eval)
|
||||
- `eval`-Befehl mit Figma-kompatibler Plugin API für Headless-Skripting
|
||||
- KI-Chat: OpenRouter-Direktverbindung, 75 Werkzeuge in `schema.ts`, Modellauswahl, ⌘J
|
||||
- KI-Chat: OpenRouter-Direktverbindung, 87 Werkzeuge in `packages/core/src/tools/`, Modellauswahl, ⌘J
|
||||
- 49 zusätzliche KI/MCP-Werkzeuge portiert von figma-use (75 gesamt)
|
||||
- MCP-Server (@open-pencil/mcp): stdio + HTTP, 75 Core-Tools + 3 Dateiverwaltungs-Tools
|
||||
- Vereinheitlichte Werkzeugdefinitionen: einmal in `schema.ts` definieren, für KI-Chat (valibot), MCP (zod), CLI (eval) adaptieren
|
||||
- MCP-Server (@open-pencil/mcp): stdio + HTTP, 87 Core-Tools + 3 Dateiverwaltungs-Tools
|
||||
- Vereinheitlichte Werkzeugdefinitionen: einmal in `packages/core/src/tools/` definieren, für KI-Chat (valibot), MCP (zod), CLI (eval) adaptieren
|
||||
- App-Menüleiste für Browser-Modus (Datei, Bearbeiten, Ansicht, Objekt, Text, Anordnen)
|
||||
- Automatisches Speichern: 3s Debounce nach letzter Szenenänderung
|
||||
- Multi-Selektion-Eigenschaftspanel mit gemeinsamen/gemischten Werten
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ Figma-kompatible bidirektionale Zwischenablage. Kodiert/dekodiert Kiwi-Binär (g
|
|||
|
||||
### MCP-Server
|
||||
|
||||
`@open-pencil/mcp` stellt 75 Core-Tools + 3 Dateiverwaltungs-Tools für KI-Coding-Werkzeuge bereit. Zwei Transporte: stdio für Claude Code/Cursor/Windsurf, HTTP mit Hono + Streamable HTTP für Skripte und CI. Tools werden einmal in `packages/core/src/tools/schema.ts` definiert und für AI-Chat (valibot), MCP (zod) und CLI (eval-Befehl) adaptiert.
|
||||
`@open-pencil/mcp` stellt 87 Core-Tools + 3 Dateiverwaltungs-Tools für KI-Coding-Werkzeuge bereit. Zwei Transporte: stdio für Claude Code/Cursor/Windsurf, HTTP mit Hono + Streamable HTTP für Skripte und CI. Tools werden einmal in `packages/core/src/tools/` definiert und für AI-Chat (valibot), MCP (zod) und CLI (eval-Befehl) adaptiert.
|
||||
|
||||
### P2P-Kollaboration
|
||||
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ Open Pencil und Penpot verwenden beide Skia für das Rendering, aber die Impleme
|
|||
| | Open Pencil | Penpot |
|
||||
|---|-------------|--------|
|
||||
| CLI | ✅ Headless .fig-Operationen | ❌ Kein CLI |
|
||||
| AI-Werkzeuge | **78 Werkzeuge** + MCP-Server | Plugin-System |
|
||||
| AI-Werkzeuge | **87 Werkzeuge** + MCP-Server | Plugin-System |
|
||||
| JSX-Renderer | ✅ Programmgesteuerte Erstellung | ❌ |
|
||||
| Eval-Befehl | ✅ Figma Plugin API | ❌ |
|
||||
| Plugin-System | Über eval/MCP | ✅ Natives Plugin-System |
|
||||
|
|
@ -97,7 +97,7 @@ Open Pencil und Penpot verwenden beide Skia für das Rendering, aber die Impleme
|
|||
| | Open Pencil | Penpot |
|
||||
|---|-------------|--------|
|
||||
| Integrierter Chat | ✅ OpenRouter-Integration | ❌ |
|
||||
| Werkzeugnutzung | 75 Design-Werkzeuge | ❌ |
|
||||
| Werkzeugnutzung | 87 Design-Werkzeuge | ❌ |
|
||||
| MCP-Server | ✅ stdio + HTTP | ❌ |
|
||||
| Bring your own key | ✅ Kein Vendor-Lock-in | ❌ |
|
||||
|
||||
|
|
@ -107,7 +107,7 @@ Open Pencil und Penpot verwenden beide Skia für das Rendering, aber die Impleme
|
|||
|---|-------------|--------|
|
||||
| Headless CLI | ✅ 12 Befehle | ❌ |
|
||||
| Plugin API | Figma-kompatibel | Eigene Plugin API |
|
||||
| MCP-Server | ✅ 78+ Werkzeuge | ❌ |
|
||||
| MCP-Server | ✅ 90 Werkzeuge | ❌ |
|
||||
| Eval-Befehl | ✅ JS-Ausführung | ❌ |
|
||||
| JSX-Renderer | ✅ Programmatisch | ❌ |
|
||||
|
||||
|
|
@ -118,11 +118,11 @@ Open Pencil und Penpot verwenden beide Skia für das Rendering, aber die Impleme
|
|||
| **Figma-Kompatibilität** | Open Pencil | Natives .fig + Zwischenablage |
|
||||
| **Programmierbarkeit** | Open Pencil | CLI, eval, JSX, MCP-Server |
|
||||
| **Desktop-Erlebnis** | Open Pencil | Native Tauri-App, ~5 MB |
|
||||
| **KI-Integration** | Open Pencil | 78 Werkzeuge, MCP, integrierter Chat |
|
||||
| **KI-Integration** | Open Pencil | 90 Werkzeuge, MCP, integrierter Chat |
|
||||
| **Codebasis-Einfachheit** | Open Pencil | 11× weniger Code, 1 Sprache |
|
||||
| **CSS Grid** | Penpot | Yoga unterstützt es noch nicht |
|
||||
| **SVG-native** | Penpot | SVG ist die Muttersprache |
|
||||
| **Self-Hosting** | Penpot | Docker-bereit vs. Desktop-only |
|
||||
| **Ökosystem-Reife** | Penpot | Jahre der Produktion vs. frühe Phase |
|
||||
|
||||
Open Pencil ist architektonisch schlanker — ein Single-Process-CanvasKit-Renderer in ~26K LOC TypeScript, Figma-kompatibel by Design. Penpot ist eine Full-Stack-Plattform mit ~299K LOC über Clojure, ClojureScript, Rust und SCSS, plus eine Docker-Service-Flotte. Beide bieten jetzt Echtzeit-Kollaboration (unterschiedliche Architekturen: P2P vs. Server). Penpot hat ein Plugin-Ökosystem und serverseitigen PDF-Export; Open Pencil hat Figma-kompatibles Headless-Scripting, **78 KI/MCP-Werkzeuge**, SVG-Export und eine native Desktop-App.
|
||||
Open Pencil ist architektonisch schlanker — ein Single-Process-CanvasKit-Renderer in ~26K LOC TypeScript, Figma-kompatibel by Design. Penpot ist eine Full-Stack-Plattform mit ~299K LOC über Clojure, ClojureScript, Rust und SCSS, plus eine Docker-Service-Flotte. Beide bieten jetzt Echtzeit-Kollaboration (unterschiedliche Architekturen: P2P vs. Server). Penpot hat ein Plugin-Ökosystem und serverseitigen PDF-Export; Open Pencil hat Figma-kompatibles Headless-Scripting, **90 KI/MCP-Werkzeuge**, SVG-Export und eine native Desktop-App.
|
||||
|
|
|
|||
|
|
@ -225,7 +225,7 @@ Ein HUD-Overlay zeigt Frame-Timing, GPU-Phasen und Frame-Budget. Zugänglich üb
|
|||
|
||||
## KI-Chat
|
||||
|
||||
Integrierter KI-Assistent über den KI-Tab oder <kbd>⌘</kbd><kbd>J</kbd>. Kommuniziert direkt mit OpenRouter. **78 Werkzeuge** für Lesen, Erstellen, Ändern und Organisieren von Design-Elementen. **MCP-Server** für externe KI-Coding-Tools.
|
||||
Integrierter KI-Assistent über den KI-Tab oder <kbd>⌘</kbd><kbd>J</kbd>. Kommuniziert direkt mit OpenRouter. **87 Werkzeuge** für Lesen, Erstellen, Ändern und Organisieren von Design-Elementen. **MCP-Server** für externe KI-Coding-Tools.
|
||||
|
||||
## @open-pencil/core & CLI
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ Feature-für-Feature-Vergleich der Figma-Design-Funktionen mit dem aktuellen Imp
|
|||
| Benutzerdefinierte Dateiminiatur | 🔲 | Miniatur beim Export generiert, aber kein benutzerdefinierter Auswähler |
|
||||
| Nudge-Wert-Einstellungen | 🔲 | Standard 1px/10px; Figma erlaubt benutzerdefinierte Werte |
|
||||
| App-Menü (Browser-Modus) | ✅ | Datei, Bearbeiten, Ansicht, Objekt, Text, Anordnen; Tauri verwendet native Menüs |
|
||||
| KI-Werkzeuge | 🟡 | 78 Werkzeuge via OpenRouter + MCP-Server; noch keine KI-generierten Bilder oder KI-Suche |
|
||||
| KI-Werkzeuge | 🟡 | 90 Werkzeuge via OpenRouter + MCP-Server; noch keine KI-generierten Bilder oder KI-Suche |
|
||||
|
||||
## Ebenen & Formen
|
||||
|
||||
|
|
@ -215,7 +215,7 @@ Feature-für-Feature-Vergleich der Figma-Design-Funktionen mit dem aktuellen Imp
|
|||
| Code Connect | 🔲 | Design-Komponenten mit Code verknüpfen |
|
||||
| Code-Snippets | 🟡 | JSX-Export mit Hervorhebung und Kopieren; keine CSS/Swift/Kotlin-Snippets |
|
||||
| Figma für VS Code | 🔲 | Editor-Plugin-Integration |
|
||||
| MCP-Server | ✅ | @open-pencil/mcp mit stdio + HTTP-Transporten; 75 Kern-Werkzeuge + 3 Dateiverwaltung = 78 gesamt |
|
||||
| MCP-Server | ✅ | @open-pencil/mcp mit stdio + HTTP-Transporten; 87 Kern-Werkzeuge + 3 Dateiverwaltung = 90 gesamt |
|
||||
| CLI-Werkzeuge | ✅ | Headless-CLI: info, tree, find, export, analyze, node, pages, variables, eval; MCP-Server |
|
||||
|
||||
## Figma Draw
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
| **Dateiformat** | Kiwi-Binär + Zstd | Figmas eigenes Format — kompakt, schnelles Parsen, .fig-kompatibel |
|
||||
| **Kollaboration** | Trystero + Yjs | P2P-WebRTC über MQTT-Signalisierung, CRDT-Sync, y-indexeddb-Persistenz |
|
||||
| **Farbe** | culori | Farbraum-Konvertierungen (HSV, RGB, Hex) |
|
||||
| **KI/MCP** | MCP SDK + Hono | 75 Tools für KI-Coding-Werkzeuge, stdio- + HTTP-Transporte |
|
||||
| **KI/MCP** | MCP SDK + Hono | 87 Tools für KI-Coding-Werkzeuge, stdio- + HTTP-Transporte |
|
||||
| **Desktop** | Tauri v2 | ~5 MB native App (vs. Electrons ~100 MB), Rust-Backend |
|
||||
| **Build** | Vite 7 | Schnelles HMR, native ES-Module |
|
||||
| **Testing** | Playwright + bun:test | Visuelle Regression (E2E) + schnelle Unit-Tests |
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ packages/
|
|||
cli/ @open-pencil/cli — headless CLI for .fig operations
|
||||
src/commands/ info, tree, find, export, eval, analyze
|
||||
mcp/ @open-pencil/mcp — MCP server for AI tools
|
||||
src/ stdio + HTTP (Hono) transports, 75 tools
|
||||
src/ stdio + HTTP (Hono) transports, 87 tools
|
||||
src/
|
||||
components/ Vue SFCs (canvas, panels, toolbar, color picker)
|
||||
properties/ Property panel sections (Appearance, Fill, Stroke, etc.)
|
||||
|
|
@ -89,7 +89,7 @@ Engine source lives in `packages/core/src/`. The app's `src/engine/` and `src/ki
|
|||
| `packages/core/src/kiwi/codec.ts` | Kiwi binary encoder/decoder |
|
||||
| `packages/core/src/kiwi/fig-import.ts` | .fig file import logic |
|
||||
| `packages/cli/src/index.ts` | CLI entry point |
|
||||
| `packages/core/src/tools/schema.ts` | Unified tool definitions (AI, MCP, CLI) |
|
||||
| `packages/core/src/tools/` | Unified tool definitions split by domain (read, create, modify, structure, variables, vector, analyze) |
|
||||
| `packages/core/src/figma-api.ts` | Figma Plugin API implementation |
|
||||
| `packages/mcp/src/server.ts` | MCP server factory |
|
||||
| `packages/cli/src/commands/` | CLI commands (info, tree, find, export, eval, analyze) |
|
||||
|
|
|
|||
|
|
@ -107,10 +107,10 @@ Core extraction, CLI, MCP server, AI tools, eval command.
|
|||
- jscpd copy-paste detection (15.6% → 0.62%), kiwi-serialize.ts consolidation
|
||||
- .fig roundtrip tests with LFS fixtures (material3.fig 87K nodes, nuxtui.fig 314K nodes)
|
||||
- .fig import O(n²) → O(n) fix (37s → 535ms on 87K nodes), ByteBuffer optimization
|
||||
- AI chat: OpenRouter direct (no backend), Stronghold key storage, 75 tools defined once in `schema.ts`, model selector, ⌘J toggle, streaming markdown, Playwright tests with mock transport
|
||||
- 49 additional AI/MCP tools ported from figma-use (75 total): granular set tools, node operations, variable CRUD, boolean operations, vector path tools, viewport control
|
||||
- MCP server (@open-pencil/mcp): stdio + HTTP (Hono + Streamable HTTP with sessions), 75 core tools + 3 file management tools, runs on Bun and Node.js
|
||||
- Unified tool definitions: define once in `schema.ts`, adapt for AI chat (valibot), MCP (zod), CLI (eval)
|
||||
- AI chat: OpenRouter direct (no backend), Stronghold key storage, 87 tools split across domain files in `tools/`, model selector, ⌘J toggle, streaming markdown, Playwright tests with mock transport
|
||||
- 49 additional AI/MCP tools ported from figma-use (87 total): granular set tools, node operations, variable CRUD, boolean operations, vector path tools, viewport control
|
||||
- MCP server (@open-pencil/mcp): stdio + HTTP (Hono + Streamable HTTP with sessions), 87 core tools + 3 file management tools (90 total), runs on Bun and Node.js
|
||||
- Unified tool definitions: define once in `packages/core/src/tools/` (split by domain), adapt for AI chat (valibot), MCP (zod), CLI (eval)
|
||||
- Code panel: sceneNodeToJsx() export, Prism.js highlighting, line numbers, copy button, 14 tests
|
||||
- Properties panel restructured: Design | Code | AI tabs
|
||||
- App menu bar for browser mode (File, Edit, View, Object, Text, Arrange)
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ packages/
|
|||
cli/ @open-pencil/cli — CLI headless para operaciones .fig
|
||||
src/commands/ info, tree, find, export, eval, analyze
|
||||
mcp/ @open-pencil/mcp — servidor MCP para herramientas IA
|
||||
src/ Transportes stdio + HTTP (Hono), 75 herramientas
|
||||
src/ Transportes stdio + HTTP (Hono), 87 herramientas
|
||||
src/
|
||||
components/ Vue SFCs (canvas, paneles, barra de herramientas, selector de color)
|
||||
properties/ Secciones del panel de propiedades (Apariencia, Relleno, Trazo, etc.)
|
||||
|
|
@ -89,7 +89,7 @@ El código fuente del motor vive en `packages/core/src/`. Los directorios `src/e
|
|||
| `packages/core/src/kiwi/codec.ts` | Codificador/decodificador binario Kiwi |
|
||||
| `packages/core/src/kiwi/fig-import.ts` | Lógica de importación de archivos .fig |
|
||||
| `packages/cli/src/index.ts` | Punto de entrada del CLI |
|
||||
| `packages/core/src/tools/schema.ts` | Definiciones unificadas de herramientas (IA, MCP, CLI) |
|
||||
| `packages/core/src/tools/` | Definiciones unificadas de herramientas (IA, MCP, CLI) |
|
||||
| `packages/core/src/figma-api.ts` | Implementación de Figma Plugin API |
|
||||
| `packages/mcp/src/server.ts` | Factory del servidor MCP |
|
||||
| `packages/cli/src/commands/` | Comandos CLI (info, tree, find, export, eval, analyze) |
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@ Componentes, instancias, overrides, conjuntos de componentes, variables (COLOR/F
|
|||
- @open-pencil/core extraído a packages/core/ (sin dependencias DOM)
|
||||
- @open-pencil/cli con operaciones headless .fig (info, tree, find, export, analyze, eval)
|
||||
- Comando `eval` con API Plugin compatible con Figma
|
||||
- Chat IA: conexión directa OpenRouter, 75 herramientas en `schema.ts`, ⌘J
|
||||
- Chat IA: conexión directa OpenRouter, 87 herramientas en `packages/core/src/tools/`, ⌘J
|
||||
- 49 herramientas IA/MCP adicionales portadas de figma-use (75 en total)
|
||||
- Servidor MCP (@open-pencil/mcp): stdio + HTTP, 75 herramientas core + 3 de gestión de archivos
|
||||
- Definiciones de herramientas unificadas: definir una vez en `schema.ts`, adaptar para chat IA (valibot), MCP (zod), CLI (eval)
|
||||
- Servidor MCP (@open-pencil/mcp): stdio + HTTP, 87 herramientas core + 3 de gestión de archivos
|
||||
- Definiciones de herramientas unificadas: definir una vez en `packages/core/src/tools/` (por dominio), adaptar para chat IA (valibot), MCP (zod), CLI (eval)
|
||||
- Menú de aplicación para modo navegador
|
||||
- Autoguardado: escritura con debounce de 3s
|
||||
- Panel de propiedades multi-selección con valores compartidos/mixtos
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ Portapapeles bidireccional compatible con Figma. Codifica/decodifica binario Kiw
|
|||
|
||||
### Servidor MCP
|
||||
|
||||
`@open-pencil/mcp` expone 75 herramientas core + 3 herramientas de gestión de archivos para herramientas de codificación IA. Dos transportes: stdio para Claude Code/Cursor/Windsurf, HTTP con Hono + Streamable HTTP para scripts y CI. Las herramientas se definen una vez en `packages/core/src/tools/schema.ts` y se adaptan para chat IA (valibot), MCP (zod) y CLI (comando eval).
|
||||
`@open-pencil/mcp` expone 87 herramientas core + 3 herramientas de gestión de archivos para herramientas de codificación IA. Dos transportes: stdio para Claude Code/Cursor/Windsurf, HTTP con Hono + Streamable HTTP para scripts y CI. Las herramientas se definen una vez en `packages/core/src/tools/` y se adaptan para chat IA (valibot), MCP (zod) y CLI (comando eval).
|
||||
|
||||
### Colaboración P2P
|
||||
|
||||
|
|
|
|||
|
|
@ -242,7 +242,7 @@ El enfoque de Open Pencil es más simple y con menos overhead.
|
|||
|
||||
## 11. Scripting y extensibilidad
|
||||
|
||||
OpenPencil incluye un [comando `eval`](/eval-command) que proporciona una API de Plugin compatible con Figma para scripting headless. Además, 78 herramientas AI disponibles vía chat integrado, servidor MCP (stdio + HTTP) y CLI. Penpot tiene sistema de plugins con ejecución sandboxed pero sin API de scripting headless ni integración MCP.
|
||||
OpenPencil incluye un [comando `eval`](/eval-command) que proporciona una API de Plugin compatible con Figma para scripting headless. Además, 90 herramientas AI disponibles vía chat integrado, servidor MCP (stdio + HTTP) y CLI. Penpot tiene sistema de plugins con ejecución sandboxed pero sin API de scripting headless ni integración MCP.
|
||||
|
||||
## Resumen
|
||||
|
||||
|
|
@ -259,4 +259,4 @@ OpenPencil incluye un [comando `eval`](/eval-command) que proporciona una API de
|
|||
| **Self-hosting** | Penpot | Listo para Docker vs solo desktop |
|
||||
| **Madurez del ecosistema** | Penpot | Años de producción vs etapa temprana |
|
||||
|
||||
Open Pencil es arquitectónicamente más ligero — un renderer CanvasKit de proceso único en ~26K LOC de TypeScript, compatible con Figma por diseño. Penpot es una plataforma full-stack con ~299K LOC. Ambos ofrecen colaboración en tiempo real (P2P vs servidor). Penpot tiene ecosistema de plugins y exportación PDF en servidor; Open Pencil tiene scripting headless compatible con Figma, **78 herramientas AI/MCP**, exportación SVG y app desktop nativa.
|
||||
Open Pencil es arquitectónicamente más ligero — un renderer CanvasKit de proceso único en ~26K LOC de TypeScript, compatible con Figma por diseño. Penpot es una plataforma full-stack con ~299K LOC. Ambos ofrecen colaboración en tiempo real (P2P vs servidor). Penpot tiene ecosistema de plugins y exportación PDF en servidor; Open Pencil tiene scripting headless compatible con Figma, **90 herramientas AI/MCP**, exportación SVG y app desktop nativa.
|
||||
|
|
|
|||
|
|
@ -166,9 +166,9 @@ Creación programática de diseño vía funciones TreeNode builder exportadas de
|
|||
|
||||
Asistente IA integrado accesible vía la pestaña IA o <kbd>⌘</kbd><kbd>J</kbd>. Comunica directamente con OpenRouter — sin servidor backend requerido.
|
||||
|
||||
**75 herramientas** definidas en `packages/core/src/tools/schema.ts`, cubriendo: operaciones de lectura, creación, modificación, manipulación de nodos, CRUD de variables, herramientas de rutas vectoriales, control de viewport y un escape hatch `eval`. Las herramientas están conectadas al chat IA (schemas valibot), servidor MCP (schemas zod) y CLI (comando `eval`).
|
||||
**87 herramientas** definidas en `packages/core/src/tools/`, cubriendo: operaciones de lectura, creación, modificación, manipulación de nodos, CRUD de variables, herramientas de rutas vectoriales, control de viewport y un escape hatch `eval`. Las herramientas están conectadas al chat IA (schemas valibot), servidor MCP (schemas zod) y CLI (comando `eval`).
|
||||
|
||||
**Servidor MCP** (`packages/mcp/`) expone todas las herramientas para herramientas de codificación IA externas. Dos transportes: stdio y HTTP con Hono. Añade 3 herramientas de gestión de archivos sobre las 75 herramientas core (= 78 en total), para 78 en total.
|
||||
**Servidor MCP** (`packages/mcp/`) expone todas las herramientas para herramientas de codificación IA externas. Dos transportes: stdio y HTTP con Hono. Añade 3 herramientas de gestión de archivos sobre las 87 herramientas core (= 90 en total).
|
||||
|
||||
## Exportación SVG
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ Comparación característica por característica de las capacidades de Figma Des
|
|||
| Miniaturas personalizadas | 🔲 | Miniatura generada en export, pero sin selector de miniatura personalizada |
|
||||
| Configuración de valores de nudge | 🔲 | Por defecto 1px/10px; Figma permite valores personalizados |
|
||||
| Menú de app (modo navegador) | ✅ | Menús Archivo, Editar, Ver, Objeto, Texto, Organizar; Tauri usa menús nativos |
|
||||
| Herramientas IA | 🟡 | 78 herramientas vía OpenRouter + servidor MCP; sin imágenes generadas por IA ni búsqueda IA aún |
|
||||
| Herramientas IA | 🟡 | 90 herramientas vía OpenRouter + servidor MCP; sin imágenes generadas por IA ni búsqueda IA aún |
|
||||
|
||||
## Capas y formas
|
||||
|
||||
|
|
@ -215,7 +215,7 @@ Comparación característica por característica de las capacidades de Figma Des
|
|||
| Code Connect | 🔲 | Vincular componentes de diseño a código |
|
||||
| Fragmentos de código | 🟡 | Export JSX con resaltado y copia; sin fragmentos CSS/Swift/Kotlin |
|
||||
| Figma for VS Code | 🔲 | Integración con plugin de editor |
|
||||
| Servidor MCP | ✅ | @open-pencil/mcp con transportes stdio + HTTP; 75 herramientas core + 3 de gestión de archivos = 78 total |
|
||||
| Servidor MCP | ✅ | @open-pencil/mcp con transportes stdio + HTTP; 87 herramientas core + 3 de gestión de archivos = 90 total |
|
||||
| Herramientas CLI | ✅ | CLI headless: info, tree, find, export, analyze, node, pages, variables, eval; servidor MCP |
|
||||
|
||||
## Figma Draw
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
| **Formato de archivo** | Kiwi binario + Zstd | Formato propio de Figma — compacto, parseo rápido, compatible con .fig |
|
||||
| **Colaboración** | Trystero + Yjs | P2P WebRTC vía señalización MQTT, sync CRDT, persistencia y-indexeddb |
|
||||
| **Color** | culori | Conversiones de espacio de color (HSV, RGB, hex) |
|
||||
| **IA/MCP** | MCP SDK + Hono | 75 herramientas para codificación IA, transportes stdio + HTTP |
|
||||
| **IA/MCP** | MCP SDK + Hono | 87 herramientas para codificación IA, transportes stdio + HTTP |
|
||||
| **Desktop** | Tauri v2 | ~5 MB app nativa (vs ~100 MB de Electron), backend Rust |
|
||||
| **Build** | Vite 7 | HMR rápido, módulos ES nativos |
|
||||
| **Testing** | Playwright + bun:test | Regresión visual (E2E) + tests unitarios rápidos |
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ packages/
|
|||
cli/ @open-pencil/cli — CLI headless pour opérations .fig
|
||||
src/commands/ info, tree, find, export, eval, analyze
|
||||
mcp/ @open-pencil/mcp — serveur MCP pour outils IA
|
||||
src/ Transports stdio + HTTP (Hono), 75 outils
|
||||
src/ Transports stdio + HTTP (Hono), 87 outils
|
||||
src/
|
||||
components/ Vue SFCs (canevas, panneaux, barre d'outils, sélecteur de couleur)
|
||||
properties/ Sections du panneau de propriétés (Apparence, Remplissage, Contour, etc.)
|
||||
|
|
@ -89,7 +89,7 @@ Le code source du moteur se trouve dans `packages/core/src/`. Les répertoires `
|
|||
| `packages/core/src/kiwi/codec.ts` | Encodeur/décodeur binaire Kiwi |
|
||||
| `packages/core/src/kiwi/fig-import.ts` | Logique d'import de fichiers .fig |
|
||||
| `packages/cli/src/index.ts` | Point d'entrée du CLI |
|
||||
| `packages/core/src/tools/schema.ts` | Définitions d'outils unifiées (IA, MCP, CLI) |
|
||||
| `packages/core/src/tools/` | Définitions d'outils unifiées (IA, MCP, CLI) |
|
||||
| `packages/core/src/figma-api.ts` | Implémentation de Figma Plugin API |
|
||||
| `packages/mcp/src/server.ts` | Factory du serveur MCP |
|
||||
| `packages/cli/src/commands/` | Commandes CLI (info, tree, find, export, eval, analyze) |
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@ Composants, instances, surcharges, jeux de composants, variables (COLOR/FLOAT/ST
|
|||
- @open-pencil/core extrait dans packages/core/ (aucune dépendance DOM)
|
||||
- @open-pencil/cli avec opérations headless .fig (info, tree, find, export, analyze, eval)
|
||||
- Commande `eval` avec API Plugin compatible Figma
|
||||
- Chat IA : connexion directe OpenRouter, 75 outils dans `schema.ts`, ⌘J
|
||||
- Chat IA : connexion directe OpenRouter, 87 outils dans `packages/core/src/tools/`, ⌘J
|
||||
- 49 outils IA/MCP additionnels portés depuis figma-use (75 au total)
|
||||
- Serveur MCP (@open-pencil/mcp) : stdio + HTTP, 75 outils core + 3 gestion de fichiers
|
||||
- Définitions d'outils unifiées : définir une fois dans `schema.ts`, adapter pour chat IA (valibot), MCP (zod), CLI (eval)
|
||||
- Serveur MCP (@open-pencil/mcp) : stdio + HTTP, 87 outils core + 3 gestion de fichiers
|
||||
- Définitions d'outils unifiées : définir une fois dans `packages/core/src/tools/`, adapter pour chat IA (valibot), MCP (zod), CLI (eval)
|
||||
- Barre de menus pour le mode navigateur
|
||||
- Sauvegarde automatique : écriture avec debounce de 3s
|
||||
- Panneau de propriétés multi-sélection avec valeurs partagées/mixtes
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ Presse-papiers bidirectionnel compatible Figma. Encode/décode le binaire Kiwi (
|
|||
|
||||
### Serveur MCP
|
||||
|
||||
`@open-pencil/mcp` expose 75 outils core + 3 outils de gestion de fichiers pour les outils de codage IA. Deux transports : stdio pour Claude Code/Cursor/Windsurf, HTTP avec Hono + Streamable HTTP pour les scripts et le CI. Les outils sont définis une fois dans `packages/core/src/tools/schema.ts` et adaptés pour le chat IA (valibot), MCP (zod) et CLI (commande eval).
|
||||
`@open-pencil/mcp` expose 87 outils core + 3 outils de gestion de fichiers pour les outils de codage IA. Deux transports : stdio pour Claude Code/Cursor/Windsurf, HTTP avec Hono + Streamable HTTP pour les scripts et le CI. Les outils sont définis une fois dans `packages/core/src/tools/` et adaptés pour le chat IA (valibot), MCP (zod) et CLI (commande eval).
|
||||
|
||||
### Collaboration P2P
|
||||
|
||||
|
|
|
|||
|
|
@ -229,7 +229,7 @@ Gestion d'état via Potok (bibliothèque Redux-like pour atomes ClojureScript).
|
|||
|
||||
## 11. Scripting et extensibilité
|
||||
|
||||
OpenPencil inclut une [commande `eval`](/eval-command) offrant une API Plugin compatible Figma pour le scripting headless. De plus, 78 outils IA sont disponibles via le chat intégré, le serveur MCP (stdio + HTTP) et le CLI. Penpot a un système de plugins avec exécution sandboxée mais pas d'API de scripting headless ni d'intégration MCP.
|
||||
OpenPencil inclut une [commande `eval`](/eval-command) offrant une API Plugin compatible Figma pour le scripting headless. De plus, 90 outils IA sont disponibles via le chat intégré, le serveur MCP (stdio + HTTP) et le CLI. Penpot a un système de plugins avec exécution sandboxée mais pas d'API de scripting headless ni d'intégration MCP.
|
||||
|
||||
## Résumé
|
||||
|
||||
|
|
@ -246,4 +246,4 @@ OpenPencil inclut une [commande `eval`](/eval-command) offrant une API Plugin co
|
|||
| **Self-hosting** | Penpot | Prêt Docker vs desktop uniquement |
|
||||
| **Maturité écosystème** | Penpot | Années de production vs stade précoce |
|
||||
|
||||
Open Pencil est architecturalement plus léger — un renderer CanvasKit monoprocessus en ~26K LOC TypeScript, compatible Figma par conception. Penpot est une plateforme full-stack avec ~299K LOC. Open Pencil a le scripting headless, **78 outils AI/MCP**, export SVG et une app desktop native.
|
||||
Open Pencil est architecturalement plus léger — un renderer CanvasKit monoprocessus en ~26K LOC TypeScript, compatible Figma par conception. Penpot est une plateforme full-stack avec ~299K LOC. Open Pencil a le scripting headless, **90 outils AI/MCP**, export SVG et une app desktop native.
|
||||
|
|
|
|||
|
|
@ -152,7 +152,7 @@ Création programmable via TreeNode builders. Props shorthand style Tailwind.
|
|||
|
||||
## Chat IA
|
||||
|
||||
Assistant IA intégré via <kbd>⌘</kbd><kbd>J</kbd>. **78 outils** dans `schema.ts` couvrant lecture, création, modification, manipulation de nœuds, CRUD variables, outils vectoriels, contrôle viewport et `eval`. **Serveur MCP** expose 78 outils au total (75 core + 3 gestion fichiers) pour les outils de codage IA externes.
|
||||
Assistant IA intégré via <kbd>⌘</kbd><kbd>J</kbd>. **87 outils** dans `packages/core/src/tools/` couvrant lecture, création, modification, manipulation de nœuds, CRUD variables, outils vectoriels, contrôle viewport et `eval`. **Serveur MCP** expose 90 outils au total (87 core + 3 gestion fichiers) pour les outils de codage IA externes.
|
||||
|
||||
## Export SVG
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ Comparaison fonctionnalité par fonctionnalité des capacités de Figma Design a
|
|||
| Miniatures personnalisées | 🔲 | Miniature générée à l'export, mais pas de sélecteur personnalisé |
|
||||
| Réglages de valeur de nudge | 🔲 | Défaut 1px/10px ; Figma permet des valeurs personnalisées |
|
||||
| Menu de l'app (mode navigateur) | ✅ | Menus Fichier, Édition, Affichage, Objet, Texte, Disposition ; Tauri utilise les menus natifs |
|
||||
| Outils IA | 🟡 | 78 outils via OpenRouter + serveur MCP ; pas d'images générées par IA ni de recherche IA encore |
|
||||
| Outils IA | 🟡 | 90 outils via OpenRouter + serveur MCP ; pas d'images générées par IA ni de recherche IA encore |
|
||||
|
||||
## Calques et formes
|
||||
|
||||
|
|
@ -215,7 +215,7 @@ Comparaison fonctionnalité par fonctionnalité des capacités de Figma Design a
|
|||
| Code Connect | 🔲 | Lier composants de design au code |
|
||||
| Extraits de code | 🟡 | Export JSX avec coloration et copie ; pas d'extraits CSS/Swift/Kotlin |
|
||||
| Figma for VS Code | 🔲 | Intégration plugin éditeur |
|
||||
| Serveur MCP | ✅ | @open-pencil/mcp avec transports stdio + HTTP ; 75 outils core + 3 gestion de fichiers = 78 total |
|
||||
| Serveur MCP | ✅ | @open-pencil/mcp avec transports stdio + HTTP ; 87 outils core + 3 gestion de fichiers = 90 total |
|
||||
| Outils CLI | ✅ | CLI headless : info, tree, find, export, analyze, node, pages, variables, eval ; serveur MCP |
|
||||
|
||||
## Figma Draw
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
| **Format de fichier** | Kiwi binaire + Zstd | Format propre de Figma — compact, parsing rapide, compatible .fig |
|
||||
| **Collaboration** | Trystero + Yjs | P2P WebRTC via signalisation MQTT, sync CRDT, persistance y-indexeddb |
|
||||
| **Couleur** | culori | Conversions d'espaces colorimétriques (HSV, RGB, hex) |
|
||||
| **IA/MCP** | MCP SDK + Hono | 75 outils pour le codage IA, transports stdio + HTTP |
|
||||
| **IA/MCP** | MCP SDK + Hono | 87 outils pour le codage IA, transports stdio + HTTP |
|
||||
| **Desktop** | Tauri v2 | ~5 Mo app native (vs ~100 Mo d'Electron), backend Rust |
|
||||
| **Build** | Vite 7 | HMR rapide, modules ES natifs |
|
||||
| **Test** | Playwright + bun:test | Régression visuelle (E2E) + tests unitaires rapides |
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ Figma-compatible bidirectional clipboard. Encodes/decodes Kiwi binary (same form
|
|||
|
||||
### MCP Server
|
||||
|
||||
`@open-pencil/mcp` exposes 75 core tools + 3 file management tools (78 total) for AI coding tools. Two transports: stdio for Claude Code/Cursor/Windsurf, HTTP with Hono + Streamable HTTP for scripts and CI. Tools are defined once in `packages/core/src/tools/schema.ts` and adapted for AI chat (valibot), MCP (zod), and CLI (eval command).
|
||||
`@open-pencil/mcp` exposes 87 core tools + 3 file management tools (90 total) for AI coding tools. Two transports: stdio for Claude Code/Cursor/Windsurf, HTTP with Hono + Streamable HTTP for scripts and CI. Tools are defined once in `packages/core/src/tools/` (split by domain: read, create, modify, structure, variables, vector, analyze) and adapted for AI chat (valibot), MCP (zod), and CLI (eval command).
|
||||
|
||||
### P2P Collaboration
|
||||
|
||||
|
|
@ -105,7 +105,7 @@ The AI chat currently routes through OpenRouter. Direct integrations planned: An
|
|||
|
||||
### Full figma-use Tool Set
|
||||
|
||||
The MCP server currently exposes 78 tools. The reference implementation in [figma-use](https://github.com/dannote/figma-use) has 118. The remaining 40 tools cover advanced layout constraints, prototype connections, advanced component property editing, and bulk document operations — all will be ported.
|
||||
The MCP server currently exposes 90 tools. The reference implementation in [figma-use](https://github.com/dannote/figma-use) has 118. The remaining tools cover advanced layout constraints, prototype connections, advanced component property editing, and bulk document operations — all will be ported.
|
||||
|
||||
### CI Design Tooling
|
||||
|
||||
|
|
|
|||
|
|
@ -272,7 +272,7 @@ Open Pencil's approach is simpler and lower overhead. Penpot's approach is more
|
|||
|
||||
## 11. Scripting & Extensibility
|
||||
|
||||
OpenPencil ships with an [`eval` command](/eval-command) that provides a Figma-compatible Plugin API for headless scripting — batch operations, automated testing, and AI-driven modifications all run without the GUI. On top of that, **78 AI tools** are available via built-in chat, MCP server (stdio + HTTP), and the CLI — covering read, create, modify, structure, variables, vector path, analyze (color/typography/spacing/clusters), diff, boolean operations, and arrangement. Penpot has a plugin system with sandboxed execution but no headless scripting API or MCP integration.
|
||||
OpenPencil ships with an [`eval` command](/eval-command) that provides a Figma-compatible Plugin API for headless scripting — batch operations, automated testing, and AI-driven modifications all run without the GUI. On top of that, **90 AI tools** are available via built-in chat, MCP server (stdio + HTTP), and the CLI — covering read, create, modify, structure, variables, vector path, analyze (color/typography/spacing/clusters), diff, boolean operations, and arrangement. Penpot has a plugin system with sandboxed execution but no headless scripting API or MCP integration.
|
||||
|
||||
## Summary
|
||||
|
||||
|
|
@ -289,4 +289,4 @@ OpenPencil ships with an [`eval` command](/eval-command) that provides a Figma-c
|
|||
| **Self-hosting** | Penpot | Docker-ready vs desktop-only |
|
||||
| **Ecosystem maturity** | Penpot | Years of production vs early stage |
|
||||
|
||||
Open Pencil is architecturally leaner — a single-process CanvasKit renderer in ~26K LOC of TypeScript, Figma-compatible by design. Penpot is a full-stack platform with ~299K LOC across Clojure, ClojureScript, Rust, and SCSS, plus a Docker service fleet. Both now offer real-time collaboration (different architectures: P2P vs server). Penpot has a plugin ecosystem and server-side PDF export; Open Pencil has Figma-compatible headless scripting, **78 AI/MCP tools**, SVG export, and a native desktop app.
|
||||
Open Pencil is architecturally leaner — a single-process CanvasKit renderer in ~26K LOC of TypeScript, Figma-compatible by design. Penpot is a full-stack platform with ~299K LOC across Clojure, ClojureScript, Rust, and SCSS, plus a Docker service fleet. Both now offer real-time collaboration (different architectures: P2P vs server). Penpot has a plugin ecosystem and server-side PDF export; Open Pencil has Figma-compatible headless scripting, **90 AI/MCP tools**, SVG export, and a native desktop app.
|
||||
|
|
|
|||
|
|
@ -332,9 +332,11 @@ Built-in AI assistant accessible via the AI tab in the properties panel or <kbd>
|
|||
|
||||
**Model selector** with curated models: Claude, Gemini, GPT, DeepSeek, Qwen, Kimi, Llama — stored in `@open-pencil/core` constants with benchmark-ranked tags. Responses stream as markdown (vue-stream-markdown).
|
||||
|
||||
**78 tools** defined in `packages/core/src/tools/schema.ts`, covering: read operations (selection, page tree, node details, search, components), create operations (shapes, frames, vectors, slices, pages, components, instances), modify operations (fill, stroke, effects, layout, constraints, text, font, opacity, rotation, radius, visibility, blend mode, lock, stroke align), node manipulation (move, resize, reparent, clone, delete, flatten, boolean operations, arrange), variable CRUD (get, find, create, set, delete, bind, collections), vector path tools (get, set, scale, flip, move), analyze (colors, typography, spacing, clusters), diff (create/show snapshots), and an `eval` escape hatch. Tools are wired to AI chat (valibot schemas), MCP server (zod schemas), and CLI (`eval` command). Tool calls display as collapsible timeline entries in the chat (reka-ui Collapsible).
|
||||
**87 tools** defined in `packages/core/src/tools/` across domain files (read, create, modify, structure, variables, vector, analyze), covering: read operations (selection, page tree, node details, search, components, fonts), create operations (shapes, frames, vectors, slices, pages, components, instances, JSX render), modify operations (fill, stroke, effects, layout, constraints, text, font, opacity, rotation, radius, visibility, blend mode, lock, stroke align), node manipulation (move, resize, reparent, clone, delete, flatten, boolean operations, arrange), variable CRUD (get, find, create, set, delete, bind, collections), vector path tools (get, set, scale, flip, move), analyze (colors, typography, spacing, clusters), diff (create/show snapshots), and an `eval` escape hatch. Tools are wired to AI chat (valibot schemas), MCP server (zod schemas), and CLI (`eval` command). Tool calls display as collapsible timeline entries in the chat (Reka UI Collapsible).
|
||||
|
||||
**MCP server** (`packages/mcp/`) exposes all tools for external AI coding tools. Two transports: stdio for Claude Code/Cursor/Windsurf (`openpencil-mcp`), HTTP with Hono + Streamable HTTP for scripts and CI (`openpencil-mcp-http`). Adds 3 file management tools (`open_file`, `save_file`, `new_document`) on top of the 75 core tools, for 78 total. Runs on Bun and Node.js. See [MCP Tools reference](/reference/mcp-tools).
|
||||
**MCP server** (`packages/mcp/`) exposes all tools for external AI coding tools. Two transports: stdio for Claude Code/Cursor/Windsurf (`openpencil-mcp`), HTTP with Hono + Streamable HTTP for scripts and CI (`openpencil-mcp-http`). Adds 3 file management tools (`open_file`, `save_file`, `new_document`) on top of the 87 core tools, for 90 total. Runs on Bun and Node.js. See [MCP Tools reference](/reference/mcp-tools).
|
||||
|
||||
**CLI-to-app RPC bridge** — when the desktop app is running, CLI commands automatically connect to it via WebSocket instead of requiring a .fig file. Run `bun open-pencil tree` to inspect the live document, or `bun open-pencil export` to render the current canvas.
|
||||
|
||||
Tested with Playwright using mock transport for CI (chat), bun:test for tool execution (MCP).
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ Feature-by-feature comparison of Figma Design capabilities with Open Pencil's cu
|
|||
| Custom file thumbnails | 🔲 | Thumbnail generated on export, but no custom thumbnail picker |
|
||||
| Nudge value settings | 🔲 | Default 1px/10px; Figma allows custom small/big nudge values |
|
||||
| App menu (browser mode) | ✅ | File, Edit, View, Object, Text, Arrange menus; Tauri uses native menus |
|
||||
| AI tools | 🟡 | 78 tools via OpenRouter + MCP server; no AI-generated images or AI-powered search yet |
|
||||
| AI tools | 🟡 | 90 tools via OpenRouter + MCP server; no AI-generated images or AI-powered search yet |
|
||||
|
||||
## Layers & Shapes
|
||||
|
||||
|
|
@ -218,7 +218,7 @@ Feature-by-feature comparison of Figma Design capabilities with Open Pencil's cu
|
|||
| Code snippets | 🟡 | JSX export with syntax highlighting and copy; no CSS/Swift/Kotlin snippets |
|
||||
| Tailwind CSS v4 export | ✅ | Export as HTML with Tailwind utility classes from Code panel, CLI, or programmatically |
|
||||
| Figma for VS Code | 🔲 | Editor plugin integration |
|
||||
| MCP server | ✅ | @open-pencil/mcp with stdio + HTTP transports; 75 core tools + 3 file management tools = 78 total |
|
||||
| MCP server | ✅ | @open-pencil/mcp with stdio + HTTP transports; 87 core tools + 3 file management tools = 90 total |
|
||||
| CLI tools | ✅ | Headless CLI: info, tree, find, export, analyze, node, pages, variables, eval; MCP server with stdio + HTTP |
|
||||
|
||||
## Figma Draw
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
| **File Format** | Kiwi binary + Zstd | Figma's own format — compact, fast parsing, .fig compatible |
|
||||
| **Collaboration** | Trystero + Yjs | P2P WebRTC via MQTT signaling, CRDT sync, y-indexeddb persistence |
|
||||
| **Color** | culori | Color space conversions (HSV, RGB, hex) |
|
||||
| **AI/MCP** | MCP SDK + Hono | 75 tools for AI coding tools, stdio + HTTP transports |
|
||||
| **AI/MCP** | MCP SDK + Hono | 87 tools for AI coding tools, stdio + HTTP transports |
|
||||
| **Desktop** | Tauri v2 | ~5MB native app (vs Electron's ~100MB), Rust backend |
|
||||
| **Build** | Vite 7 | Fast HMR, native ES modules |
|
||||
| **Testing** | Playwright + bun:test | Visual regression (E2E) + fast unit tests |
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ packages/
|
|||
cli/ @open-pencil/cli — CLI headless per operazioni .fig
|
||||
src/commands/ info, tree, find, export, eval, analyze
|
||||
mcp/ @open-pencil/mcp — server MCP per strumenti IA
|
||||
src/ Trasporti stdio + HTTP (Hono), 75 strumenti
|
||||
src/ Trasporti stdio + HTTP (Hono), 87 strumenti
|
||||
src/
|
||||
components/ Vue SFCs (canvas, pannelli, barra strumenti, selettore colore)
|
||||
properties/ Sezioni pannello proprietà (Aspetto, Riempimento, Contorno, ecc.)
|
||||
|
|
@ -89,7 +89,7 @@ Il codice sorgente del motore si trova in `packages/core/src/`. I directory `src
|
|||
| `packages/core/src/kiwi/codec.ts` | Encoder/decoder binario Kiwi |
|
||||
| `packages/core/src/kiwi/fig-import.ts` | Logica import file .fig |
|
||||
| `packages/cli/src/index.ts` | Punto di ingresso CLI |
|
||||
| `packages/core/src/tools/schema.ts` | Definizioni strumenti unificate (IA, MCP, CLI) |
|
||||
| `packages/core/src/tools/` | Definizioni strumenti unificate (IA, MCP, CLI) |
|
||||
| `packages/core/src/figma-api.ts` | Implementazione Figma Plugin API |
|
||||
| `packages/mcp/src/server.ts` | Factory del server MCP |
|
||||
| `packages/cli/src/commands/` | Comandi CLI (info, tree, find, export, eval, analyze) |
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@ Componenti, istanze, override, set di componenti, variabili (COLOR/FLOAT/STRING/
|
|||
- @open-pencil/core estratto in packages/core/ (nessuna dipendenza DOM)
|
||||
- @open-pencil/cli con operazioni headless .fig (info, tree, find, export, analyze, eval)
|
||||
- Comando `eval` con API Plugin compatibile Figma
|
||||
- Chat IA: connessione diretta OpenRouter, 75 strumenti in `schema.ts`, ⌘J
|
||||
- Chat IA: connessione diretta OpenRouter, 87 strumenti in `packages/core/src/tools/`, ⌘J
|
||||
- 49 strumenti IA/MCP aggiuntivi portati da figma-use (75 in totale)
|
||||
- Server MCP (@open-pencil/mcp): stdio + HTTP, 75 strumenti core + 3 gestione file
|
||||
- Definizioni strumenti unificate: definire una volta in `schema.ts`, adattare per chat IA (valibot), MCP (zod), CLI (eval)
|
||||
- Server MCP (@open-pencil/mcp): stdio + HTTP, 87 strumenti core + 3 gestione file
|
||||
- Definizioni strumenti unificate: definire una volta in `packages/core/src/tools/`, adattare per chat IA (valibot), MCP (zod), CLI (eval)
|
||||
- Barra dei menu per modalità browser
|
||||
- Salvataggio automatico: scrittura con debounce di 3s
|
||||
- Pannello proprietà multi-selezione con valori condivisi/misti
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ Appunti bidirezionali compatibili con Figma. Codifica/decodifica binario Kiwi (s
|
|||
|
||||
### Server MCP
|
||||
|
||||
`@open-pencil/mcp` espone 75 strumenti core + 3 strumenti di gestione file per strumenti di codifica IA. Due trasporti: stdio per Claude Code/Cursor/Windsurf, HTTP con Hono + Streamable HTTP per script e CI. Gli strumenti sono definiti una volta in `packages/core/src/tools/schema.ts` e adattati per chat IA (valibot), MCP (zod) e CLI (comando eval).
|
||||
`@open-pencil/mcp` espone 87 strumenti core + 3 strumenti di gestione file per strumenti di codifica IA. Due trasporti: stdio per Claude Code/Cursor/Windsurf, HTTP con Hono + Streamable HTTP per script e CI. Gli strumenti sono definiti una volta in `packages/core/src/tools/` e adattati per chat IA (valibot), MCP (zod) e CLI (comando eval).
|
||||
|
||||
### Collaborazione P2P
|
||||
|
||||
|
|
|
|||
|
|
@ -215,7 +215,7 @@ Gestione stato via Potok. Undo con vettori di cambiamenti inversi (max 50 voci),
|
|||
|
||||
## 11. Scripting ed estensibilità
|
||||
|
||||
OpenPencil include un [comando `eval`](/eval-command) che fornisce un'API Plugin compatibile Figma per scripting headless. Inoltre, 78 strumenti AI disponibili via chat integrata, server MCP (stdio + HTTP) e CLI. Penpot ha un sistema plugin con esecuzione sandboxed ma senza API di scripting headless né integrazione MCP.
|
||||
OpenPencil include un [comando `eval`](/eval-command) che fornisce un'API Plugin compatibile Figma per scripting headless. Inoltre, 90 strumenti AI disponibili via chat integrata, server MCP (stdio + HTTP) e CLI. Penpot ha un sistema plugin con esecuzione sandboxed ma senza API di scripting headless né integrazione MCP.
|
||||
|
||||
## Riepilogo
|
||||
|
||||
|
|
@ -232,4 +232,4 @@ OpenPencil include un [comando `eval`](/eval-command) che fornisce un'API Plugin
|
|||
| **Self-hosting** | Penpot | Docker-ready vs solo desktop |
|
||||
| **Maturità ecosistema** | Penpot | Anni di produzione vs stadio iniziale |
|
||||
|
||||
Open Pencil è architetturalmente più snello — un renderer CanvasKit monoprocesso in ~26K LOC TypeScript, compatibile Figma per design. Penpot è una piattaforma full-stack con ~299K LOC. Open Pencil ha scripting headless, **78 strumenti AI/MCP**, export SVG e app desktop nativa.
|
||||
Open Pencil è architetturalmente più snello — un renderer CanvasKit monoprocesso in ~26K LOC TypeScript, compatibile Figma per design. Penpot è una piattaforma full-stack con ~299K LOC. Open Pencil ha scripting headless, **90 strumenti AI/MCP**, export SVG e app desktop nativa.
|
||||
|
|
|
|||
|
|
@ -152,7 +152,7 @@ Creazione programmabile via TreeNode builder. Props shorthand stile Tailwind.
|
|||
|
||||
## Chat IA
|
||||
|
||||
Assistente IA integrato via <kbd>⌘</kbd><kbd>J</kbd>. **78 strumenti** in `schema.ts` che coprono lettura, creazione, modifica, manipolazione nodi, CRUD variabili, strumenti vettoriali, controllo viewport e `eval`. **Server MCP** espone 78 strumenti totali (75 core + 3 gestione file) per strumenti di codifica IA esterni.
|
||||
Assistente IA integrato via <kbd>⌘</kbd><kbd>J</kbd>. **87 strumenti** in `packages/core/src/tools/` che coprono lettura, creazione, modifica, manipolazione nodi, CRUD variabili, strumenti vettoriali, controllo viewport e `eval`. **Server MCP** espone 90 strumenti totali (87 core + 3 gestione file) per strumenti di codifica IA esterni.
|
||||
|
||||
## Export SVG
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ Confronto funzionalità per funzionalità delle capacità di Figma Design con lo
|
|||
| Miniature personalizzate | 🔲 | Miniatura generata all'export, ma nessun selettore personalizzato |
|
||||
| Impostazioni valore nudge | 🔲 | Default 1px/10px; Figma consente valori personalizzati |
|
||||
| Menu app (modalità browser) | ✅ | Menu File, Modifica, Visualizza, Oggetto, Testo, Disponi; Tauri usa menu nativi |
|
||||
| Strumenti IA | 🟡 | 78 strumenti via OpenRouter + server MCP; nessuna immagine generata da IA o ricerca IA ancora |
|
||||
| Strumenti IA | 🟡 | 90 strumenti via OpenRouter + server MCP; nessuna immagine generata da IA o ricerca IA ancora |
|
||||
|
||||
## Livelli e forme
|
||||
|
||||
|
|
@ -215,7 +215,7 @@ Confronto funzionalità per funzionalità delle capacità di Figma Design con lo
|
|||
| Code Connect | 🔲 | Collegare componenti design al codice |
|
||||
| Frammenti di codice | 🟡 | Export JSX con evidenziazione e copia; nessun frammento CSS/Swift/Kotlin |
|
||||
| Figma for VS Code | 🔲 | Integrazione plugin editor |
|
||||
| Server MCP | ✅ | @open-pencil/mcp con trasporti stdio + HTTP; 75 strumenti core + 3 gestione file = 78 total |
|
||||
| Server MCP | ✅ | @open-pencil/mcp con trasporti stdio + HTTP; 87 strumenti core + 3 gestione file = 90 total |
|
||||
| Strumenti CLI | ✅ | CLI headless: info, tree, find, export, analyze, node, pages, variables, eval; server MCP |
|
||||
|
||||
## Figma Draw
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
| **Formato file** | Kiwi binario + Zstd | Formato proprio di Figma — compatto, parsing veloce, compatibile .fig |
|
||||
| **Collaborazione** | Trystero + Yjs | P2P WebRTC via segnalazione MQTT, sync CRDT, persistenza y-indexeddb |
|
||||
| **Colore** | culori | Conversioni spazio colore (HSV, RGB, hex) |
|
||||
| **IA/MCP** | MCP SDK + Hono | 75 strumenti per il coding IA, trasporti stdio + HTTP |
|
||||
| **IA/MCP** | MCP SDK + Hono | 87 strumenti per il coding IA, trasporti stdio + HTTP |
|
||||
| **Desktop** | Tauri v2 | ~5 MB app nativa (vs ~100 MB di Electron), backend Rust |
|
||||
| **Build** | Vite 7 | HMR veloce, moduli ES nativi |
|
||||
| **Test** | Playwright + bun:test | Regressione visiva (E2E) + test unitari veloci |
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ packages/
|
|||
cli/ @open-pencil/cli — headless CLI do operacji .fig
|
||||
src/commands/ info, tree, find, export, eval, analyze
|
||||
mcp/ @open-pencil/mcp — serwer MCP dla narzędzi AI
|
||||
src/ Transporty stdio + HTTP (Hono), 75 narzędzi
|
||||
src/ Transporty stdio + HTTP (Hono), 87 narzędzi
|
||||
src/
|
||||
components/ Vue SFCs (canvas, panele, pasek narzędzi, wybieracz kolorów)
|
||||
properties/ Sekcje panelu właściwości (Wygląd, Wypełnienie, Obrys, itp.)
|
||||
|
|
@ -89,7 +89,7 @@ Kod źródłowy silnika znajduje się w `packages/core/src/`. Katalogi `src/engi
|
|||
| `packages/core/src/kiwi/codec.ts` | Koder/dekoder binarny Kiwi |
|
||||
| `packages/core/src/kiwi/fig-import.ts` | Logika importu plików .fig |
|
||||
| `packages/cli/src/index.ts` | Punkt wejścia CLI |
|
||||
| `packages/core/src/tools/schema.ts` | Ujednolicone definicje narzędzi (AI, MCP, CLI) |
|
||||
| `packages/core/src/tools/` | Ujednolicone definicje narzędzi (AI, MCP, CLI) |
|
||||
| `packages/core/src/figma-api.ts` | Implementacja Figma Plugin API |
|
||||
| `packages/mcp/src/server.ts` | Fabryka serwera MCP |
|
||||
| `packages/cli/src/commands/` | Polecenia CLI (info, tree, find, export, eval, analyze) |
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@ Komponenty, instancje, nadpisania, zestawy komponentów, zmienne (COLOR/FLOAT/ST
|
|||
- @open-pencil/core wyodrębniony do packages/core/ (zero zależności DOM)
|
||||
- @open-pencil/cli z headless operacjami .fig (info, tree, find, export, analyze, eval)
|
||||
- Polecenie `eval` z API Plugin kompatybilnym z Figmą
|
||||
- Chat AI: bezpośrednie połączenie OpenRouter, 75 narzędzi w `schema.ts`, ⌘J
|
||||
- Chat AI: bezpośrednie połączenie OpenRouter, 87 narzędzi w `packages/core/src/tools/`, ⌘J
|
||||
- 49 dodatkowych narzędzi AI/MCP przeniesionych z figma-use (75 łącznie)
|
||||
- Serwer MCP (@open-pencil/mcp): stdio + HTTP, 75 narzędzi core + 3 zarządzanie plikami
|
||||
- Ujednolicone definicje narzędzi: zdefiniuj raz w `schema.ts`, adaptuj dla chatu AI (valibot), MCP (zod), CLI (eval)
|
||||
- Serwer MCP (@open-pencil/mcp): stdio + HTTP, 87 narzędzi core + 3 zarządzanie plikami
|
||||
- Ujednolicone definicje narzędzi: zdefiniuj raz w `packages/core/src/tools/`, adaptuj dla chatu AI (valibot), MCP (zod), CLI (eval)
|
||||
- Pasek menu dla trybu przeglądarki
|
||||
- Autozapis: zapis z debounce 3s
|
||||
- Panel właściwości multi-selekcji z wartościami wspólnymi/mieszanymi
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ Dwukierunkowy schowek kompatybilny z Figmą. Koduje/dekoduje binarne Kiwi (ten s
|
|||
|
||||
### Serwer MCP
|
||||
|
||||
`@open-pencil/mcp` udostępnia 75 narzędzi core + 3 narzędzia zarządzania plikami dla narzędzi kodowania AI. Dwa transporty: stdio dla Claude Code/Cursor/Windsurf, HTTP z Hono + Streamable HTTP dla skryptów i CI. Narzędzia są definiowane raz w `packages/core/src/tools/schema.ts` i adaptowane dla chatu AI (valibot), MCP (zod) i CLI (polecenie eval).
|
||||
`@open-pencil/mcp` udostępnia 87 narzędzi core + 3 narzędzia zarządzania plikami dla narzędzi kodowania AI. Dwa transporty: stdio dla Claude Code/Cursor/Windsurf, HTTP z Hono + Streamable HTTP dla skryptów i CI. Narzędzia są definiowane raz w `packages/core/src/tools/` i adaptowane dla chatu AI (valibot), MCP (zod) i CLI (polecenie eval).
|
||||
|
||||
### Współpraca P2P
|
||||
|
||||
|
|
|
|||
|
|
@ -215,7 +215,7 @@ Zarządzanie stanem przez Potok. Cofanie z wektorami zmian odwrotnych (max 50 wp
|
|||
|
||||
## 11. Scripting i rozszerzalność
|
||||
|
||||
OpenPencil zawiera [komendę `eval`](/eval-command) oferującą API Plugin kompatybilne z Figmą do skryptowania headless. Ponadto 78 narzędzi AI dostępnych przez wbudowany chat, serwer MCP (stdio + HTTP) i CLI. Penpot ma system pluginów z sandboxem, ale bez API skryptowania headless ani integracji MCP.
|
||||
OpenPencil zawiera [komendę `eval`](/eval-command) oferującą API Plugin kompatybilne z Figmą do skryptowania headless. Ponadto 90 narzędzi AI dostępnych przez wbudowany chat, serwer MCP (stdio + HTTP) i CLI. Penpot ma system pluginów z sandboxem, ale bez API skryptowania headless ani integracji MCP.
|
||||
|
||||
## Podsumowanie
|
||||
|
||||
|
|
@ -232,4 +232,4 @@ OpenPencil zawiera [komendę `eval`](/eval-command) oferującą API Plugin kompa
|
|||
| **Self-hosting** | Penpot | Gotowy Docker vs tylko desktop |
|
||||
| **Dojrzałość ekosystemu** | Penpot | Lata produkcji vs wczesny etap |
|
||||
|
||||
Open Pencil jest architektonicznie szczuplejszy — jednoprocesowy renderer CanvasKit w ~26K LOC TypeScript, kompatybilny z Figmą z założenia. Penpot to platforma full-stack z ~299K LOC. Open Pencil ma skryptowanie headless, **78 narzędzi AI/MCP**, eksport SVG i natywną aplikację desktop.
|
||||
Open Pencil jest architektonicznie szczuplejszy — jednoprocesowy renderer CanvasKit w ~26K LOC TypeScript, kompatybilny z Figmą z założenia. Penpot to platforma full-stack z ~299K LOC. Open Pencil ma skryptowanie headless, **90 narzędzi AI/MCP**, eksport SVG i natywną aplikację desktop.
|
||||
|
|
|
|||
|
|
@ -152,7 +152,7 @@ Programistyczne tworzenie designu przez buildery TreeNode. Propsy shorthand w st
|
|||
|
||||
## Chat AI
|
||||
|
||||
Wbudowany asystent AI przez <kbd>⌘</kbd><kbd>J</kbd>. **78 narzędzi** w `schema.ts` obejmujących: odczyt, tworzenie, modyfikację, manipulację węzłów, CRUD zmiennych, narzędzia wektorowe, kontrolę viewportu i `eval`. **Serwer MCP** udostępnia 78 narzędzi łącznie (75 core + 3 zarządzanie plikami) dla zewnętrznych narzędzi kodowania AI.
|
||||
Wbudowany asystent AI przez <kbd>⌘</kbd><kbd>J</kbd>. **87 narzędzi** w `packages/core/src/tools/` obejmujących: odczyt, tworzenie, modyfikację, manipulację węzłów, CRUD zmiennych, narzędzia wektorowe, kontrolę viewportu i `eval`. **Serwer MCP** udostępnia 90 narzędzi łącznie (87 core + 3 zarządzanie plikami) dla zewnętrznych narzędzi kodowania AI.
|
||||
|
||||
## Eksport SVG
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ Porównanie funkcja po funkcji możliwości Figma Design z aktualnym stanem impl
|
|||
| Niestandardowe miniatury | 🔲 | Miniatura generowana przy eksporcie, ale bez selektora |
|
||||
| Ustawienia wartości nudge | 🔲 | Domyślnie 1px/10px; Figma pozwala na wartości niestandardowe |
|
||||
| Menu aplikacji (tryb przeglądarkowy) | ✅ | Menu Plik, Edycja, Widok, Obiekt, Tekst, Rozmieszczenie; Tauri używa natywnych menu |
|
||||
| Narzędzia AI | 🟡 | 78 narzędzi przez OpenRouter + serwer MCP; bez obrazów generowanych przez AI ani wyszukiwania AI jeszcze |
|
||||
| Narzędzia AI | 🟡 | 90 narzędzi przez OpenRouter + serwer MCP; bez obrazów generowanych przez AI ani wyszukiwania AI jeszcze |
|
||||
|
||||
## Warstwy i kształty
|
||||
|
||||
|
|
@ -215,7 +215,7 @@ Porównanie funkcja po funkcji możliwości Figma Design z aktualnym stanem impl
|
|||
| Code Connect | 🔲 | Łączenie komponentów projektowych z kodem |
|
||||
| Fragmenty kodu | 🟡 | Eksport JSX z podświetlaniem i kopiowaniem; brak fragmentów CSS/Swift/Kotlin |
|
||||
| Figma for VS Code | 🔲 | Integracja z pluginem edytora |
|
||||
| Serwer MCP | ✅ | @open-pencil/mcp z transportami stdio + HTTP; 75 narzędzi core + 3 zarządzanie plikami = 78 total |
|
||||
| Serwer MCP | ✅ | @open-pencil/mcp z transportami stdio + HTTP; 87 narzędzi core + 3 zarządzanie plikami = 90 total |
|
||||
| Narzędzia CLI | ✅ | Headless CLI: info, tree, find, export, analyze, node, pages, variables, eval; serwer MCP |
|
||||
|
||||
## Figma Draw
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
| **Format pliku** | Kiwi binarny + Zstd | Własny format Figmy — kompaktowy, szybkie parsowanie, kompatybilny z .fig |
|
||||
| **Współpraca** | Trystero + Yjs | P2P WebRTC przez sygnalizację MQTT, sync CRDT, persystencja y-indexeddb |
|
||||
| **Kolor** | culori | Konwersje przestrzeni kolorów (HSV, RGB, hex) |
|
||||
| **AI/MCP** | MCP SDK + Hono | 75 narzędzi dla kodowania AI, transporty stdio + HTTP |
|
||||
| **AI/MCP** | MCP SDK + Hono | 87 narzędzi dla kodowania AI, transporty stdio + HTTP |
|
||||
| **Desktop** | Tauri v2 | ~5 MB natywna aplikacja (vs ~100 MB Electrona), backend Rust |
|
||||
| **Build** | Vite 7 | Szybki HMR, natywne moduły ES |
|
||||
| **Testowanie** | Playwright + bun:test | Regresja wizualna (E2E) + szybkie testy jednostkowe |
|
||||
|
|
|
|||
Loading…
Reference in a new issue