@mp3wizard/figma-console-mcp 1.19.2 → 1.20.2

package/README.md

@@ -54,9 +54,9 @@ Figma Console MCP connects AI assistants (like Claude) to Figma, enabling:
 | Real-time monitoring (console, selection) | ✅ | ❌ | ❌ |
 | Desktop Bridge plugin | ✅ | ✅ | ❌ |
 | Requires Node.js | Yes | **No** | No |
-| **Total tools available** | **89+** | **43** | **22** |
+| **Total tools available** | **92+** | **43** | **22** |
 
-> **Bottom line:** Remote SSE is **read-only** with ~38% of the tools. **Cloud Mode** unlocks write access from web AI clients without Node.js. NPX/Local Git gives the full 89+ tools with real-time monitoring.
+> **Bottom line:** Remote SSE is **read-only** with ~38% of the tools. **Cloud Mode** unlocks write access from web AI clients without Node.js. NPX/Local Git gives the full 92+ tools with real-time monitoring.
 
 ---
 
@@ -64,7 +64,7 @@ Figma Console MCP connects AI assistants (like Claude) to Figma, enabling:
 
 **Best for:** Designers who want full AI-assisted design capabilities.
 
-**What you get:** All 89+ tools including design creation, variable management, and component instantiation.
+**What you get:** All 92+ tools including design creation, variable management, and component instantiation.
 
 #### Prerequisites
 
@@ -126,7 +126,7 @@ If you're not sure where to put the JSON configuration above, here's where each
 #### Step 3: Connect to Figma Desktop
 
 **Desktop Bridge Plugin:**
-1. Open Figma Desktop normally (no special flags needed)
+1. Open Figma Desktop normally (no special flags needed) and open a file
 2. Go to **Plugins → Development → Import plugin from manifest...**
 3. Select `~/.figma-console-mcp/plugin/manifest.json` (stable path, auto-created by the MCP server)
 4. Run the plugin in your Figma file — the bootloader finds the MCP server and loads the latest UI automatically
@@ -159,7 +159,7 @@ Create a simple frame with a blue background
 
 **Best for:** Developers who want to modify source code or contribute to the project.
 
-**What you get:** Same 89+ tools as NPX, plus full source code access.
+**What you get:** Same 92+ tools as NPX, plus full source code access.
 
 #### Quick Setup
 
