@pinepaper.studio/mcp-server 1.3.0 → 1.3.2

package/dist/tools/p5-compat/p5-helpers.js

@@ -0,0 +1,399 @@
+/**
+ * p5.js Compatibility Helpers for PinePaper
+ *
+ * This module provides p5.js-style drawing functions that wrap Paper.js.
+ * These helpers are injected into the browser context to allow Claude
+ * to use familiar p5.js syntax when drawing on the PinePaper canvas.
+ *
+ * SUPPORTED FUNCTIONS (v1.3.1):
+ * - Shapes: circle, ellipse, rect, line, triangle, quad, arc, point
+ * - Style: fill, noFill, stroke, noStroke, strokeWeight, background
+ * - Math: random, map, constrain, dist, lerp, radians, degrees
+ * - Canvas: width, height
+ * - Mode: rectMode, ellipseMode
+ * - Constants: PI, TWO_PI, HALF_PI, QUARTER_PI, CENTER, CORNER
+ */
+/**
+ * Browser-side p5.js compatibility helpers.
+ * This code is injected into the PinePaper page context and executed via eval().
+ */
+export const P5_HELPERS = `
+(function() {
+  // Prevent double-initialization
+  if (window._p5Initialized) {
+    console.log('[p5-compat] Already initialized');
+    return;
+  }
+
+  // ==========================================================================
+  // STATE MANAGEMENT
+  // ==========================================================================
+
+  window._p5State = {
+    fillColor: '#ffffff',
+    strokeColor: '#000000',
+    strokeWidth: 1,
+    rectMode: 'corner',
+    ellipseMode: 'center'
+  };
+
+  // ==========================================================================
+  // CONSTANTS
+  // ==========================================================================
+
+  window.PI = Math.PI;
+  window.TWO_PI = Math.PI * 2;
+  window.HALF_PI = Math.PI / 2;
+  window.QUARTER_PI = Math.PI / 4;
+
+  window.CENTER = 'center';
+  window.CORNER = 'corner';
+
+  // ==========================================================================
+  // CANVAS PROPERTIES
+  // ==========================================================================
+
+  Object.defineProperty(window, 'width', {
+    get: function() {
+      return paper.view ? paper.view.size.width : 800;
+    },
+    configurable: true
+  });
+
+  Object.defineProperty(window, 'height', {
+    get: function() {
+      return paper.view ? paper.view.size.height : 600;
+    },
+    configurable: true
+  });
+
+  // ==========================================================================
+  // MATH UTILITIES
+  // ==========================================================================
+
+  window.random = function(min, max) {
+    if (arguments.length === 0) {
+      return Math.random();
+    } else if (arguments.length === 1) {
+      if (Array.isArray(min)) {
+        // random(array) - return random element
+        return min[Math.floor(Math.random() * min.length)];
+      }
+      // random(max) - return 0 to max
+      return Math.random() * min;
+    } else {
+      // random(min, max)
+      return Math.random() * (max - min) + min;
+    }
+  };
+
+  window.map = function(value, start1, stop1, start2, stop2) {
+    return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));
+  };
+
+  window.constrain = function(value, min, max) {
+    return Math.min(Math.max(value, min), max);
+  };
+
+  window.dist = function(x1, y1, x2, y2) {
+    return Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
+  };
+
+  window.lerp = function(start, stop, amount) {
+    return start + (stop - start) * amount;
+  };
+
+  window.radians = function(degrees) {
+    return degrees * Math.PI / 180;
+  };
+
+  window.degrees = function(radians) {
+    return radians * 180 / Math.PI;
+  };
+
+  // ==========================================================================
+  // STYLE FUNCTIONS
+  // ==========================================================================
+
+  /**
+   * Parse color arguments into a valid color string.
+   * Supports: fill(gray), fill(r,g,b), fill(r,g,b,a), fill('#hex')
+   */
+  function parseColor(args) {
+    if (args.length === 0) return null;
+
+    if (args.length === 1) {
+      var val = args[0];
+      if (typeof val === 'string') {
+        return val;
+      } else if (typeof val === 'number') {
+        // Grayscale
+        return 'rgb(' + val + ', ' + val + ', ' + val + ')';
+      }
+    } else if (args.length === 3) {
+      // RGB
+      return 'rgb(' + args[0] + ', ' + args[1] + ', ' + args[2] + ')';
+    } else if (args.length === 4) {
+      // RGBA (p5 uses 0-255 for alpha, CSS uses 0-1)
+      return 'rgba(' + args[0] + ', ' + args[1] + ', ' + args[2] + ', ' + (args[3] / 255) + ')';
+    }
+
+    return null;
+  }
+
+  window.fill = function() {
+    var color = parseColor(Array.prototype.slice.call(arguments));
+    window._p5State.fillColor = color;
+  };
+
+  window.noFill = function() {
+    window._p5State.fillColor = null;
+  };
+
+  window.stroke = function() {
+    var color = parseColor(Array.prototype.slice.call(arguments));
+    window._p5State.strokeColor = color;
+  };
+
+  window.noStroke = function() {
+    window._p5State.strokeColor = null;
+  };
+
+  window.strokeWeight = function(weight) {
+    window._p5State.strokeWidth = weight;
+  };
+
+  window.background = function() {
+    var color = parseColor(Array.prototype.slice.call(arguments));
+    if (color && typeof app !== 'undefined' && app.setBackgroundColor) {
+      app.setBackgroundColor(color);
+    }
+  };
+
+  // ==========================================================================
+  // MODE FUNCTIONS
+  // ==========================================================================
+
+  window.rectMode = function(mode) {
+    window._p5State.rectMode = mode.toLowerCase();
+  };
+
+  window.ellipseMode = function(mode) {
+    window._p5State.ellipseMode = mode.toLowerCase();
+  };
+
+  // ==========================================================================
+  // SHAPE FUNCTIONS
+  // ==========================================================================
+
+  /**
+   * Apply current style state to an item
+   */
+  function applyStyle(item) {
+    if (window._p5State.fillColor) {
+      item.fillColor = window._p5State.fillColor;
+    }
+    if (window._p5State.strokeColor) {
+      item.strokeColor = window._p5State.strokeColor;
+      item.strokeWidth = window._p5State.strokeWidth;
+    }
+  }
+
+  /**
+   * Register item with PinePaper's ItemRegistry
+   */
+  function registerItem(item, type) {
+    if (typeof app !== 'undefined' && app.registerItem) {
+      app.registerItem(item, type, { source: 'p5' });
+    }
+    return item;
+  }
+
+  /**
+   * Draw a circle
+   * circle(x, y, diameter)
+   */
+  window.circle = function(x, y, d) {
+    var item = new paper.Path.Circle({
+      center: [x, y],
+      radius: d / 2
+    });
+    applyStyle(item);
+    return registerItem(item, 'circle');
+  };
+
+  /**
+   * Draw an ellipse
+   * ellipse(x, y, width, [height])
+   */
+  window.ellipse = function(x, y, w, h) {
+    h = h !== undefined ? h : w;
+    var mode = window._p5State.ellipseMode;
+    var center = mode === 'center' ? [x, y] : [x + w / 2, y + h / 2];
+
+    var item = new paper.Path.Ellipse({
+      center: center,
+      size: [w, h]
+    });
+    applyStyle(item);
+    return registerItem(item, 'ellipse');
+  };
+
+  /**
+   * Draw a rectangle
+   * rect(x, y, width, height, [cornerRadius])
+   */
+  window.rect = function(x, y, w, h, r) {
+    var mode = window._p5State.rectMode;
+    var point = mode === 'center' ? [x - w / 2, y - h / 2] : [x, y];
+
+    var options = {
+      point: point,
+      size: [w, h]
+    };
+
+    if (r !== undefined && r > 0) {
+      options.radius = r;
+    }
+
+    var item = new paper.Path.Rectangle(options);
+    applyStyle(item);
+    return registerItem(item, 'rectangle');
+  };
+
+  /**
+   * Draw a line
+   * line(x1, y1, x2, y2)
+   */
+  window.line = function(x1, y1, x2, y2) {
+    var item = new paper.Path.Line({
+      from: [x1, y1],
+      to: [x2, y2]
+    });
+    // Lines typically don't have fill
+    if (window._p5State.strokeColor) {
+      item.strokeColor = window._p5State.strokeColor;
+      item.strokeWidth = window._p5State.strokeWidth;
+    }
+    return registerItem(item, 'line');
+  };
+
+  /**
+   * Draw a triangle
+   * triangle(x1, y1, x2, y2, x3, y3)
+   */
+  window.triangle = function(x1, y1, x2, y2, x3, y3) {
+    var item = new paper.Path({
+      segments: [[x1, y1], [x2, y2], [x3, y3]],
+      closed: true
+    });
+    applyStyle(item);
+    return registerItem(item, 'triangle');
+  };
+
+  /**
+   * Draw a quadrilateral
+   * quad(x1, y1, x2, y2, x3, y3, x4, y4)
+   */
+  window.quad = function(x1, y1, x2, y2, x3, y3, x4, y4) {
+    var item = new paper.Path({
+      segments: [[x1, y1], [x2, y2], [x3, y3], [x4, y4]],
+      closed: true
+    });
+    applyStyle(item);
+    return registerItem(item, 'quad');
+  };
+
+  /**
+   * Draw an arc
+   * arc(x, y, width, height, startAngle, stopAngle)
+   * Note: p5.js uses radians by default
+   */
+  window.arc = function(x, y, w, h, start, stop) {
+    // Calculate the arc using Paper.js
+    var cx = x;
+    var cy = y;
+    var rx = w / 2;
+    var ry = h / 2;
+
+    // Convert from p5's angle system to Paper.js
+    // p5 uses radians where 0 is right, PI/2 is down
+    var startDeg = start * 180 / Math.PI;
+    var stopDeg = stop * 180 / Math.PI;
+
+    // Create arc using path segments
+    var item = new paper.Path.Arc({
+      from: [
+        cx + rx * Math.cos(start),
+        cy + ry * Math.sin(start)
+      ],
+      through: [
+        cx + rx * Math.cos((start + stop) / 2),
+        cy + ry * Math.sin((start + stop) / 2)
+      ],
+      to: [
+        cx + rx * Math.cos(stop),
+        cy + ry * Math.sin(stop)
+      ]
+    });
+
+    applyStyle(item);
+    return registerItem(item, 'arc');
+  };
+
+  /**
+   * Draw a point (tiny circle)
+   * point(x, y)
+   */
+  window.point = function(x, y) {
+    var size = window._p5State.strokeWidth || 1;
+    var item = new paper.Path.Circle({
+      center: [x, y],
+      radius: size / 2
+    });
+    // Points use stroke color as fill
+    if (window._p5State.strokeColor) {
+      item.fillColor = window._p5State.strokeColor;
+    }
+    return registerItem(item, 'point');
+  };
+
+  // ==========================================================================
+  // INITIALIZATION COMPLETE
+  // ==========================================================================
+
+  window._p5Initialized = true;
+  console.log('[p5-compat] p5.js compatibility layer loaded (v1.3.1)');
+  console.log('[p5-compat] Available: circle, ellipse, rect, line, triangle, quad, arc, point');
+  console.log('[p5-compat] Style: fill, noFill, stroke, noStroke, strokeWeight, background');
+  console.log('[p5-compat] Math: random, map, constrain, dist, lerp, radians, degrees');
+})();
+`;
+/**
+ * Generate code that initializes p5 helpers and executes user code
+ */
+export function generateP5DrawCode(userCode) {
+    return `
+// Initialize p5.js compatibility layer if not already loaded
+if (!window._p5Initialized) {
+  ${P5_HELPERS}
+}
+
+// Execute user's p5.js-style code
+(function() {
+  try {
+    ${userCode}
+
+    // Save history state after drawing
+    if (typeof app !== 'undefined' && app.historyManager) {
+      app.historyManager.saveState();
+    }
+
+    return { success: true, message: 'p5.js code executed successfully' };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`;
+}
+//# sourceMappingURL=p5-helpers.js.map

