@bilalba/fig-mcp 1.0.1 → 1.1.3

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 bilal
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,106 +1,161 @@
-# Fig MCP Server
+# @bilalba/fig-mcp
 
-An MCP (Model Context Protocol) server for parsing `.fig` files. This enables AI assistants to understand and extract design information from the `.fig` file format.
+MCP server for parsing `.fig` files. Enables AI assistants to understand and extract design information from the `.fig` file format for implementation guidance.
 
-## Features
+## Installation
 
-- Parse `.fig` files without API access
-- Extract document structure, nodes, and hierarchy
-- Infer layout properties (flexbox-like direction, gap, padding, alignment)
-- Extract colors, text content, and styling information
-- Find nodes by type or name
-- Get detailed node information for implementation
+```bash
+npm install -g @bilalba/fig-mcp
+```
 
-## Installation
+Or use directly with npx:
 
 ```bash
-npm install
-npm run build
+npx @bilalba/fig-mcp --help
 ```
 
-## Usage
+## Quick Start
 
-### As MCP Server
+### As MCP Server (for Claude Desktop)
 
-Add to your MCP client configuration:
+Add to your Claude Desktop configuration (`~/Library/Application Support/Claude/claude_desktop_config.json` on macOS):
 
 ```json
 {
   "mcpServers": {
     "fig-mcp": {
-      "command": "node",
-      "args": ["/path/to/fig-mcp/dist/index.js"]
+      "command": "npx",
+      "args": ["@bilalba/fig-mcp"]
     }
   }
 }
 ```
 
-### CLI Inspector
+Then ask Claude to parse your `.fig` files:
+
+> "Parse my design.fig file and show me the document structure"
+
+### Web Viewer
+
+Browse and preview `.fig` files in your browser:
 
 ```bash
-# Show document structure
-npx tsx src/inspect-fig.ts design.fig summary
+fig-mcp viewer design.fig
+# Opens http://localhost:3000
+```
 
-# Show kiwi schema
-npx tsx src/inspect-fig.ts design.fig schema
+Features:
+- Tree navigation with collapsible nodes
+- SVG preview with zoom/pan
+- Node details panel
+- Copy node IDs for MCP tool calls
 
-# Output simplified JSON
-npx tsx src/inspect-fig.ts design.fig json
+### CLI Inspector
 
-# Show node statistics
-npx tsx src/inspect-fig.ts design.fig stats
+Inspect `.fig` files from the command line:
 
-# List archive contents
-npx tsx src/inspect-fig.ts design.fig list
+```bash
+fig-mcp inspect design.fig summary  # Show document structure
+fig-mcp inspect design.fig stats    # Show node type counts
+fig-mcp inspect design.fig list     # List archive contents
+fig-mcp inspect design.fig json     # Output simplified JSON
 ```
 
+## CLI Commands
+
+| Command | Description |
+|---------|-------------|
+| `fig-mcp` | Start MCP server (for AI assistants) |
+| `fig-mcp viewer <file> [port]` | Open web viewer |
+| `fig-mcp inspect <file> [cmd]` | Inspect file |
+| `fig-mcp --help` | Show help |
+| `fig-mcp --version` | Show version |
+
 ## MCP Tools
 
+The MCP server exposes the following tools for AI assistants:
+
+### Document Structure
+
 | Tool | Description |
 |------|-------------|
 | `parse_fig_file` | Parse and return simplified document structure |
-| `get_document_summary` | Text tree of document structure |
+| `get_document_summary` | Text tree of document structure with pagination |
+| `get_tree_summary` | Hierarchical summary for drill-down navigation |
+| `list_pages` | List all pages (canvases) in the document |
+| `get_page_contents` | Get contents of a specific page |
+
+### Node Queries
+
+| Tool | Description |
+|------|-------------|
 | `find_nodes` | Find nodes by type or name |
-| `get_node_details` | Get details for a node path |
+| `get_node_details` | Get details for a node by path |
+| `get_node_by_id` | Get details for a node by GUID |
 | `get_layout_info` | Get inferred layout properties |
-| `list_pages` | List all pages |
-| `get_page_contents` | Get contents of a page |
-| `get_text_content` | Extract text content |
-| `get_colors` | Extract color palette |
+
+### Content Extraction
+
+| Tool | Description |
+|------|-------------|
+| `get_text_content` | Extract all text content |
+| `get_colors` | Extract unique color palette |
+| `list_nodes_with_fills` | List nodes with fill paints |
+
+### Image & Rendering
+
+| Tool | Description |
+|------|-------------|
+| `list_images` | List all images with metadata |
+| `get_image` | Get image by hash (base64) |
+| `get_thumbnail` | Get document thumbnail |
+| `render_screen` | Render node subtree as PNG |
+| `get_vector` | Export vector as SVG, PDF, PNG, or WebP |
+
+### Debugging
+
+| Tool | Description |
+|------|-------------|
+| `get_schema_info` | Kiwi schema information |
+| `get_raw_message` | Raw decoded message |
+| `list_archive_contents` | List files in the archive |
+| `clear_cache` | Clear file cache |
 
 ## How It Works
 
