diff --git a/README.md b/README.md index 9ec65bb38..6eb8d6ccc 100644 --- a/README.md +++ b/README.md @@ -145,6 +145,16 @@ Security defaults for HTTP transport: 90 tools: create shapes, set fills/strokes/layout, variables, vectors, boolean ops, viewport, find nodes, open/save `.fig` files, render JSX to design nodes. +## AI Agent Skill + +Teach your AI coding agent to use OpenPencil — inspect designs, export assets, analyze tokens, modify .fig files: + +```sh +npx skills add open-pencil/skills@open-pencil +``` + +Works with Claude Code, Cursor, Windsurf, Codex, and any agent that supports [skills](https://skills.sh). + ## Scripts | Command | Description | diff --git a/packages/docs/de/guide/features.md b/packages/docs/de/guide/features.md index 031e07a02..38587ba79 100644 --- a/packages/docs/de/guide/features.md +++ b/packages/docs/de/guide/features.md @@ -227,6 +227,8 @@ Ein HUD-Overlay zeigt Frame-Timing, GPU-Phasen und Frame-Budget. Zugänglich üb Integrierter KI-Assistent über den KI-Tab oder ⌘J. Kommuniziert direkt mit OpenRouter. **87 Werkzeuge** für Lesen, Erstellen, Ändern und Organisieren von Design-Elementen. **MCP-Server** für externe KI-Coding-Tools. +**AI agent skill** — `npx skills add open-pencil/skills@open-pencil` — teaches AI coding agents to use the CLI, MCP tools, and automation bridge. Source: [open-pencil/skills](https://github.com/open-pencil/skills). + ## @open-pencil/core & CLI Die Engine ist in `packages/core/` extrahiert. CLI bietet headless .fig-Dateioperationen: diff --git a/packages/docs/de/reference/mcp-tools.md b/packages/docs/de/reference/mcp-tools.md index c59cb8511..f05541772 100644 --- a/packages/docs/de/reference/mcp-tools.md +++ b/packages/docs/de/reference/mcp-tools.md @@ -73,6 +73,16 @@ Starts on port 3100 (override with `PORT` env var). Endpoints: 5. **Structure** — `reparent_node`, `group_nodes`, `clone_node`, `delete_node` 6. **Save** — `save_file` to write back to `.fig` +## AI Agent Skill + +Install the OpenPencil skill for your AI coding agent: + +```sh +npx skills add open-pencil/skills@open-pencil +``` + +Works with Claude Code, Cursor, Windsurf, Codex, and any agent that supports [skills](https://skills.sh). + ## Tools (75) ### Document diff --git a/packages/docs/es/guide/features.md b/packages/docs/es/guide/features.md index c5176c26d..8ae33ecf5 100644 --- a/packages/docs/es/guide/features.md +++ b/packages/docs/es/guide/features.md @@ -168,6 +168,8 @@ Asistente IA integrado accesible vía la pestaña IA o ⌘J⌘J. **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. +**AI agent skill** — `npx skills add open-pencil/skills@open-pencil` — teaches AI coding agents to use the CLI, MCP tools, and automation bridge. Source: [open-pencil/skills](https://github.com/open-pencil/skills). + ## Export SVG Exporte les nœuds sélectionnés en PNG, JPG, WEBP ou SVG. CLI : `bun open-pencil export --format svg file.fig`. diff --git a/packages/docs/fr/reference/mcp-tools.md b/packages/docs/fr/reference/mcp-tools.md index f81a9cd2e..1fa75b008 100644 --- a/packages/docs/fr/reference/mcp-tools.md +++ b/packages/docs/fr/reference/mcp-tools.md @@ -73,6 +73,16 @@ Starts on port 3100 (override with `PORT` env var). Endpoints: 5. **Structure** — `reparent_node`, `group_nodes`, `clone_node`, `delete_node` 6. **Save** — `save_file` to write back to `.fig` +## AI Agent Skill + +Install the OpenPencil skill for your AI coding agent: + +```sh +npx skills add open-pencil/skills@open-pencil +``` + +Works with Claude Code, Cursor, Windsurf, Codex, and any agent that supports [skills](https://skills.sh). + ## Tools (75) ### Document diff --git a/packages/docs/guide/features.md b/packages/docs/guide/features.md index 7562c0cd9..12d31fc02 100644 --- a/packages/docs/guide/features.md +++ b/packages/docs/guide/features.md @@ -336,6 +336,8 @@ Built-in AI assistant accessible via the AI tab in the properties panel or **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). +**AI agent skill** — install with `npx skills add open-pencil/skills@open-pencil`. Teaches AI coding agents (Claude Code, Cursor, Windsurf, Codex) to use the CLI, MCP tools, JSX rendering, eval, and the app's automation bridge. Source: [open-pencil/skills](https://github.com/open-pencil/skills). + **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). diff --git a/packages/docs/it/guide/features.md b/packages/docs/it/guide/features.md index e4ea75c1e..c026d9a96 100644 --- a/packages/docs/it/guide/features.md +++ b/packages/docs/it/guide/features.md @@ -154,6 +154,8 @@ Creazione programmabile via TreeNode builder. Props shorthand stile Tailwind. Assistente IA integrato via ⌘J. **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. +**AI agent skill** — `npx skills add open-pencil/skills@open-pencil` — teaches AI coding agents to use the CLI, MCP tools, and automation bridge. Source: [open-pencil/skills](https://github.com/open-pencil/skills). + ## Export SVG Esporta i nodi selezionati come PNG, JPG, WEBP o SVG. CLI: `bun open-pencil export --format svg file.fig`. diff --git a/packages/docs/it/reference/mcp-tools.md b/packages/docs/it/reference/mcp-tools.md index bc246fa42..de4376d18 100644 --- a/packages/docs/it/reference/mcp-tools.md +++ b/packages/docs/it/reference/mcp-tools.md @@ -73,6 +73,16 @@ Starts on port 3100 (override with `PORT` env var). Endpoints: 5. **Structure** — `reparent_node`, `group_nodes`, `clone_node`, `delete_node` 6. **Save** — `save_file` to write back to `.fig` +## AI Agent Skill + +Install the OpenPencil skill for your AI coding agent: + +```sh +npx skills add open-pencil/skills@open-pencil +``` + +Works with Claude Code, Cursor, Windsurf, Codex, and any agent that supports [skills](https://skills.sh). + ## Tools (75) ### Document diff --git a/packages/docs/pl/guide/features.md b/packages/docs/pl/guide/features.md index 510ca93b1..d85f94fdb 100644 --- a/packages/docs/pl/guide/features.md +++ b/packages/docs/pl/guide/features.md @@ -154,6 +154,8 @@ Programistyczne tworzenie designu przez buildery TreeNode. Propsy shorthand w st Wbudowany asystent AI przez ⌘J. **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. +**AI agent skill** — `npx skills add open-pencil/skills@open-pencil` — teaches AI coding agents to use the CLI, MCP tools, and automation bridge. Source: [open-pencil/skills](https://github.com/open-pencil/skills). + ## Eksport SVG Eksportuje wybrane węzły jako PNG, JPG, WEBP lub SVG. CLI: `bun open-pencil export --format svg file.fig`. diff --git a/packages/docs/pl/reference/mcp-tools.md b/packages/docs/pl/reference/mcp-tools.md index f6b8eb587..6258add4d 100644 --- a/packages/docs/pl/reference/mcp-tools.md +++ b/packages/docs/pl/reference/mcp-tools.md @@ -73,6 +73,16 @@ Starts on port 3100 (override with `PORT` env var). Endpoints: 5. **Structure** — `reparent_node`, `group_nodes`, `clone_node`, `delete_node` 6. **Save** — `save_file` to write back to `.fig` +## AI Agent Skill + +Install the OpenPencil skill for your AI coding agent: + +```sh +npx skills add open-pencil/skills@open-pencil +``` + +Works with Claude Code, Cursor, Windsurf, Codex, and any agent that supports [skills](https://skills.sh). + ## Tools (75) ### Document diff --git a/packages/docs/reference/mcp-tools.md b/packages/docs/reference/mcp-tools.md index 425b4bc5d..634725bf1 100644 --- a/packages/docs/reference/mcp-tools.md +++ b/packages/docs/reference/mcp-tools.md @@ -81,7 +81,17 @@ Server starts on port 3100 (override with `PORT` env var). Endpoints: 5. **Structure** — `reparent_node`, `group_nodes`, `clone_node`, `delete_node` 6. **Save** — `save_file` to write back to `.fig` -## Tools (78) +## AI Agent Skill + +Teach your AI coding agent to use OpenPencil tools: + +```sh +npx skills add open-pencil/skills@open-pencil +``` + +Works with Claude Code, Cursor, Windsurf, Codex, and any agent that supports [skills](https://skills.sh). The skill covers the CLI, MCP tools, JSX rendering, eval, and the running app's automation bridge. + +## Tools (90) ### Document @@ -104,6 +114,8 @@ Server starts on port 3100 (override with `PORT` env var). Endpoints: | `list_pages` | List all pages | | `list_variables` | List design variables | | `list_collections` | List variable collections | +| `list_fonts` | List fonts used in the current page | +| `page_bounds` | Get bounding box of all objects on the current page | | `node_bounds` | Get bounding box of a node | | `node_ancestors` | Get ancestor chain of a node | | `node_children` | Get direct children of a node | @@ -145,6 +157,8 @@ Server starts on port 3100 (override with `PORT` env var). Endpoints: | `set_blend` | Set blend mode | | `set_locked` | Lock or unlock a node | | `set_stroke_align` | Set stroke alignment (inside/center/outside) | +| `set_text_properties` | Set text layout: alignment, auto-resize, text case, decoration, truncation | +| `set_layout_child` | Configure auto-layout child: sizing, grow, alignment, absolute positioning | | `node_move` | Move a node to a new position | | `node_resize` | Resize a node | | `node_replace_with` | Replace a node with another node | @@ -161,6 +175,7 @@ Server starts on port 3100 (override with `PORT` env var). Endpoints: | `select_nodes` | Select nodes by ID | | `group_nodes` | Group nodes | | `ungroup_node` | Ungroup a group | +| `flatten_nodes` | Flatten nodes into a single vector | | `boolean_union` | Boolean union of two or more nodes | | `boolean_subtract` | Boolean subtraction | | `boolean_intersect` | Boolean intersection | @@ -176,6 +191,21 @@ Server starts on port 3100 (override with `PORT` env var). Endpoints: | `path_flip` | Flip a vector path horizontally or vertically | | `path_move` | Translate a vector path | +### Export + +| Tool | Description | +|------|-------------| +| `export_image` | Export nodes as PNG, JPG, or WEBP. Returns base64-encoded image data | +| `export_svg` | Export nodes as SVG markup | + +### Viewport + +| Tool | Description | +|------|-------------| +| `viewport_get` | Get current viewport position and zoom level | +| `viewport_set` | Set viewport position and zoom | +| `viewport_zoom_to_fit` | Zoom viewport to fit specified nodes | + ### Variables | Tool | Description |