@@ -248,7 +248,7 @@ Ready for design creation? Follow the [NPX Setup](#-npx-setup-recommended) guide
 
 **Best for:** Using Claude.ai, v0, Replit, or Lovable to create and modify Figma designs — no Node.js required.
 
-**What you get:** 79 tools including full write access — design creation, variable management, component instantiation, and all REST API tools. Only real-time monitoring (console logs, selection tracking, document changes) requires Local Mode.
+**What you get:** 82 tools including full write access — design creation, variable management, component instantiation, and all REST API tools. Only real-time monitoring (console logs, selection tracking, document changes) requires Local Mode.
 
 #### Prerequisites
 
@@ -305,7 +305,7 @@ AI Client → Cloud MCP Server → Durable Object Relay → Desktop Bridge Plugi
 | Feature | NPX (Recommended) | Cloud Mode | Local Git | Remote SSE |
 |---------|-------------------|------------|-----------|------------|
 | **Setup time** | ~10 minutes | ~5 minutes | ~15 minutes | ~2 minutes |
-| **Total tools** | **89+** | **43** | **89+** | **22** (read-only) |
+| **Total tools** | **92+** | **43** | **92+** | **22** (read-only) |
 | **Design creation** | ✅ | ✅ | ✅ | ❌ |
 | **Variable management** | ✅ | ✅ | ✅ | ❌ |
 | **Component instantiation** | ✅ | ✅ | ✅ | ❌ |
@@ -320,7 +320,7 @@ AI Client → Cloud MCP Server → Durable Object Relay → Desktop Bridge Plugi
 | **Automatic updates** | ✅ (`@latest`) | ✅ | Manual (`git pull`) | ✅ |
 | **Source code access** | ❌ | ❌ | ✅ | ❌ |
 
-> **Key insight:** Remote SSE is read-only. Cloud Mode adds write access for web AI clients without Node.js. NPX/Local Git give the full 89+ tools.
+> **Key insight:** Remote SSE is read-only. Cloud Mode adds write access for web AI clients without Node.js. NPX/Local Git give the full 92+ tools.
 
 **📖 [Complete Feature Comparison](docs/mode-comparison.md)**
 
@@ -456,8 +456,10 @@ When you first use design system tools:
 - `figma_reorder_slides` - Reorder slides via new 2D grid layout
 - `figma_set_slide_transition` - Set transition effects (22 styles, 8 curves)
 - `figma_skip_slide` - Toggle whether a slide is skipped in presentation mode
-- `figma_add_text_to_slide` - Add text to a specific slide
+- `figma_add_text_to_slide` - Add text to a slide with custom fonts, colors, alignment, and wrapping
 - `figma_add_shape_to_slide` - Add rectangle or ellipse shapes with color
+- `figma_set_slide_background` - Set a slide's background color (creates or updates)
+- `figma_get_text_styles` - Get all local text styles with IDs, fonts, and sizes
 - `figma_set_slides_view_mode` - Toggle grid vs. single-slide view
 - `figma_focus_slide` - Navigate to a specific slide
 
@@ -652,7 +654,7 @@ The **Figma Desktop Bridge** plugin is the recommended way to connect Figma to t
 - The MCP server communicates via **WebSocket** through the Desktop Bridge plugin
 - The server tries port 9223 first, then automatically falls back through ports 9224–9232 if needed
 - The plugin scans all ports in the range and connects to every active server it finds
-- All 89+ tools work through the WebSocket transport
+- All 92+ tools work through the WebSocket transport
 
 **Multiple files:** The WebSocket server supports multiple simultaneous plugin connections — one per open Figma file. Each connection is tracked by file key with independent state (selection, document changes, console logs).
 
@@ -789,7 +791,7 @@ The architecture supports adding new apps with minimal boilerplate — each app
 
 ## 🛤️ Roadmap
 
-**Current Status:** v1.17.0 (Stable) - Production-ready with FigJam + Slides support, Cloud Write Relay, Design System Kit, WebSocket-only connectivity, smart multi-file tracking, 89+ tools, Comments API, and MCP Apps
+**Current Status:** v1.17.0 (Stable) - Production-ready with FigJam + Slides support, Cloud Write Relay, Design System Kit, WebSocket-only connectivity, smart multi-file tracking, 92+ tools, Comments API, and MCP Apps
 
 **Recent Releases:**
 - [x] **v1.17.0** - Figma Slides Support: 15 new tools for managing presentations — slides, transitions, content, reordering, and navigation. Inspired by Toni Haidamous (PR #11).

package/dist/cloudflare/core/cloud-websocket-connector.js

@@ -276,6 +276,9 @@ export class CloudWebSocketConnector {
     async createShapeWithText(params) {
         return this.sendCommand('CREATE_SHAPE_WITH_TEXT', params);
     }
+    async createSection(params) {
+        return this.sendCommand('CREATE_SECTION', params);
+    }
     async createTable(params) {
         return this.sendCommand('CREATE_TABLE', params, 30000);
     }
@@ -336,6 +339,12 @@ export class CloudWebSocketConnector {
     async addShapeToSlide(params) {
         return this.sendCommand('ADD_SHAPE_TO_SLIDE', params, 5000);
     }
+    async setSlideBackground(params) {
+        return this.sendCommand('SET_SLIDE_BACKGROUND', params, 5000);
+    }
+    async getTextStyles() {
+        return this.sendCommand('GET_TEXT_STYLES', {}, 5000);
+    }
     // ============================================================================
     // Cache management (no-op for cloud relay)
     // ============================================================================

package/dist/cloudflare/core/figjam-tools.js

@@ -138,7 +138,9 @@ export function registerFigJamTools(server, getDesktopConnector) {
     // ============================================================================
     server.tool("figjam_create_connector", `Connect two nodes with a connector line in FigJam. Use to create flowcharts, diagrams, and relationship maps.
 
-Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from creation results.`, {
+Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from creation results.
+
+**Magnet positions:** AUTO (default), TOP, BOTTOM, LEFT, RIGHT — controls where the connector attaches to each node.`, {
         startNodeId: z.string().describe("Node ID of the start element"),
         endNodeId: z.string().describe("Node ID of the end element"),
         label: z
@@ -146,13 +148,25 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
             .max(MAX_TEXT_LENGTH)
             .optional()
             .describe("Optional text label on the connector"),
-    }, async ({ startNodeId, endNodeId, label }) => {
+        startMagnet: z
+            .enum(["AUTO", "TOP", "BOTTOM", "LEFT", "RIGHT"])
+            .optional()
+            .default("AUTO")
+            .describe("Magnet position on the start node"),
+        endMagnet: z
+            .enum(["AUTO", "TOP", "BOTTOM", "LEFT", "RIGHT"])
+            .optional()
+            .default("AUTO")
+            .describe("Magnet position on the end node"),
+    }, async ({ startNodeId, endNodeId, label, startMagnet, endMagnet }) => {
         try {
             const connector = await getDesktopConnector();
             const result = await connector.createConnector({
                 startNodeId,
                 endNodeId,
                 label,
+                startMagnet,
+                endMagnet,
             });
             return {
                 content: [{ type: "text", text: JSON.stringify(result) }],
@@ -177,7 +191,7 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
     // ============================================================================
     // SHAPE WITH TEXT TOOL
     // ============================================================================
-    server.tool("figjam_create_shape_with_text", `Create a labeled shape on a FigJam board. Use for flowchart nodes, process diagrams, and visual organization.
+    server.tool("figjam_create_shape_with_text", `Create a labeled shape on a FigJam board with optional size, colors, and font control. Use for flowchart nodes, process diagrams, and visual organization.
 
 **Shape types:** ROUNDED_RECTANGLE (default), DIAMOND, ELLIPSE, TRIANGLE_UP, TRIANGLE_DOWN, PARALLELOGRAM_RIGHT, PARALLELOGRAM_LEFT, ENG_DATABASE, ENG_QUEUE, ENG_FILE, ENG_FOLDER`, {
         text: z
@@ -191,7 +205,13 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
             .describe("Shape type"),
         x: z.number().optional().describe("X position on canvas"),
         y: z.number().optional().describe("Y position on canvas"),
-    }, async ({ text, shapeType, x, y }) => {
+        width: z.number().min(1).max(10000).optional().describe("Width in pixels"),
+        height: z.number().min(1).max(10000).optional().describe("Height in pixels"),
+        fillColor: z.string().regex(/^#[0-9a-fA-F]{6}$/).optional().describe("Fill color as hex (e.g., '#E1F5EE')"),
+        strokeColor: z.string().regex(/^#[0-9a-fA-F]{6}$/).optional().describe("Stroke/border color as hex"),
+        fontSize: z.number().min(1).max(200).optional().describe("Text font size in pixels"),
+        strokeDashPattern: z.string().optional().describe("Dash pattern as comma-separated numbers (e.g., '10,5' for dashed)"),
+    }, async ({ text, shapeType, x, y, width, height, fillColor, strokeColor, fontSize, strokeDashPattern }) => {
         try {
             const connector = await getDesktopConnector();
             const result = await connector.createShapeWithText({
@@ -199,6 +219,12 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
                 shapeType,
                 x,
                 y,
+                width,
+                height,
+                fillColor,
+                strokeColor,
+                fontSize,
+                strokeDashPattern,
             });
             return {
                 content: [{ type: "text", text: JSON.stringify(result) }],
@@ -221,6 +247,42 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
         }
     });
     // ============================================================================
+    // SECTION TOOL
+    // ============================================================================
+    server.tool("figjam_create_section", `Create a section on a FigJam board. Sections are containers that can hold other elements. Use for grouping related content.\n\n**Note:** After creating a section, place elements inside it by setting their x/y coordinates within the section's bounds, then use figma_execute to call section.appendChild(node) to parent them.`, {
+        name: z.string().max(500).optional().describe("Section name/title"),
+        x: z.number().optional().describe("X position on canvas"),
+        y: z.number().optional().describe("Y position on canvas"),
+        width: z.number().min(1).max(20000).optional().default(1000).describe("Section width in pixels"),
+        height: z.number().min(1).max(20000).optional().default(800).describe("Section height in pixels"),
+        fillColor: z.string().regex(/^#[0-9a-fA-F]{6}$/).optional().describe("Fill color as hex"),
+    }, async ({ name, x, y, width, height, fillColor }) => {
+        try {
+            const connector = await getDesktopConnector();
+            const result = await connector.createSection({
+                name, x, y, width, height, fillColor,
+            });
+            return {
+                content: [{ type: "text", text: JSON.stringify(result) }],
+            };
+        }
+        catch (error) {
+            logger.error({ error }, "figjam_create_section failed");
+            return {
+                content: [
+                    {
+                        type: "text",
+                        text: JSON.stringify({
+                            error: error instanceof Error ? error.message : String(error),
+                            hint: "This tool only works in FigJam files.",
+                        }),
+                    },
+                ],
+                isError: true,
+            };
+        }
+    });
+    // ============================================================================
     // TABLE TOOL
     // ============================================================================
     server.tool("figjam_create_table", `Create a table on a FigJam board with optional cell data. Use for structured data display, comparison matrices, and organized information.

package/dist/cloudflare/core/figma-desktop-connector.js

@@ -1267,6 +1267,7 @@ export class FigmaDesktopConnector {
     async createStickies() { throw new Error('FigJam operations require WebSocket transport'); }
     async createConnector() { throw new Error('FigJam operations require WebSocket transport'); }
     async createShapeWithText() { throw new Error('FigJam operations require WebSocket transport'); }
+    async createSection() { throw new Error('FigJam operations require WebSocket transport'); }
     async createTable() { throw new Error('FigJam operations require WebSocket transport'); }
     async createCodeBlock() { throw new Error('FigJam operations require WebSocket transport'); }
     async getBoardContents() { throw new Error('FigJam operations require WebSocket transport'); }
@@ -1287,5 +1288,7 @@ export class FigmaDesktopConnector {
     async skipSlide() { throw new Error('Slides operations require WebSocket transport'); }
     async addTextToSlide() { throw new Error('Slides operations require WebSocket transport'); }
     async addShapeToSlide() { throw new Error('Slides operations require WebSocket transport'); }
+    async setSlideBackground() { throw new Error('Slides operations require WebSocket transport'); }
+    async getTextStyles() { throw new Error('Text styles require WebSocket transport'); }
 }
 FigmaDesktopConnector.DEBUG = process.env.DEBUG === '1' || process.env.DEBUG === 'true';

package/dist/cloudflare/core/slides-tools.js

@@ -184,6 +184,31 @@ export function registerSlidesTools(server, getDesktopConnector) {
             };
         }
     });
+    server.tool("figma_get_text_styles", `Get all local text styles in the current file. Returns style IDs, names, font info, and sizes. Use these IDs when setting textStyleId on text nodes via figma_execute.`, {}, async () => {
+        try {
+            const connector = await getDesktopConnector();
+            const result = await connector.getTextStyles();
+            return {
+                content: [
+                    { type: "text", text: JSON.stringify(result) },
+                ],
+            };
+        }
+        catch (error) {
+            logger.error({ error }, "figma_get_text_styles failed");
+            return {
+                content: [
+                    {
+                        type: "text",
+                        text: JSON.stringify({
+                            error: error instanceof Error ? error.message : String(error),
+                        }),
+                    },
+                ],
+                isError: true,
+            };
+        }
+    });
     server.tool("figma_get_focused_slide", `Get the slide currently focused in single-slide view.`, {}, async () => {
         try {
             const connector = await getDesktopConnector();
@@ -430,7 +455,7 @@ export function registerSlidesTools(server, getDesktopConnector) {
             };
         }
     });
-    server.tool("figma_add_text_to_slide", `Add a new text element to a specific slide. Uses Inter font by default.`, {
+    server.tool("figma_add_text_to_slide", `Add a new text element to a specific slide. Supports custom fonts, colors, alignment, and text formatting.`, {
         slideId: z
             .string()
             .max(50)
@@ -448,7 +473,46 @@ export function registerSlidesTools(server, getDesktopConnector) {
             .optional()
             .default(24)
             .describe("Font size in pixels"),
-    }, async ({ slideId, text, x, y, fontSize }) => {
+        fontFamily: z
+            .string()
+            .optional()
+            .default("Inter")
+            .describe("Font family (e.g., 'Manrope', 'IBM Plex Sans')"),
+        fontStyle: z
+            .string()
+            .optional()
+            .default("Regular")
+            .describe("Font style/weight (e.g., 'Bold', 'SemiBold', 'Medium')"),
+        color: z
+            .string()
+            .regex(/^#[0-9a-fA-F]{6}$/)
+            .optional()
+            .describe("Text fill color as hex (e.g., '#FFFFFF')"),
+        textAlign: z
+            .enum(["LEFT", "CENTER", "RIGHT"])
+            .optional()
+            .describe("Horizontal text alignment"),
+        width: z
+            .number()
+            .min(1)
+            .max(MAX_DIMENSION)
+            .optional()
+            .describe("Text box width for wrapping. When set, enables text wrapping."),
+        lineHeight: z
+            .number()
+            .min(1)
+            .max(500)
+            .optional()
+            .describe("Line height in pixels"),
+        letterSpacing: z
+            .number()
+            .optional()
+            .describe("Letter spacing in pixels"),
+        textCase: z
+            .enum(["ORIGINAL", "UPPER", "LOWER", "TITLE"])
+            .optional()
+            .describe("Text case transformation"),
+    }, async ({ slideId, text, x, y, fontSize, fontFamily, fontStyle, color, textAlign, width, lineHeight, letterSpacing, textCase }) => {
         try {
             const connector = await getDesktopConnector();
             const result = await connector.addTextToSlide({
@@ -457,6 +521,14 @@ export function registerSlidesTools(server, getDesktopConnector) {
                 x,
                 y,
                 fontSize,
+                fontFamily,
+                fontStyle,
+                color,
+                textAlign,
+                width,
+                lineHeight,
+                letterSpacing,
+                textCase,
             });
             return {
                 content: [
@@ -540,6 +612,41 @@ export function registerSlidesTools(server, getDesktopConnector) {
             };
         }
     });
+    server.tool("figma_set_slide_background", `Set the background color of a slide. Creates or updates a full-slide background rectangle.`, {
+        slideId: z
+            .string()
+            .max(50)
+            .describe("The node ID of the slide"),
+        color: z
+            .string()
+            .regex(/^#[0-9a-fA-F]{6}$/, "Must be a 6-digit hex color like '#181818'")
+            .describe("Background color as hex (e.g., '#181818')"),
+    }, async ({ slideId, color }) => {
+        try {
+            const connector = await getDesktopConnector();
+            const result = await connector.setSlideBackground({ slideId, color });
+            return {
+                content: [
+                    { type: "text", text: JSON.stringify(result) },
+                ],
+            };
+        }
+        catch (error) {
+            logger.error({ error }, "figma_set_slide_background failed");
+            return {
+                content: [
+                    {
+                        type: "text",
+                        text: JSON.stringify({
+                            error: error instanceof Error ? error.message : String(error),
+                            hint: "This tool only works in Figma Slides files.",
+                        }),
+                    },
+                ],
+                isError: true,
+            };
+        }
+    });
     // ============================================================================
     // NAVIGATION TOOLS — Control slide view
     // ============================================================================

package/dist/cloudflare/core/websocket-connector.js

@@ -280,6 +280,9 @@ export class WebSocketConnector {
     async createShapeWithText(params) {
         return this.wsServer.sendCommand('CREATE_SHAPE_WITH_TEXT', params);
     }
+    async createSection(params) {
+        return this.wsServer.sendCommand('CREATE_SECTION', params);
+    }
     async createTable(params) {
         return this.wsServer.sendCommand('CREATE_TABLE', params, 30000);
     }
@@ -340,6 +343,12 @@ export class WebSocketConnector {
     async addShapeToSlide(params) {
         return this.wsServer.sendCommand('ADD_SHAPE_TO_SLIDE', params, 5000);
     }
+    async setSlideBackground(params) {
+        return this.wsServer.sendCommand('SET_SLIDE_BACKGROUND', params, 5000);
+    }
+    async getTextStyles() {
+        return this.wsServer.sendCommand('GET_TEXT_STYLES', {}, 5000);
+    }
     // ============================================================================
     // Cache management (no-op for WebSocket — no frame cache)
     // ============================================================================

package/dist/cloudflare/index.js

@@ -68,7 +68,7 @@ export class FigmaConsoleMCPv3 extends McpAgent {
         super(...arguments);
         this.server = new McpServer({
             name: "Figma Console MCP",
-            version: "1.19.1",
+            version: "1.20.1",
         });
         this.browserManager = null;
         this.consoleMonitor = null;
@@ -1046,7 +1046,7 @@ export default {
             });
             const statelessServer = new McpServer({
                 name: "Figma Console MCP",
-                version: "1.19.1",
+                version: "1.20.1",
             });
             // ================================================================
             // Cloud Write Relay — Pairing Tool (stateless /mcp path)
@@ -1683,7 +1683,7 @@ export default {
             return new Response(JSON.stringify({
                 status: "healthy",
                 service: "Figma Console MCP",
-                version: "1.19.1",
+                version: "1.20.1",
                 endpoints: {
                     mcp: ["/sse", "/mcp"],
                     oauth_mcp_spec: ["/.well-known/oauth-authorization-server", "/authorize", "/token", "/oauth/register"],
@@ -1729,13 +1729,13 @@ export default {
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<title>Figma Console MCP - The Most Comprehensive MCP Server for Figma</title>
 	<link rel="icon" type="image/svg+xml" href="https://docs.figma-console-mcp.southleft.com/favicon.svg">
-	<meta name="description" content="Turn your Figma design system into a living API. 89+ tools give AI assistants deep access to design tokens, component specs, variables, and programmatic design creation.">
+	<meta name="description" content="Turn your Figma design system into a living API. 92+ tools give AI assistants deep access to design tokens, component specs, variables, and programmatic design creation.">
 
 	<!-- Open Graph -->
 	<meta property="og:type" content="website">
 	<meta property="og:url" content="https://figma-console-mcp.southleft.com">
 	<meta property="og:title" content="Figma Console MCP - Turn Your Design System Into a Living API">
-	<meta property="og:description" content="The most comprehensive MCP server for Figma. 89+ tools give AI assistants deep access to design tokens, components, variables, and programmatic design creation.">
+	<meta property="og:description" content="The most comprehensive MCP server for Figma. 92+ tools give AI assistants deep access to design tokens, components, variables, and programmatic design creation.">
 	<meta property="og:image" content="https://docs.figma-console-mcp.southleft.com/images/og-image.jpg">
 	<meta property="og:image:width" content="1200">
 	<meta property="og:image:height" content="630">
@@ -1743,7 +1743,7 @@ export default {
 	<!-- Twitter -->
 	<meta name="twitter:card" content="summary_large_image">
 	<meta name="twitter:title" content="Figma Console MCP - Turn Your Design System Into a Living API">
-	<meta name="twitter:description" content="The most comprehensive MCP server for Figma. 89+ tools give AI assistants deep access to design tokens, components, variables, and programmatic design creation.">
+	<meta name="twitter:description" content="The most comprehensive MCP server for Figma. 92+ tools give AI assistants deep access to design tokens, components, variables, and programmatic design creation.">
 	<meta name="twitter:image" content="https://docs.figma-console-mcp.southleft.com/images/og-image.jpg">
 
 	<meta name="theme-color" content="#0D9488">
@@ -2630,7 +2630,7 @@ export default {
 			<div class="grid-cell showcase-cell rule-left">
 				<div class="showcase-label">What AI Can Access</div>
 				<div class="showcase-stat">
-					<span class="number">87+</span>
+					<span class="number">92+</span>
 					<span class="label">MCP tools for Figma</span>
 				</div>
 				<div class="capability-list">

package/dist/core/figjam-tools.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"figjam-tools.d.ts","sourceRoot":"","sources":["../../src/core/figjam-tools.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;AA4DzE;;;;GAIG;AACH,wBAAgB,mBAAmB,CAClC,MAAM,EAAE,SAAS,EACjB,mBAAmB,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,GACrC,IAAI,CA2eN"}
+{"version":3,"file":"figjam-tools.d.ts","sourceRoot":"","sources":["../../src/core/figjam-tools.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;AA4DzE;;;;GAIG;AACH,wBAAgB,mBAAmB,CAClC,MAAM,EAAE,SAAS,EACjB,mBAAmB,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,GACrC,IAAI,CA+iBN"}

package/dist/core/figjam-tools.js

@@ -138,7 +138,9 @@ export function registerFigJamTools(server, getDesktopConnector) {
     // ============================================================================
     server.tool("figjam_create_connector", `Connect two nodes with a connector line in FigJam. Use to create flowcharts, diagrams, and relationship maps.
 
-Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from creation results.`, {
+Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from creation results.
+
+**Magnet positions:** AUTO (default), TOP, BOTTOM, LEFT, RIGHT — controls where the connector attaches to each node.`, {
         startNodeId: z.string().describe("Node ID of the start element"),
         endNodeId: z.string().describe("Node ID of the end element"),
         label: z
@@ -146,13 +148,25 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
             .max(MAX_TEXT_LENGTH)
             .optional()
             .describe("Optional text label on the connector"),
-    }, async ({ startNodeId, endNodeId, label }) => {
+        startMagnet: z
+            .enum(["AUTO", "TOP", "BOTTOM", "LEFT", "RIGHT"])
+            .optional()
+            .default("AUTO")
+            .describe("Magnet position on the start node"),
+        endMagnet: z
+            .enum(["AUTO", "TOP", "BOTTOM", "LEFT", "RIGHT"])
+            .optional()
+            .default("AUTO")
+            .describe("Magnet position on the end node"),
+    }, async ({ startNodeId, endNodeId, label, startMagnet, endMagnet }) => {
         try {
             const connector = await getDesktopConnector();
             const result = await connector.createConnector({
                 startNodeId,
                 endNodeId,
                 label,
+                startMagnet,
+                endMagnet,
             });
             return {
                 content: [{ type: "text", text: JSON.stringify(result) }],
@@ -177,7 +191,7 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
     // ============================================================================
     // SHAPE WITH TEXT TOOL
     // ============================================================================
-    server.tool("figjam_create_shape_with_text", `Create a labeled shape on a FigJam board. Use for flowchart nodes, process diagrams, and visual organization.
+    server.tool("figjam_create_shape_with_text", `Create a labeled shape on a FigJam board with optional size, colors, and font control. Use for flowchart nodes, process diagrams, and visual organization.
 
 **Shape types:** ROUNDED_RECTANGLE (default), DIAMOND, ELLIPSE, TRIANGLE_UP, TRIANGLE_DOWN, PARALLELOGRAM_RIGHT, PARALLELOGRAM_LEFT, ENG_DATABASE, ENG_QUEUE, ENG_FILE, ENG_FOLDER`, {
         text: z
@@ -191,7 +205,13 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
             .describe("Shape type"),
         x: z.number().optional().describe("X position on canvas"),
         y: z.number().optional().describe("Y position on canvas"),
-    }, async ({ text, shapeType, x, y }) => {
+        width: z.number().min(1).max(10000).optional().describe("Width in pixels"),
+        height: z.number().min(1).max(10000).optional().describe("Height in pixels"),
+        fillColor: z.string().regex(/^#[0-9a-fA-F]{6}$/).optional().describe("Fill color as hex (e.g., '#E1F5EE')"),
+        strokeColor: z.string().regex(/^#[0-9a-fA-F]{6}$/).optional().describe("Stroke/border color as hex"),
+        fontSize: z.number().min(1).max(200).optional().describe("Text font size in pixels"),
+        strokeDashPattern: z.string().optional().describe("Dash pattern as comma-separated numbers (e.g., '10,5' for dashed)"),
+    }, async ({ text, shapeType, x, y, width, height, fillColor, strokeColor, fontSize, strokeDashPattern }) => {
         try {
             const connector = await getDesktopConnector();
             const result = await connector.createShapeWithText({
@@ -199,6 +219,12 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
                 shapeType,
                 x,
                 y,
+                width,
+                height,
+                fillColor,
+                strokeColor,
+                fontSize,
+                strokeDashPattern,
             });
             return {
                 content: [{ type: "text", text: JSON.stringify(result) }],
@@ -221,6 +247,42 @@ Nodes must exist on the board (stickies, shapes, etc.). Use their node IDs from
         }
     });
     // ============================================================================
+    // SECTION TOOL
+    // ============================================================================
+    server.tool("figjam_create_section", `Create a section on a FigJam board. Sections are containers that can hold other elements. Use for grouping related content.\n\n**Note:** After creating a section, place elements inside it by setting their x/y coordinates within the section's bounds, then use figma_execute to call section.appendChild(node) to parent them.`, {
+        name: z.string().max(500).optional().describe("Section name/title"),
+        x: z.number().optional().describe("X position on canvas"),
+        y: z.number().optional().describe("Y position on canvas"),
+        width: z.number().min(1).max(20000).optional().default(1000).describe("Section width in pixels"),
+        height: z.number().min(1).max(20000).optional().default(800).describe("Section height in pixels"),
+        fillColor: z.string().regex(/^#[0-9a-fA-F]{6}$/).optional().describe("Fill color as hex"),
+    }, async ({ name, x, y, width, height, fillColor }) => {
+        try {
+            const connector = await getDesktopConnector();
+            const result = await connector.createSection({
+                name, x, y, width, height, fillColor,
+            });
+            return {
+                content: [{ type: "text", text: JSON.stringify(result) }],
+            };
+        }
+        catch (error) {
+            logger.error({ error }, "figjam_create_section failed");
+            return {
+                content: [
+                    {
+                        type: "text",
+                        text: JSON.stringify({
+                            error: error instanceof Error ? error.message : String(error),
+                            hint: "This tool only works in FigJam files.",
+                        }),
+                    },
+                ],
+                isError: true,
+            };
+        }
+    });
+    // ============================================================================
     // TABLE TOOL
     // ============================================================================
     server.tool("figjam_create_table", `Create a table on a FigJam board with optional cell data. Use for structured data display, comparison matrices, and organized information.