-1. `.fig` files are ZIP archives containing `canvas.fig` (binary data), `meta.json`, and images
+1. `.fig` files are ZIP archives containing:
+   - `canvas.fig` - Main document data (kiwi binary format)
+   - `meta.json` - File metadata
+   - `thumbnail.png` - Preview image
+   - `images/` - Image assets
+
 2. The `canvas.fig` uses Evan Wallace's [kiwi](https://github.com/evanw/kiwi) binary format
+
 3. The kiwi schema is embedded in each file and extracted at parse time
-4. Document data is decoded using the compiled schema
+
+4. Document data is decoded and transformed into structured information
+
 5. Layout properties are inferred from node positions and auto-layout settings
 
-## Project Structure
+## Features
 
-```
-fig-mcp/
-├── src/
-│   ├── parser/           # Fig file parsing
-│   │   ├── fig-reader.ts    # ZIP extraction
-│   │   ├── kiwi-parser.ts   # Binary parsing
-│   │   ├── layout-inference.ts
-│   │   └── types.ts
-│   ├── mcp/
-│   │   └── server.ts     # MCP server
-│   ├── index.ts          # Entry point
-│   └── inspect-fig.ts    # CLI tool
-├── kiwi/                 # Cloned kiwi library
-├── CLAUDE.md            # Development guide
-└── TODO.md              # Project roadmap
-```
+- Parse `.fig` files locally without API access
+- Extract document structure, nodes, and hierarchy
+- Infer layout properties (flexbox-like direction, gap, padding, alignment)
+- Extract colors, text content, and styling information
+- Render nodes to PNG screenshots
+- Export vectors as SVG, PDF, PNG, or WebP
+- Full effect support (shadows, blurs)
+
+## Requirements
+
+- Node.js 18 or higher
 
 ## Limitations
 
 - The `.fig` format is undocumented and may change
-- Some complex properties (vector networks, gradients) may not be fully parsed
-- Blob data (embedded images in fills) is not decoded
 - This is for local `.fig` files only (use a cloud API for hosted files)
+- Some complex properties may not be fully parsed
 
 ## License
 

package/dist/index.js

@@ -9,8 +9,53 @@ import open from "open";
 import { startServer } from "./mcp/server.js";
 import { startHttpServer } from "./http-server.js";
 import { createServer as createViewerServer } from "./web-viewer/server.js";
+import { runInspect } from "./inspect-fig.js";
+import { readFileSync } from "fs";
+import { fileURLToPath } from "url";
+import { dirname, join } from "path";
 const args = process.argv.slice(2);