package/dist/tools/p5-compat/p5-helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"p5-helpers.js","sourceRoot":"","sources":["../../../src/tools/p5-compat/p5-helpers.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+VzB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,kBAAkB,CAAC,QAAgB;IACjD,OAAO;;;IAGL,UAAU;;;;;;MAMR,QAAQ;;;;;;;;;;;;CAYb,CAAC;AACF,CAAC"}

package/dist/types/code-generator.d.ts

@@ -4,7 +4,7 @@
  * Converts MCP tool inputs to executable PinePaper JavaScript code.
  * This code is designed to run in the browser context where window.PinePaper is available.
  */
-import { ItemType, RelationType, CreateItemInputSchema, ModifyItemInputSchema, AddRelationInputSchema, AnimateItemInputSchema, KeyframeAnimateInputSchema, ExecuteGeneratorInputSchema, ApplyEffectInputSchema, SetBackgroundColorInputSchema, SetCanvasSizeInputSchema, CreateGlossySphereInputSchema, CreateDiagonalStripesInputSchema, BatchCreateInputSchema, BatchModifyInputSchema, CreateGridInputSchema } from './schemas.js';
+import { ItemType, RelationType, CreateItemInputSchema, ModifyItemInputSchema, AddRelationInputSchema, AnimateItemInputSchema, KeyframeAnimateInputSchema, ExecuteGeneratorInputSchema, ApplyEffectInputSchema, SetBackgroundColorInputSchema, SetCanvasSizeInputSchema, CreateGlossySphereInputSchema, CreateDiagonalStripesInputSchema, BatchCreateInputSchema, BatchModifyInputSchema, CreateGridInputSchema, CreateSceneInput } from './schemas.js';
 import { z } from 'zod';
 export declare class PinePaperCodeGenerator {
     /**
@@ -123,6 +123,14 @@ export declare class PinePaperCodeGenerator {
      * Generate code for creating a grid
      */
     generateCreateGrid(input: z.infer<typeof CreateGridInputSchema>): string;
+    /**
+     * Generate code for executing p5.js-style drawing code
+     */
+    generateP5Draw(code: string): string;
+    /**
+     * Generate code for creating a complete scene with items, relations, and animations
+     */
+    generateCreateScene(input: CreateSceneInput): string;
 }
 export declare const codeGenerator: PinePaperCodeGenerator;
 //# sourceMappingURL=code-generator.d.ts.map