-if (args[0] === "viewer") {
+const command = args[0];
+// Get package.json for version
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const pkg = JSON.parse(readFileSync(join(__dirname, "../package.json"), "utf-8"));
+if (command === "--version" || command === "-v") {
+    console.log(pkg.version);
+    process.exit(0);
+}
+if (command === "--help" || command === "-h" || command === "help") {
+    console.log(`
+fig-mcp v${pkg.version} - MCP server for parsing .fig files
+
+Usage:
+  fig-mcp                           Start MCP server (for AI assistants)
+  fig-mcp viewer <file> [port]      Start web viewer for a .fig file
+  fig-mcp inspect <file> [command]  Inspect a .fig file
+
+Viewer:
+  Opens a local web UI to browse and preview .fig file contents.
+  Default port: 3000
+
+Inspect commands:
+  list     - List archive contents
+  schema   - Show kiwi schema info
+  summary  - Show document structure (default)
+  raw      - Show raw message (truncated)
+  json     - Output simplified JSON
+  stats    - Show node type statistics
+
+Options:
+  --help, -h      Show this help
+  --version, -v   Show version
+
+Examples:
+  fig-mcp viewer design.fig           # Open viewer on port 3000
+  fig-mcp viewer design.fig 8080      # Open viewer on port 8080
+  fig-mcp inspect design.fig summary  # Show document structure
+  fig-mcp inspect design.fig stats    # Show node type counts
+`);
+    process.exit(0);
+}
+if (command === "viewer") {
     const figFile = args[1];
     const port = parseInt(args[2] || "3000", 10);
     if (!figFile) {
@@ -22,7 +67,10 @@ if (args[0] === "viewer") {
         void open(url);
     });
 }
-else {
+else if (command === "inspect") {
+    await runInspect(args.slice(1));
+}
+else if (!command) {
     // Start HTTP server for image serving
     startHttpServer();
     // Exit when stdin closes (MCP client disconnected)
@@ -35,4 +83,9 @@ else {
         process.exit(1);
     });
 }
+else {
+    console.error(`Unknown command: ${command}`);
+    console.error("Run 'fig-mcp --help' for usage information.");
+    process.exit(1);
+}
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";AACA;;;;;GAKG;AAEH,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,YAAY,IAAI,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5E,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACnC,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,QAAQ,EAAE,CAAC;IACzB,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;IACxB,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,MAAM,EAAE,EAAE,CAAC,CAAC;IAE7C,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,CAAC,KAAK,CAAC,gDAAgD,CAAC,CAAC;QAChE,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAClB,CAAC;IAED,MAAM,YAAY,GAAG,kBAAkB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC3D,YAAY,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE;QACzB,KAAK,IAAI,CAAC,GAAG,CAAC,CAAC;IACjB,CAAC,CAAC,CAAC;AACL,CAAC;KAAM,CAAC;IACN,sCAAsC;IACtC,eAAe,EAAE,CAAC;IAElB,mDAAmD;IACnD,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,EAAE;QAC7B,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAClB,CAAC,CAAC,CAAC;IAEH,mBAAmB;IACnB,WAAW,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;QAC5B,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,KAAK,CAAC,CAAC;QAChD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAClB,CAAC,CAAC,CAAC;AACL,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/inspect-fig.d.ts

@@ -12,5 +12,5 @@
  *   raw      - Show raw message (truncated)
  *   json     - Output simplified JSON
  */
-export {};
+export declare function runInspect(args: string[]): Promise<void>;
 //# sourceMappingURL=inspect-fig.d.ts.map

package/dist/inspect-fig.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inspect-fig.d.ts","sourceRoot":"","sources":["../src/inspect-fig.ts"],"names":[],"mappings":";AACA;;;;;;;;;;;;GAYG"}
+{"version":3,"file":"inspect-fig.d.ts","sourceRoot":"","sources":["../src/inspect-fig.ts"],"names":[],"mappings":";AACA;;;;;;;;;;;;GAYG;AAcH,wBAAsB,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,CA4H9D"}

package/dist/inspect-fig.js

@@ -13,8 +13,7 @@
  *   json     - Output simplified JSON
  */
 import { readFigFile, listFigContents, parseCanvasFig, getSchemaInfo, extractDocumentTree, getDocumentSummary, simplifyNode, countNodesByType, } from "./parser/index.js";
-async function main() {
-    const args = process.argv.slice(2);
+export async function runInspect(args) {
     if (args.length === 0) {
         console.log(`
 Fig Inspector - Inspect .fig files
@@ -130,5 +129,10 @@ Commands:
         process.exit(1);
     }
 }
-main();
+// Run when executed directly
+const isDirectExecution = import.meta.url === `file://${process.argv[1]}` ||
+    process.argv[1]?.endsWith('inspect-fig.ts');
+if (isDirectExecution) {
+    runInspect(process.argv.slice(2));
+}
 //# sourceMappingURL=inspect-fig.js.map

package/dist/inspect-fig.js.map

@@ -1 +1 @@
-{"version":3,"file":"inspect-fig.js","sourceRoot":"","sources":["../src/inspect-fig.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"inspect-fig.js","sourceRoot":"","sources":["../src/inspect-fig.ts"],"names":[],"mappings":"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"}

package/dist/web-viewer/build-client.d.ts

@@ -1,6 +1,7 @@
 /**
  * Build script for the web viewer client.
  * Bundles viewer.ts into a browser-compatible JavaScript file.
+ * Also copies static assets to dist/ for npm package.
  */
 export {};
 //# sourceMappingURL=build-client.d.ts.map

package/dist/web-viewer/build-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"build-client.d.ts","sourceRoot":"","sources":["../../src/web-viewer/build-client.ts"],"names":[],"mappings":"AAAA;;;GAGG"}
+{"version":3,"file":"build-client.d.ts","sourceRoot":"","sources":["../../src/web-viewer/build-client.ts"],"names":[],"mappings":"AAAA;;;;GAIG"}

package/dist/web-viewer/build-client.js

@@ -1,16 +1,35 @@
 /**
  * Build script for the web viewer client.
  * Bundles viewer.ts into a browser-compatible JavaScript file.
+ * Also copies static assets to dist/ for npm package.
  */
 import * as esbuild from "esbuild";
+import fs from "node:fs";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const srcClientDir = path.join(__dirname, "client");
+const distClientDir = path.join(__dirname, "../../dist/web-viewer/client");
+function copyStaticFiles() {
+    // Ensure dist directories exist
+    fs.mkdirSync(path.join(distClientDir, "dist"), { recursive: true });
+    // Copy static files to dist
+    const staticFiles = ["index.html", "styles.css"];
+    for (const file of staticFiles) {
+        const src = path.join(srcClientDir, file);
+        const dest = path.join(distClientDir, file);
+        if (fs.existsSync(src)) {
+            fs.copyFileSync(src, dest);
+            console.log(`Copied ${file} to dist/`);
+        }
+    }
+}
 async function build() {
     const watch = process.argv.includes("--watch");
-    const options = {
-        entryPoints: [path.join(__dirname, "client/viewer.ts")],
-        outfile: path.join(__dirname, "client/dist/viewer.js"),
+    // Build to src for dev, build to dist for production
+    const srcOptions = {
+        entryPoints: [path.join(srcClientDir, "viewer.ts")],
+        outfile: path.join(srcClientDir, "dist/viewer.js"),
         bundle: true,
         minify: !watch,
         sourcemap: watch,
@@ -20,12 +39,20 @@ async function build() {
         logLevel: "info",
     };
     if (watch) {
-        const ctx = await esbuild.context(options);
+        const ctx = await esbuild.context(srcOptions);
         await ctx.watch();
         console.log("Watching for changes...");
     }
     else {
-        await esbuild.build(options);
+        // Build to src/client/dist (for dev)
+        await esbuild.build(srcOptions);
+        // Also build to dist/web-viewer/client/dist (for npm package)
+        copyStaticFiles();
+        await esbuild.build({
+            ...srcOptions,
+            outfile: path.join(distClientDir, "dist/viewer.js"),
+            sourcemap: false,
+        });
         console.log("Build complete!");
     }
 }

package/dist/web-viewer/build-client.js.map

@@ -1 +1 @@
-{"version":3,"file":"build-client.js","sourceRoot":"","sources":["../../src/web-viewer/build-client.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,OAAO,MAAM,SAAS,CAAC;AACnC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;AAE/D,KAAK,UAAU,KAAK;IAClB,MAAM,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAE/C,MAAM,OAAO,GAAyB;QACpC,WAAW,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,kBAAkB,CAAC,CAAC;QACvD,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,uBAAuB,CAAC;QACtD,MAAM,EAAE,IAAI;QACZ,MAAM,EAAE,CAAC,KAAK;QACd,SAAS,EAAE,KAAK;QAChB,MAAM,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,UAAU,CAAC;QAC/C,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,MAAM;KACjB,CAAC;IAEF,IAAI,KAAK,EAAE,CAAC;QACV,MAAM,GAAG,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAC3C,MAAM,GAAG,CAAC,KAAK,EAAE,CAAC;QAClB,OAAO,CAAC,GAAG,CAAC,yBAAyB,CAAC,CAAC;IACzC,CAAC;SAAM,CAAC;QACN,MAAM,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC7B,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACjC,CAAC;AACH,CAAC;AAED,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE;IACpB,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACnB,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAClB,CAAC,CAAC,CAAC"}
+{"version":3,"file":"build-client.js","sourceRoot":"","sources":["../../src/web-viewer/build-client.ts"],"names":[],"mappings":"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"}

package/dist/web-viewer/client/dist/viewer.js

@@ -0,0 +1,10 @@
+"use strict";(()=>{var _=null,E=[],L=null,y=null,u=1,C="",V=null,f=[],T=null,g=null,r=e=>document.getElementById(e),i={fileName:r("file-name"),openBtn:r("open-btn"),search:r("search"),pagesList:r("pages-list"),tree:r("tree"),canvas:r("canvas"),canvasPlaceholder:r("canvas-placeholder"),zoomIn:r("zoom-in"),zoomOut:r("zoom-out"),zoomLevel:r("zoom-level"),zoomFit:r("zoom-fit"),noSelection:r("no-selection"),nodeDetails:r("node-details"),nodeId:r("node-id"),copyId:r("copy-id"),nodeType:r("node-type"),nodeName:r("node-name"),nodeX:r("node-x"),nodeY:r("node-y"),nodeWidth:r("node-width"),nodeHeight:r("node-height"),textSection:r("text-section"),nodeText:r("node-text"),nodeJson:r("node-json"),fileDialog:r("file-dialog"),filePathInput:r("file-path-input"),cancelOpen:r("cancel-open"),confirmOpen:r("confirm-open")};async function b(e,n){let t=await fetch(e,n);if(!t.ok){let o=await t.json().catch(()=>({error:t.statusText}));throw new Error(o.error||"Request failed")}return t.json()}async function j(){return b("/api/tree")}async function J(e){return b(`/api/node/${encodeURIComponent(e)}`)}async function Z(e){return b(`/api/node-raw/${encodeURIComponent(e)}`)}async function K(e){let n=await fetch(`/api/render/${encodeURIComponent(e)}`);if(!n.ok)throw new Error("Failed to render");return n.text()}async function Q(e){return(await b(`/api/flat-nodes/${encodeURIComponent(e)}`)).nodes}async function ee(e){await b("/api/open",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({filePath:e})})}function te(e){return{DOCUMENT:"D",CANVAS:"P",FRAME:"F",GROUP:"G",TEXT:"T",RECTANGLE:"R",ELLIPSE:"O",VECTOR:"V",LINE:"L",STAR:"*",REGULAR_POLYGON:"P",COMPONENT:"C",COMPONENT_SET:"S",INSTANCE:"I",BOOLEAN_OPERATION:"B",SLICE:"S",STICKY:"N",SHAPE_WITH_TEXT:"ST",CONNECTOR:"CN",SECTION:"SE"}[e]||"?"}function ne(){i.pagesList.innerHTML="";for(let e of E){let n=document.createElement("div");n.className="page-item",e.id===L&&n.classList.add("selected"),n.dataset.pageId=e.id;let t=document.createElement("span");t.className="page-icon",t.textContent="P",n.appendChild(t);let o=document.createElement("span");o.className="page-name",o.textContent=e.name||"(unnamed)",n.appendChild(o),n.addEventListener("click",()=>ie(e.id)),i.pagesList.appendChild(n)}}function ie(e){L=e,y=null,i.pagesList.querySelectorAll(".page-item").forEach(n=>{n.classList.toggle("selected",n.getAttribute("data-page-id")===e)}),I(),i.canvas.innerHTML='<div id="canvas-placeholder">Select a node to preview</div>',i.noSelection.classList.remove("hidden"),i.nodeDetails.classList.add("hidden")}function oe(e,n){if(!n)return!0;let t=n.toLowerCase();return e.name.toLowerCase().includes(t)||e.type.toLowerCase().includes(t)||e.id.toLowerCase().includes(t)}function G(e,n){return oe(e,n)?!0:e.children?e.children.some(t=>G(t,n)):!1}function N(e,n=0){let t=document.createElement("div");t.className="tree-node",t.dataset.nodeId=e.id;let o=e.children&&e.children.length>0,s=n<2;s&&o&&t.classList.add("expanded");let a=document.createElement("div");a.className="tree-node-row",a.style.paddingLeft=`${n*16+8}px`,e.id===y&&a.classList.add("selected");let l=document.createElement("span");l.className=`tree-toggle ${o?s?"expanded":"collapsed":""}`,o&&l.addEventListener("click",v=>{v.stopPropagation(),t.classList.toggle("expanded"),l.classList.toggle("collapsed"),l.classList.toggle("expanded")}),a.appendChild(l);let c=document.createElement("span");c.className=`tree-icon type-${e.type}`,c.textContent=te(e.type),a.appendChild(c);let d=document.createElement("span");d.className="tree-name",d.textContent=e.name||"(unnamed)",a.appendChild(d);let p=document.createElement("span");if(p.className="tree-type",p.textContent=e.type,a.appendChild(p),a.addEventListener("click",()=>O(e.id)),t.appendChild(a),o){let v=document.createElement("div");v.className="tree-children";for(let w of e.children)C&&!G(w,C)||v.appendChild(N(w,n+1));t.appendChild(v)}return t}function I(){i.tree.innerHTML="";let e=E.find(n=>n.id===L);if(!e){i.tree.innerHTML='<div style="padding: 20px; color: #999;">Select a page to view its contents</div>';return}if(C){let n=o=>{o.classList.add("expanded");let s=o.querySelector(".tree-toggle");s&&(s.classList.remove("collapsed"),s.classList.add("expanded"))},t=document.createDocumentFragment();t.appendChild(N(e)),i.tree.appendChild(t),i.tree.querySelectorAll(".tree-node").forEach(o=>{n(o)})}else i.tree.appendChild(N(e))}async function O(e,n){y=e,i.tree.querySelectorAll(".tree-node-row.selected").forEach(o=>{o.classList.remove("selected")});let t=i.tree.querySelector(`[data-node-id="${e}"] > .tree-node-row`);t&&t.classList.add("selected"),i.noSelection.classList.add("hidden"),i.nodeDetails.classList.remove("hidden"),i.nodeId.textContent=e;try{let[o,s]=await Promise.allSettled([J(e),Z(e)]);if(o.status!=="fulfilled")throw o.reason;let{node:a}=o.value,l=s.status==="fulfilled"?s.value.node:a;i.nodeType.textContent=a.type,i.nodeName.textContent=a.name||"(unnamed)",i.nodeX.textContent=a.x?.toFixed(1)??"-",i.nodeY.textContent=a.y?.toFixed(1)??"-",i.nodeWidth.textContent=a.width?.toFixed(1)??"-",i.nodeHeight.textContent=a.height?.toFixed(1)??"-",a.characters?(i.textSection.classList.remove("hidden"),i.nodeText.textContent=a.characters):i.textSection.classList.add("hidden"),i.nodeJson.textContent=JSON.stringify(l,null,2),n?.skipRender?M(e):await ae(e)}catch(o){console.error("Failed to load node details:",o)}}async function ae(e){let n=e!==V;try{let[t,o]=await Promise.all([K(e),Q(e)]);if(i.canvas.innerHTML=t,i.canvasPlaceholder?.remove(),V=e,f=o,o.length>0){let s=1/0,a=1/0,l=-1/0,c=-1/0;for(let d of o)s=Math.min(s,d.absX),a=Math.min(a,d.absY),l=Math.max(l,d.absX+d.width),c=Math.max(c,d.absY+d.height);g={minX:s,minY:a,width:l-s,height:c-a}}else g=null;if(re(),n){x=0,H=0,u=1;let s=F(),a=i.canvas.parentElement;s?(a.scrollLeft=0,a.scrollTop=0):A()}}catch(t){console.error("Failed to render preview:",t),i.canvas.innerHTML=`<div id="canvas-placeholder">Failed to render: ${t}</div>`,i.canvas.style.width="",i.canvas.style.height="",f=[],g=null}}var x=0,H=0;function F(){let n=i.canvas.parentElement.getBoundingClientRect();i.zoomLevel.textContent=`${Math.round(u*100)}%`,i.canvas.style.transform="";let t=i.canvas.querySelector("svg:not(#hover-overlay)");if(t){x===0&&(x=t.width.baseVal.value||parseFloat(t.getAttribute("width")||"100"),H=t.height.baseVal.value||parseFloat(t.getAttribute("height")||"100"));let o=x*u,s=H*u;t.setAttribute("width",String(o)),t.setAttribute("height",String(s));let a=i.canvas.querySelector("#hover-overlay");a&&(a.setAttribute("width",String(o)),a.setAttribute("height",String(s)));let l=80,c=o+l,d=s+l,p=c<=n.width&&d<=n.height;return p?(i.canvas.style.width="",i.canvas.style.height=""):(i.canvas.style.width=`${c}px`,i.canvas.style.height=`${d}px`),p}return!0}function P(e,n){let t=i.canvas.parentElement,o=t.getBoundingClientRect(),s=u,a=n||{x:o.width/2,y:o.height/2},l=40,c=(t.scrollLeft+a.x-l)/s,d=(t.scrollTop+a.y-l)/s;if(u=e,F())t.scrollLeft=0,t.scrollTop=0;else{let v=c*e+l-a.x,w=d*e+l-a.y,q=Math.max(0,t.scrollWidth-t.clientWidth),U=Math.max(0,t.scrollHeight-t.clientHeight);t.scrollLeft=Math.max(0,Math.min(q,v)),t.scrollTop=Math.max(0,Math.min(U,w))}}function Y(){let e=Math.min(u*1.15,10);P(e)}function X(){let e=Math.max(u/1.15,.1);P(e)}function se(e,n){let t=Math.max(-100,Math.min(100,e)),o=1+Math.abs(t)*.003,s;t<0?s=Math.min(u*o,10):s=Math.max(u/o,.1),P(s,n)}function A(){let e=i.canvas.querySelector("svg:not(#hover-overlay)");if(!e)return;let n=i.canvas.parentElement,t=n.getBoundingClientRect(),o=e.width.baseVal.value||parseFloat(e.getAttribute("width")||"100"),s=e.height.baseVal.value||parseFloat(e.getAttribute("height")||"100"),a=80,l=(t.width-a)/o,c=(t.height-a)/s;u=Math.min(l,c,1);let d=F();n.scrollLeft=0,n.scrollTop=0}var h=null,m=null;function re(){m&&m.remove();let e=i.canvas.querySelector("svg");e&&(m=document.createElement("div"),m.id="svg-wrapper",m.style.cssText=`
+    position: relative;
+    display: inline-block;
+  `,e.parentNode?.insertBefore(m,e),m.appendChild(e),h=document.createElementNS("http://www.w3.org/2000/svg","svg"),h.id="hover-overlay",h.style.cssText=`
+    position: absolute;
+    top: 0;
+    left: 0;
+    pointer-events: none;
+    overflow: visible;
+  `,m.appendChild(h))}function z(){return m?m.querySelector("svg:not(#hover-overlay)"):i.canvas.querySelector("svg:not(#hover-overlay)")}function M(e){if(!h||!g||(h.innerHTML="",!e))return;let n=f.find(d=>d.id===e);if(!n)return;let t=z();if(!t)return;let o=t.width.baseVal.value||parseFloat(t.getAttribute("width")||"0"),s=t.height.baseVal.value||parseFloat(t.getAttribute("height")||"0");h.setAttribute("viewBox",`0 0 ${o} ${s}`),h.setAttribute("width",String(o)),h.setAttribute("height",String(s));let a=n.absX-g.minX,l=n.absY-g.minY,c=document.createElementNS("http://www.w3.org/2000/svg","rect");c.setAttribute("x",String(a)),c.setAttribute("y",String(l)),c.setAttribute("width",String(n.width)),c.setAttribute("height",String(n.height)),c.setAttribute("fill","rgba(0, 120, 212, 0.1)"),c.setAttribute("stroke","#0078d4"),c.setAttribute("stroke-width","2"),h.appendChild(c)}function k(e,n){let t=z();if(!t||!g)return null;let o=t.getBoundingClientRect(),s=t.width.baseVal.value||parseFloat(t.getAttribute("width")||"0"),a=t.height.baseVal.value||parseFloat(t.getAttribute("height")||"0"),l=(e-o.left)/u,c=(n-o.top)/u,d=l+g.minX,p=c+g.minY;return{x:d,y:p}}function R(e,n){return f.filter(t=>t.visible&&e>=t.absX&&e<=t.absX+t.width&&n>=t.absY&&n<=t.absY+t.height).sort((t,o)=>o.depth-t.depth)}function D(e){return e.length===0?null:e[0]}function $(e){let n=i.tree.querySelector(`[data-node-id="${e}"]`);if(!n)return;let t=n.parentElement;for(;t;){if(t.classList?.contains("tree-node")){t.classList.add("expanded");let s=t.querySelector(":scope > .tree-node-row > .tree-toggle");s&&(s.classList.remove("collapsed"),s.classList.add("expanded"))}if(t.id==="tree")break;t=t.parentElement}let o=n.querySelector(":scope > .tree-node-row");o&&o.scrollIntoView({behavior:"smooth",block:"center"})}function le(e){if(f.length===0)return;let n=k(e.clientX,e.clientY);if(!n){T=null,M(null);return}let t=R(n.x,n.y),o=D(t);o?.id!==T&&(T=o?.id??null,M(T))}function ce(e){if(f.length===0)return;let n=k(e.clientX,e.clientY);if(!n)return;let t=R(n.x,n.y),o=D(t);if(o){$(o.id);let s=f.some(a=>a.id===o.id);O(o.id,{skipRender:s})}}function de(e){if(f.length===0)return;let n=k(e.clientX,e.clientY);if(!n)return;let t=R(n.x,n.y),o=D(t);o&&($(o.id),O(o.id))}function ue(){T=null,M(null)}function me(){i.fileDialog.classList.remove("hidden"),i.filePathInput.focus()}function S(){i.fileDialog.classList.add("hidden")}async function B(){let e=i.filePathInput.value.trim();if(e)try{i.confirmOpen.disabled=!0,i.confirmOpen.textContent="Loading...",await ee(e),S(),L=null,y=null,await W(),i.fileName.textContent=e.split("/").pop()||e}catch(n){alert(`Failed to open file: ${n}`)}finally{i.confirmOpen.disabled=!1,i.confirmOpen.textContent="Open"}}async function W(){try{let{tree:e,meta:n}=await j();_=e,E=[],e.children&&(E=e.children.filter(t=>t.type==="CANVAS")),E.length>0&&!L&&(L=E[0].id),ne(),I(),n?.name&&(i.fileName.textContent=n.name)}catch(e){console.error("Failed to load tree:",e),E=[],i.pagesList.innerHTML="",i.tree.innerHTML='<div style="padding: 20px; color: #999;">No file loaded. Click "Open File" to start.</div>'}}async function he(){if(y)try{await navigator.clipboard.writeText(y);let e=i.copyId.textContent;i.copyId.textContent="Copied!",setTimeout(()=>{i.copyId.textContent=e},1e3)}catch{let e=document.createElement("textarea");e.value=y,document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e)}}function pe(){i.zoomIn.addEventListener("click",Y),i.zoomOut.addEventListener("click",X),i.zoomFit.addEventListener("click",A),document.addEventListener("keydown",e=>{e.target instanceof HTMLInputElement||(e.key==="="||e.key==="+"?(e.preventDefault(),Y()):e.key==="-"?(e.preventDefault(),X()):e.key==="0"&&(e.preventDefault(),A()))}),i.canvas.parentElement?.addEventListener("wheel",e=>{if(e.ctrlKey||e.metaKey){e.preventDefault();let t=i.canvas.parentElement.getBoundingClientRect(),o={x:e.clientX-t.left,y:e.clientY-t.top};se(e.deltaY,o)}},{passive:!1}),i.canvas.addEventListener("mousemove",le),i.canvas.addEventListener("click",ce),i.canvas.addEventListener("dblclick",de),i.canvas.addEventListener("mouseleave",ue),i.search.addEventListener("input",e=>{C=e.target.value,I()}),i.openBtn.addEventListener("click",me),i.cancelOpen.addEventListener("click",S),i.confirmOpen.addEventListener("click",B),i.filePathInput.addEventListener("keydown",e=>{e.key==="Enter"?B():e.key==="Escape"&&S()}),i.fileDialog.addEventListener("click",e=>{e.target===i.fileDialog&&S()}),i.copyId.addEventListener("click",he),W()}document.addEventListener("DOMContentLoaded",pe);})();

package/dist/web-viewer/client/index.html

@@ -0,0 +1,138 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Fig Viewer</title>
+  <link rel="stylesheet" href="/styles.css">
+</head>
+<body>
+  <div id="app">
+    <!-- Header -->
+    <header id="header">
+      <h1>Fig Viewer</h1>
+      <div id="file-info">
+        <span id="file-name">No file loaded</span>
+        <button id="open-btn" title="Open .fig file">Open File</button>
+      </div>
+    </header>
+
+    <!-- Main layout -->
+    <div id="main">
+      <!-- Left panel: Tree view -->
+      <aside id="tree-panel">
+        <!-- Pages list -->
+        <div id="pages-section">
+          <div id="pages-header">
+            <span>Pages</span>
+          </div>
+          <div id="pages-list"></div>
+        </div>
+
+        <!-- Tree with search -->
+        <div id="tree-section">
+          <div id="tree-header">
+            <input type="text" id="search" placeholder="Search nodes..." />
+          </div>
+          <div id="tree-container">
+            <div id="tree"></div>
+          </div>
+        </div>
+      </aside>
+
+      <!-- Center: Canvas/Preview -->
+      <main id="canvas-panel">
+        <div id="canvas-toolbar">
+          <button id="zoom-in" title="Zoom in">+</button>
+          <span id="zoom-level">100%</span>
+          <button id="zoom-out" title="Zoom out">-</button>
+          <button id="zoom-fit" title="Fit to view">Fit</button>
+        </div>
+        <div id="canvas-container">
+          <div id="canvas">
+            <div id="canvas-placeholder">
+              Select a node to preview
+            </div>
+          </div>
+        </div>
+      </main>
+
+      <!-- Right panel: Node details -->
+      <aside id="details-panel">
+        <div id="details-header">
+          <h2>Node Details</h2>
+        </div>
+        <div id="details-content">
+          <div id="no-selection">Select a node to see details</div>
+          <div id="node-details" class="hidden">
+            <div class="detail-section">
+              <div class="detail-row">
+                <label>ID</label>
+                <div class="detail-value">
+                  <code id="node-id"></code>
+                  <button id="copy-id" title="Copy ID">Copy</button>
+                </div>
+              </div>
+              <div class="detail-row">
+                <label>Type</label>
+                <span id="node-type"></span>
+              </div>
+              <div class="detail-row">
+                <label>Name</label>
+                <span id="node-name"></span>
+              </div>
+            </div>
+
+            <div class="detail-section">
+              <h3>Bounds</h3>
+              <div class="detail-grid">
+                <div class="detail-cell">
+                  <label>X</label>
+                  <span id="node-x">-</span>
+                </div>
+                <div class="detail-cell">
+                  <label>Y</label>
+                  <span id="node-y">-</span>
+                </div>
+                <div class="detail-cell">
+                  <label>W</label>
+                  <span id="node-width">-</span>
+                </div>
+                <div class="detail-cell">
+                  <label>H</label>
+                  <span id="node-height">-</span>
+                </div>
+              </div>
+            </div>
+
+            <div class="detail-section" id="text-section">
+              <h3>Text</h3>
+              <div id="node-text"></div>
+            </div>
+
+            <div class="detail-section">
+              <h3>Raw JSON</h3>
+              <pre id="node-json"></pre>
+            </div>
+          </div>
+        </div>
+      </aside>
+    </div>
+  </div>
+
+  <!-- File picker dialog (hidden by default) -->
+  <div id="file-dialog" class="dialog hidden">
+    <div class="dialog-content">
+      <h2>Open .fig File</h2>
+      <p>Enter the path to a .fig file on your local machine:</p>
+      <input type="text" id="file-path-input" placeholder="/path/to/design.fig" />
+      <div class="dialog-buttons">
+        <button id="cancel-open">Cancel</button>
+        <button id="confirm-open" class="primary">Open</button>
+      </div>
+    </div>
+  </div>
+
+  <script src="/viewer.js"></script>
+</body>
+</html>