package/dist/types/code-generator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"code-generator.d.ts","sourceRoot":"","sources":["../../src/types/code-generator.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"code-generator.d.ts","sourceRoot":"","sources":["../../src/types/code-generator.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EACL,QAAQ,EAER,YAAY,EAEZ,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,EACtB,sBAAsB,EACtB,0BAA0B,EAC1B,2BAA2B,EAC3B,sBAAsB,EACtB,6BAA6B,EAC7B,wBAAwB,EAExB,6BAA6B,EAC7B,gCAAgC,EAGhC,sBAAsB,EACtB,sBAAsB,EACtB,qBAAqB,EAIrB,gBAAgB,EACjB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAirBxB,qBAAa,sBAAsB;IACjC;;OAEG;IACH,kBAAkB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,qBAAqB,CAAC,GAAG,MAAM;IASxE;;OAEG;IACH,kBAAkB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,qBAAqB,CAAC,GAAG,MAAM;IAQxE;;OAEG;IACH,kBAAkB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAI1C;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,sBAAsB,CAAC,GAAG,MAAM;IAU1E;;OAEG;IACH,sBAAsB,CACpB,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,YAAY,CAAC,EAAE,YAAY,GAC1B,MAAM;IAIT;;OAEG;IACH,sBAAsB,CACpB,MAAM,EAAE,MAAM,EACd,YAAY,CAAC,EAAE,YAAY,EAC3B,SAAS,GAAE,UAAU,GAAG,UAAuB,GAC9C,MAAM;IAIT;;OAEG;IACH,eAAe,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,sBAAsB,CAAC,GAAG,MAAM;IAStE;;OAEG;IACH,uBAAuB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,0BAA0B,CAAC,GAAG,MAAM;IAUlF;;OAEG;IACH,wBAAwB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,2BAA2B,CAAC,GAAG,MAAM;IAQpF;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,sBAAsB,CAAC,GAAG,MAAM;IAS1E;;OAEG;IACH,gBAAgB,CAAC,MAAM,CAAC,EAAE;QACxB,IAAI,CAAC,EAAE,QAAQ,CAAC;QAChB,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,YAAY,CAAC,EAAE,OAAO,CAAC;QACvB,WAAW,CAAC,EAAE,OAAO,CAAC;KACvB,GAAG,MAAM;IAIV;;OAEG;IACH,oBAAoB,CAClB,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAChC,QAAQ,CAAC,EAAE,MAAM,EACjB,IAAI,CAAC,EAAE,OAAO,EACd,IAAI,CAAC,EAAE,MAAM,GACZ,MAAM;IAIT;;OAEG;IACH,0BAA0B,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,6BAA6B,CAAC,GAAG,MAAM;IAKxF;;OAEG;IACH,qBAAqB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,wBAAwB,CAAC,GAAG,MAAM;IAS9E;;OAEG;IACH,iBAAiB,IAAI,MAAM;IAI3B;;OAEG;IACH,0BAA0B,CACxB,MAAM,GAAE,MAAM,GAAG,OAAgB,EACjC,eAAe,GAAE,OAAc,GAC9B,MAAM;IAIT;;OAEG;IACH,wBAAwB,IAAI,MAAM;IAIlC;;OAEG;IACH,sBAAsB,IAAI,MAAM;IAIhC;;OAEG;IACH,qBAAqB,IAAI,MAAM;IAI/B;;OAEG;IACH,mBAAmB,IAAI,MAAM;IAI7B;;OAEG;IACH,iBAAiB,CACf,SAAS,CAAC,EAAE,MAAM,EAClB,GAAG,CAAC,EAAE,MAAM,EACZ,QAAQ,GAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAuB,EACvD,KAAK,GAAE,MAAY,GAClB,MAAM;IA4CT;;OAEG;IACH,iBAAiB,CACf,UAAU,EAAE,MAAM,EAClB,MAAM,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,GACnC,MAAM;IAQT;;OAEG;IACH,0BAA0B,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,6BAA6B,CAAC,GAAG,MAAM;IA0FxF;;OAEG;IACH,6BAA6B,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,gCAAgC,CAAC,GAAG,MAAM;IAyD9F;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,sBAAsB,CAAC,GAAG,MAAM;IAK1E;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,sBAAsB,CAAC,GAAG,MAAM;IAK1E;;OAEG;IACH,kBAAkB,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,qBAAqB,CAAC,GAAG,MAAM;IAaxE;;OAEG;IACH,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IAMpC;;OAEG;IACH,mBAAmB,CAAC,KAAK,EAAE,gBAAgB,GAAG,MAAM;CA0LrD;AAGD,eAAO,MAAM,aAAa,wBAA+B,CAAC"}

package/dist/types/code-generator.js

@@ -4,7 +4,7 @@
  * Converts MCP tool inputs to executable PinePaper JavaScript code.
  * This code is designed to run in the browser context where window.PinePaper is available.
  */
-import { CreateItemInputSchema, ModifyItemInputSchema, AddRelationInputSchema, AnimateItemInputSchema, KeyframeAnimateInputSchema, ExecuteGeneratorInputSchema, ApplyEffectInputSchema, SetBackgroundColorInputSchema, SetCanvasSizeInputSchema, CreateGlossySphereInputSchema, CreateDiagonalStripesInputSchema, BatchCreateInputSchema, BatchModifyInputSchema, CreateGridInputSchema, } from './schemas.js';
+import { CreateItemInputSchema, ModifyItemInputSchema, AddRelationInputSchema, AnimateItemInputSchema, KeyframeAnimateInputSchema, ExecuteGeneratorInputSchema, ApplyEffectInputSchema, SetBackgroundColorInputSchema, SetCanvasSizeInputSchema, CreateGlossySphereInputSchema, CreateDiagonalStripesInputSchema, BatchCreateInputSchema, BatchModifyInputSchema, CreateGridInputSchema, CreateSceneInputSchema, } from './schemas.js';
 // =============================================================================
 // HELPER FUNCTIONS
 // =============================================================================
@@ -909,6 +909,181 @@ app.historyManager.saveState();
         const validated = CreateGridInputSchema.parse(input);
         return generateCreateGridCode(validated.cols, validated.rows, validated.strokeColor, validated.strokeWidth, validated.animated, validated.waveSpeed, validated.waveAmplitude);
     }
+    /**
+     * Generate code for executing p5.js-style drawing code
+     */
+    generateP5Draw(code) {
+        // Import the p5 helpers generator
+        const { generateP5DrawCode } = require('../tools/p5-compat/p5-helpers.js');
+        return generateP5DrawCode(code);
+    }
+    /**
+     * Generate code for creating a complete scene with items, relations, and animations
+     */
+    generateCreateScene(input) {
+        const validated = CreateSceneInputSchema.parse(input);
+        const { items, relations = [], animations = [], backgroundColor, backgroundGenerator, clearFirst = true, } = validated;
+        const codeParts = [];
+        // Start with a comment
+        codeParts.push('// Create complete scene');
+        codeParts.push('const nameToId = {};');
+        codeParts.push('const results = { items: [], relations: [], animations: [] };');
+        // Clear canvas if requested
+        if (clearFirst) {
+            codeParts.push(`
+// Clear canvas
+(function() {
+  const items = app.itemRegistry.getAll();
+  items.forEach(item => {
+    try { item.remove(); } catch(e) {}
+  });
+  app.itemRegistry.clear();
+})();
+`);
+        }
+        // Set background color if provided
+        if (backgroundColor) {
+            codeParts.push(`
+// Set background color
+paper.project.activeLayer.children.forEach(c => {
+  if (c.name === 'background') c.remove();
+});
+const bg = new paper.Path.Rectangle({
+  point: [0, 0],
+  size: [paper.view.size.width, paper.view.size.height],
+  fillColor: '${backgroundColor}',
+  name: 'background'
+});
+bg.sendToBack();
+`);
+        }
+        // Execute background generator if provided
+        if (backgroundGenerator) {
+            codeParts.push(`
+// Execute background generator
+if (typeof app.generators !== 'undefined' && app.generators['${backgroundGenerator}']) {
+  app.generators['${backgroundGenerator}']();
+}
+`);
+        }
+        // Create all items
+        for (const item of items) {
+            const { name, itemType, position = { x: 400, y: 300 }, properties = {} } = item;
+            // Build properties string
+            const propsEntries = Object.entries(properties)
+                .map(([key, value]) => `${key}: ${JSON.stringify(value)}`)
+                .join(', ');
+            const propsStr = propsEntries ? `, ${propsEntries}` : '';
+            codeParts.push(`
+// Create item: ${name}
+(function() {
+  const itemParams = {
+    type: '${itemType}',
+    position: { x: ${position.x}, y: ${position.y} }${propsStr}
+  };
+
+  let item;
+  switch ('${itemType}') {
+    case 'circle':
+      item = new paper.Path.Circle({
+        center: [${position.x}, ${position.y}],
+        radius: ${properties.radius || 50},
+        fillColor: '${properties.color || properties.fillColor || '#3b82f6'}',
+        parent: app.textItemGroup
+      });
+      break;
+    case 'rectangle':
+      item = new paper.Path.Rectangle({
+        point: [${position.x - (properties.width || 100) / 2}, ${position.y - (properties.height || 60) / 2}],
+        size: [${properties.width || 100}, ${properties.height || 60}],
+        fillColor: '${properties.color || properties.fillColor || '#3b82f6'}',
+        parent: app.textItemGroup
+      });
+      break;
+    case 'star':
+      item = new paper.Path.Star({
+        center: [${position.x}, ${position.y}],
+        points: ${properties.points || 5},
+        radius1: ${properties.radius1 || 40},
+        radius2: ${properties.radius2 || 20},
+        fillColor: '${properties.color || properties.fillColor || '#fbbf24'}',
+        parent: app.textItemGroup
+      });
+      break;
+    case 'text':
+      item = new paper.PointText({
+        point: [${position.x}, ${position.y}],
+        content: '${properties.content || 'Text'}',
+        fontSize: ${properties.fontSize || 24},
+        fillColor: '${properties.color || properties.fillColor || '#ffffff'}',
+        fontFamily: '${properties.fontFamily || 'Inter'}',
+        justification: 'center',
+        parent: app.textItemGroup
+      });
+      break;
+    default:
+      item = new paper.Path.Circle({
+        center: [${position.x}, ${position.y}],
+        radius: 30,
+        fillColor: '${properties.color || properties.fillColor || '#3b82f6'}',
+        parent: app.textItemGroup
+      });
+  }
+
+  const itemId = app.registerItem(item, '${name}', { source: 'mcp-scene' });
+  nameToId['${name}'] = itemId;
+  results.items.push({ name: '${name}', itemId, type: '${itemType}' });
+})();
+`);
+        }
+        // Establish relations
+        for (const relation of relations) {
+            const { source, target, type, params = {} } = relation;
+            const paramsStr = JSON.stringify(params);
+            codeParts.push(`
+// Add relation: ${source} ${type} ${target}
+(function() {
+  const sourceId = nameToId['${source}'];
+  const targetId = nameToId['${target}'];
+  if (sourceId && targetId) {
+    const sourceItem = app.itemRegistry.get(sourceId);
+    const targetItem = app.itemRegistry.get(targetId);
+    if (sourceItem && targetItem) {
+      const params = ${paramsStr};
+      app.relationManager.addRelation(sourceItem, targetItem, '${type}', params);
+      results.relations.push({ source: '${source}', target: '${target}', type: '${type}' });
+    }
+  }
+})();
+`);
+        }
+        // Apply animations
+        for (const animation of animations) {
+            const { target, type, speed = 1.0, params = {} } = animation;
+            const paramsStr = JSON.stringify({ ...params, speed });
+            codeParts.push(`
+// Apply animation: ${type} to ${target}
+(function() {
+  const targetId = nameToId['${target}'];
+  if (targetId) {
+    const targetItem = app.itemRegistry.get(targetId);
+    if (targetItem) {
+      const params = ${paramsStr};
+      app.animationManager.addAnimation(targetItem, '${type}', params);
+      results.animations.push({ target: '${target}', type: '${type}' });
+    }
+  }
+})();
+`);
+        }
+        // Save history and return results
+        codeParts.push(`
+// Save history and return results
+app.historyManager.saveState();
+results;
+`);
+        return codeParts.join('\n');
+    }
 }
 // Export singleton instance
 export const codeGenerator = new PinePaperCodeGenerator();