@pinepaper.studio/mcp-server 1.4.2 → 1.5.0

package/dist/types/code-generator.js

@@ -4,7 +4,28 @@
  * 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, CreateSceneInputSchema, } from './schemas.js';
+import { generateP5DrawCode } from '../tools/p5-compat/p5-helpers.js';
+import { CreateItemInputSchema, ModifyItemInputSchema, AddRelationInputSchema, AnimateItemInputSchema, KeyframeAnimateInputSchema, ExecuteGeneratorInputSchema, ApplyEffectInputSchema, SetBackgroundColorInputSchema, SetCanvasSizeInputSchema, CreateGlossySphereInputSchema, CreateDiagonalStripesInputSchema, BatchCreateInputSchema, BatchModifyInputSchema, CreateGridInputSchema, CreateSceneInputSchema, 
+// Diagram types
+CreateDiagramShapeInputSchema, ConnectInputSchema, ConnectPortsInputSchema, AddPortsInputSchema, AutoLayoutInputSchema, GetDiagramShapesInputSchema, UpdateConnectorInputSchema, RemoveConnectorInputSchema, DiagramModeInputSchema, 
+// Agent flow mode types
+AgentStartJobInputSchema, AgentEndJobInputSchema, AgentResetInputSchema, AgentBatchExecuteInputSchema, AgentExportInputSchema, AgentAnalyzeInputSchema, 
+// Interactive/Trigger types
+AddTriggerInputSchema, RemoveTriggerInputSchema, QueryTriggersInputSchema, 
+// Quiz types
+CreateQuizInputSchema, GetQuizStateInputSchema, ResetQuizInputSchema, 
+// Widget export types
+ExportWidgetInputSchema, 
+// Letter collage types
+CreateLetterCollageInputSchema, AnimateLetterCollageInputSchema, 
+// Map types
+LoadMapInputSchema, HighlightRegionsInputSchema, UnhighlightRegionsInputSchema, ApplyDataColorsInputSchema, AddMarkerInputSchema, AddMapLabelsInputSchema, PanMapInputSchema, ZoomMapInputSchema, ImportCustomMapInputSchema, GetRegionAtPointInputSchema, 
+// Map animation/CSV types
+AnimateMapRegionsInputSchema, AnimateMapWaveInputSchema, StopMapAnimationsInputSchema, ExportMapRegionCSVInputSchema, ImportMapRegionCSVInputSchema, SelectMapRegionsInputSchema, DeselectMapRegionsInputSchema, 
+// Custom relation/code types
+RegisterCustomRelationInputSchema, ExecuteCustomCodeInputSchema, 
+// Mask types
+ApplyAnimatedMaskInputSchema, ApplyCustomMaskInputSchema, RemoveMaskInputSchema, } from './schemas.js';
 // =============================================================================
 // HELPER FUNCTIONS
 // =============================================================================
@@ -106,6 +127,8 @@ const item = app.create('${itemType}', ${JSON.stringify(params, null, 2)});`;
     if (opacity !== undefined) {
         code += `\nitem.opacity = ${opacity};`;
     }
+    // Ensure item is visible above backgrounds/generators
+    code += `\nif (item.bringToFront) item.bringToFront();`;
     code += `
 const itemId = item.data.registryId;
 app.historyManager.saveState();
@@ -120,11 +143,8 @@ app.historyManager.saveState();
 function generateModifyItemCode(itemId, properties) {
     return `
 // Modify item ${itemId}
-const item = app.getItemById('${itemId}');
-if (!item) {
-  throw new Error('Item not found: ${itemId}');
-}
-app.modify(item, ${JSON.stringify(properties, null, 2)});
+app.select('${itemId}');
+app.modify(${JSON.stringify(properties, null, 2)});
 app.historyManager.saveState();
 
 // Return success
@@ -244,18 +264,7 @@ function generateKeyframeAnimateCode(itemId, keyframes, duration, loop = false)
     const calculatedDuration = duration || Math.max(...keyframes.map(k => k.time));
     return `
 // Apply keyframe animation to ${itemId}
-const item = app.getItemById('${itemId}');
-if (!item) {
-  throw new Error('Item not found: ${itemId}');
-}
-
-app.modify(item, {
-  animationType: 'keyframe',
-  keyframes: ${keyframesJson}
-});
-
-// Start playback
-app.playKeyframeTimeline(${calculatedDuration}, ${loop});
+app.addAnimation('${itemId}', ${keyframesJson}, { duration: ${calculatedDuration}, loop: ${loop} });
 
 ({ success: true, itemId: '${itemId}', duration: ${calculatedDuration}, loop: ${loop} });
 `.trim();
@@ -266,9 +275,10 @@ app.playKeyframeTimeline(${calculatedDuration}, ${loop});
 function generateExecuteGeneratorCode(generatorName, params) {
     return `
 // Execute ${generatorName} generator
-await app.executeGenerator('${generatorName}', ${JSON.stringify(params, null, 2)});
-
-({ success: true, generator: '${generatorName}' });
+(async function() {
+  await app.executeGenerator('${generatorName}', ${JSON.stringify(params, null, 2)});
+  return { success: true, generator: '${generatorName}' };
+})();
 `.trim();
 }
 /**
@@ -372,9 +382,12 @@ app.setBackgroundColor('${color}');
  * Template for canvas size
  */
 function generateSetCanvasSizeCode(width, height, preset) {
+    const sizeArg = preset
+        ? `'${preset}'`
+        : `{ width: ${width}, height: ${height} }`;
     return `
 // Set canvas size
-app.setCanvasSize(${width}, ${height}${preset ? `, '${preset}'` : ''});
+app.setCanvasSize(${sizeArg});
 app.historyManager.saveState();
 ({ success: true, width: ${width}, height: ${height} });
 `.trim();
@@ -585,7 +598,7 @@ export class PinePaperCodeGenerator {
      */
     generateAddRelation(input) {
         const validated = AddRelationInputSchema.parse(input);
-        return generateAddRelationCode(validated.sourceId, validated.targetId, validated.relationType, validated.params);
+        return generateAddRelationCode(validated.sourceId, validated.targetId || validated.sourceId, validated.relationType, validated.params);
     }
     /**
      * Generate code for removing a relation
@@ -913,8 +926,6 @@ app.historyManager.saveState();
      * 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);
     }
     /**
@@ -1031,6 +1042,7 @@ if (typeof app.generators !== 'undefined' && app.generators['${backgroundGenerat
   }
 
   const itemId = app.registerItem(item, '${name}', { source: 'mcp-scene' });
+  if (item.bringToFront) item.bringToFront();
   nameToId['${name}'] = itemId;
   results.items.push({ name: '${name}', itemId, type: '${itemType}' });
 })();
@@ -1069,7 +1081,7 @@ if (typeof app.generators !== 'undefined' && app.generators['${backgroundGenerat
     const targetItem = app.itemRegistry.get(targetId);
     if (targetItem) {
       const params = ${paramsStr};
-      app.animationManager.addAnimation(targetItem, '${type}', params);
+      app.animate(targetItem, { animationType: '${type}', ...params });
       results.animations.push({ target: '${target}', type: '${type}' });
     }
   }
@@ -1084,6 +1096,2546 @@ results;
 `);
         return codeParts.join('\n');
     }
+    // =============================================================================
+    // DIAGRAM TOOLS
+    // =============================================================================
+    /**
+     * Generate code for creating a diagram shape
+     */
+    generateCreateDiagramShape(input) {
+        const validated = CreateDiagramShapeInputSchema.parse(input);
+        const { shapeType, position, width, height, label, style } = validated;
+        const styleStr = style ? JSON.stringify(style) : '{}';
+        const widthVal = width || 120;
+        const heightVal = height || 60;
+        const labelStr = label ? `'${label.replace(/'/g, "\\'")}'` : 'null';
+        return `
+// Create diagram shape: ${shapeType}
+const shapeConfig = {
+  shapeType: '${shapeType}',
+  position: { x: ${position.x}, y: ${position.y} },
+  width: ${widthVal},
+  height: ${heightVal},
+  label: ${labelStr},
+  style: ${styleStr}
+};
+
+const shape = app.diagramManager.createShape(shapeConfig);
+const itemId = shape.data?.registryId || shape.id;
+app.historyManager.saveState();
+
+({ itemId, shapeType: '${shapeType}', position: { x: ${position.x}, y: ${position.y} } });
+`.trim();
+    }
+    /**
+     * Generate code for connecting two items
+     */
+    generateConnect(input) {
+        const validated = ConnectInputSchema.parse(input);
+        const { sourceItemId, targetItemId, routing, lineColor, lineWidth, lineStyle, headStyle, tailStyle, label, curvature, boltEnabled, boltColor, } = validated;
+        const config = {
+            routing,
+            lineStyle,
+            headStyle,
+            tailStyle,
+            curvature,
+            boltEnabled,
+            boltColor,
+        };
+        if (lineColor)
+            config.lineColor = lineColor;
+        if (lineWidth)
+            config.lineWidth = lineWidth;
+        if (label)
+            config.label = label;
+        return `
+// Connect items: ${sourceItemId} -> ${targetItemId}
+const sourceItem = app.getItemById('${sourceItemId}');
+const targetItem = app.getItemById('${targetItemId}');
+
+if (!sourceItem) throw new Error('Source item not found: ${sourceItemId}');
+if (!targetItem) throw new Error('Target item not found: ${targetItemId}');
+
+const config = ${JSON.stringify(config, null, 2)};
+const connector = app.diagramManager.connect(sourceItem, targetItem, config);
+const connectorId = connector.data?.registryId || connector.id;
+app.historyManager.saveState();
+
+({ connectorId, sourceItemId: '${sourceItemId}', targetItemId: '${targetItemId}' });
+`.trim();
+    }
+    /**
+     * Generate code for connecting specific ports
+     */
+    generateConnectPorts(input) {
+        const validated = ConnectPortsInputSchema.parse(input);
+        const { sourceItemId, sourcePort, targetItemId, targetPort, config } = validated;
+        const configStr = config ? JSON.stringify(config, null, 2) : '{}';
+        return `
+// Connect ports: ${sourceItemId}:${sourcePort} -> ${targetItemId}:${targetPort}
+const sourceItem = app.getItemById('${sourceItemId}');
+const targetItem = app.getItemById('${targetItemId}');
+
+if (!sourceItem) throw new Error('Source item not found: ${sourceItemId}');
+if (!targetItem) throw new Error('Target item not found: ${targetItemId}');
+
+const config = ${configStr};
+const connector = app.diagramManager.connectPorts(
+  sourceItem, '${sourcePort}',
+  targetItem, '${targetPort}',
+  config
+);
+const connectorId = connector.data?.registryId || connector.id;
+app.historyManager.saveState();
+
+({ connectorId, sourceItemId: '${sourceItemId}', sourcePort: '${sourcePort}', targetItemId: '${targetItemId}', targetPort: '${targetPort}' });
+`.trim();
+    }
+    /**
+     * Generate code for adding ports to an item
+     */
+    generateAddPorts(input) {
+        const validated = AddPortsInputSchema.parse(input);
+        const { itemId, portType, ports, count } = validated;
+        const portsStr = ports ? JSON.stringify(ports, null, 2) : 'undefined';
+        const countVal = count !== undefined ? count : 'undefined';
+        return `
+// Add ports to item: ${itemId}
+const item = app.getItemById('${itemId}');
+if (!item) throw new Error('Item not found: ${itemId}');
+
+const result = app.diagramManager.addPorts(item, {
+  portType: '${portType}',
+  ports: ${portsStr},
+  count: ${countVal}
+});
+app.historyManager.saveState();
+
+({ itemId: '${itemId}', portsAdded: result.portsAdded || 0, portType: '${portType}' });
+`.trim();
+    }
+    /**
+     * Generate code for auto-layout
+     */
+    generateAutoLayout(input) {
+        const validated = AutoLayoutInputSchema.parse(input);
+        const { layoutType, itemIds, options } = validated;
+        const itemIdsStr = itemIds ? JSON.stringify(itemIds) : 'null';
+        const optionsStr = options ? JSON.stringify(options, null, 2) : '{}';
+        return `
+// Apply auto-layout: ${layoutType}
+const itemIds = ${itemIdsStr};
+const options = ${optionsStr};
+
+const result = app.diagramManager.autoLayout('${layoutType}', itemIds, options);
+app.historyManager.saveState();
+
+({ layoutType: '${layoutType}', itemsAffected: result.itemsAffected || 0, success: result.success });
+`.trim();
+    }
+    /**
+     * Generate code for getting available diagram shapes
+     */
+    generateGetDiagramShapes(input) {
+        const validated = GetDiagramShapesInputSchema.parse(input);
+        const { category } = validated;
+        const categoryFilter = category ? `'${category}'` : 'null';
+        return `
+// Get available diagram shapes
+const category = ${categoryFilter};
+const shapes = app.diagramManager.getAvailableShapes(category);
+
+({ shapes, count: shapes.length, category: ${categoryFilter} || 'all' });
+`.trim();
+    }
+    /**
+     * Generate code for updating a connector
+     */
+    generateUpdateConnector(input) {
+        const validated = UpdateConnectorInputSchema.parse(input);
+        const { connectorId, style, label, labelPosition } = validated;
+        const updates = [];
+        if (style) {
+            updates.push(`style: ${JSON.stringify(style)}`);
+        }
+        if (label !== undefined) {
+            updates.push(`label: '${label.replace(/'/g, "\\'")}'`);
+        }
+        if (labelPosition !== undefined) {
+            updates.push(`labelPosition: ${labelPosition}`);
+        }
+        const updatesStr = updates.length > 0 ? `{ ${updates.join(', ')} }` : '{}';
+        return `
+// Update connector: ${connectorId}
+const connector = app.getItemById('${connectorId}');
+if (!connector) throw new Error('Connector not found: ${connectorId}');
+
+const updates = ${updatesStr};
+app.diagramManager.updateConnector(connector, updates);
+app.historyManager.saveState();
+
+({ connectorId: '${connectorId}', updated: true });
+`.trim();
+    }
+    /**
+     * Generate code for removing a connector
+     */
+    generateRemoveConnector(input) {
+        const validated = RemoveConnectorInputSchema.parse(input);
+        const { connectorId } = validated;
+        return `
+// Remove connector: ${connectorId}
+const connector = app.getItemById('${connectorId}');
+if (!connector) throw new Error('Connector not found: ${connectorId}');
+
+app.diagramManager.removeConnector(connector);
+app.historyManager.saveState();
+
+({ connectorId: '${connectorId}', removed: true });
+`.trim();
+    }
+    /**
+     * Generate code for diagram mode control
+     */
+    generateDiagramMode(input) {
+        const validated = DiagramModeInputSchema.parse(input);
+        const { action, mode, shapeType } = validated;
+        switch (action) {
+            case 'activate':
+                return `
+// Activate diagram mode
+app.diagramManager.activate();
+({ action: 'activate', active: true });
+`.trim();
+            case 'deactivate':
+                return `
+// Deactivate diagram mode
+app.diagramManager.deactivate();
+({ action: 'deactivate', active: false });
+`.trim();
+            case 'toggle':
+                return `
+// Toggle diagram mode
+const isActive = app.diagramManager.toggle();
+({ action: 'toggle', active: isActive });
+`.trim();
+            case 'setMode':
+                const modeStr = mode ? `'${mode}'` : "'select'";
+                const shapeStr = shapeType ? `, '${shapeType}'` : '';
+                return `
+// Set diagram tool mode
+app.diagramManager.setMode(${modeStr}${shapeStr});
+({ action: 'setMode', mode: ${modeStr}${shapeType ? `, shapeType: '${shapeType}'` : ''} });
+`.trim();
+            default:
+                return `
+// Unknown diagram mode action
+throw new Error('Unknown diagram mode action: ${action}');
+`.trim();
+        }
+    }
+    // ===========================================================================
+    // AGENT FLOW MODE CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code for starting an agent job
+     */
+    generateAgentStartJob(input) {
+        const validated = AgentStartJobInputSchema.parse(input);
+        const { name, screenshotPolicy, canvasPreset, clearCanvas } = validated;
+        const nameStr = name ? `'${name.replace(/'/g, "\\'")}'` : 'null';
+        const policyStr = screenshotPolicy || 'on_complete';
+        const shouldClear = clearCanvas !== false;
+        let code = `
+// Start agent job
+(async function() {
+  const jobOptions = {
+    name: ${nameStr},
+    screenshotPolicy: '${policyStr}',
+    agentMode: true
+  };
+`;
+        if (shouldClear) {
+            code += `
+  // Clear canvas
+  if (app.clearCanvas) {
+    app.clearCanvas();
+  } else {
+    if (app.textItemGroup) app.textItemGroup.removeChildren();
+    if (app.patternGroup) app.patternGroup.removeChildren();
+    if (app.itemRegistry) app.itemRegistry.clear();
+    if (app.relationRegistry) app.relationRegistry.clear();
+  }
+`;
+        }
+        if (canvasPreset) {
+            code += `
+  // Set canvas size to preset
+  app.setCanvasSize('${canvasPreset}');
+  // Allow canvas resize to take effect
+  await new Promise(r => setTimeout(r, 50));
+`;
+        }
+        code += `
+  // Return job context with canvas size
+  const _cs = app.getCanvasSize ? app.getCanvasSize() : { width: 800, height: 600 };
+  return {
+    success: true,
+    jobStarted: true,
+    name: ${nameStr},
+    screenshotPolicy: '${policyStr}',
+    canvasPreset: ${canvasPreset ? `'${canvasPreset}'` : 'null'},
+    canvasCleared: ${shouldClear},
+    canvasSize: { width: _cs.width || 800, height: _cs.height || 600 }
+  };
+})();
+`;
+        return code.trim();
+    }
+    /**
+     * Generate code for ending an agent job
+     */
+    generateAgentEndJob(input) {
+        const validated = AgentEndJobInputSchema.parse(input);
+        const { takeScreenshot, analyzeContent } = validated;
+        const shouldAnalyze = analyzeContent !== false;
+        let code = `
+// End agent job
+(async function() {
+  const result = {
+    success: true,
+    jobEnded: true
+  };
+`;
+        if (shouldAnalyze) {
+            code += `
+  // Analyze content
+  const analysis = {
+    hasAnimations: false,
+    animationTypes: [],
+    colorComplexity: 'simple',
+    itemCount: 0,
+    canvasSize: { width: 0, height: 0 },
+    hasRelations: false,
+    relationTypes: [],
+    hasGradients: false,
+    hasShadows: false,
+    hasText: false,
+    hasImages: false,
+  };
+
+  // Get canvas size
+  if (app.canvasEl) {
+    analysis.canvasSize = { width: app.canvasEl.width, height: app.canvasEl.height };
+  } else if (paper.view) {
+    analysis.canvasSize = { width: paper.view.size.width, height: paper.view.size.height };
+  }
+
+  // Count items and analyze
+  const items = app.itemRegistry ? app.itemRegistry.getAll() : [];
+  analysis.itemCount = items.length;
+
+  const animationSet = new Set();
+  const relationSet = new Set();
+
+  items.forEach(entry => {
+    const item = entry.item;
+    const data = item.data || {};
+
+    if (entry.type === 'text' || item.className === 'PointText') analysis.hasText = true;
+    if (item.className === 'Raster') analysis.hasImages = true;
+    if (data.animationType) {
+      analysis.hasAnimations = true;
+      animationSet.add(data.animationType);
+    }
+    // Detect keyframe animations (added via app.addAnimation with keyframes array)
+    if (data.keyframes || data.animation || data.keyframeAnimation) {
+      analysis.hasAnimations = true;
+      animationSet.add('keyframe');
+    }
+    if (item.fillColor && item.fillColor.gradient) analysis.hasGradients = true;
+    if (item.shadowColor || item.shadowBlur) analysis.hasShadows = true;
+  });
+
+  // Check animation manager for registered animations
+  if (app.animationManager) {
+    const animations = app.animationManager.getAll ? app.animationManager.getAll() : (app.animationManager.animations || []);
+    if (animations.length > 0) {
+      analysis.hasAnimations = true;
+      animationSet.add('managed');
+    }
+  }
+  // Check timeline for active animations
+  if (app.timeline && (app.timeline.isPlaying || app.timeline.animations?.length > 0)) {
+    analysis.hasAnimations = true;
+    animationSet.add('timeline');
+  }
+
+  analysis.animationTypes = Array.from(animationSet);
+
+  // Check relations
+  if (app.relationRegistry) {
+    const relations = app.relationRegistry.getAll ? app.relationRegistry.getAll() : [];
+    analysis.hasRelations = relations.length > 0;
+    relations.forEach(rel => {
+      if (rel.relationType) relationSet.add(rel.relationType);
+    });
+    analysis.relationTypes = Array.from(relationSet);
+    if (analysis.hasRelations) analysis.hasAnimations = true;
+  }
+
+  // Determine color complexity
+  if (analysis.hasGradients) {
+    analysis.colorComplexity = 'gradient';
+  } else if (analysis.itemCount > 20 || analysis.hasShadows) {
+    analysis.colorComplexity = 'complex';
+  }
+
+  result.analysis = analysis;
+
+  // Generate recommendations
+  const recommendations = [];
+  if (analysis.hasAnimations) {
+    if (analysis.hasGradients || analysis.colorComplexity === 'complex') {
+      recommendations.push({ platform: 'web', format: 'webm', confidence: 0.9, reason: 'Animated content with gradients' });
+      recommendations.push({ platform: 'instagram', format: 'mp4', confidence: 0.85, reason: 'Social media video' });
+    } else {
+      recommendations.push({ platform: 'web', format: 'svg', confidence: 0.95, reason: 'Simple animations as SVG' });
+      recommendations.push({ platform: 'twitter', format: 'gif', confidence: 0.8, reason: 'Social media GIF' });
+    }
+  } else {
+    if (analysis.colorComplexity === 'simple' && !analysis.hasImages) {
+      recommendations.push({ platform: 'web', format: 'svg', confidence: 0.95, reason: 'Vector graphics' });
+    } else {
+      recommendations.push({ platform: 'instagram', format: 'png', confidence: 0.9, reason: 'High quality static' });
+    }
+  }
+  result.recommendations = recommendations;
+`;
+        }
+        if (takeScreenshot) {
+            code += `
+  // Capture screenshot
+  const canvas = document.querySelector('canvas');
+  if (canvas) {
+    result.screenshot = canvas.toDataURL('image/png');
+  }
+`;
+        }
+        code += `
+  return result;
+})();
+`;
+        return code.trim();
+    }
+    /**
+     * Generate code for fast canvas reset
+     */
+    generateAgentReset(input) {
+        const validated = AgentResetInputSchema.parse(input);
+        const { canvasPreset, backgroundColor, preserveBackground } = validated;
+        let code = `
+// Fast canvas reset
+(async function() {
+`;
+        if (!preserveBackground) {
+            code += `
+  // Clear canvas completely
+  if (app.clearCanvas) {
+    app.clearCanvas();
+  } else {
+    if (app.textItemGroup) app.textItemGroup.removeChildren();
+    if (app.patternGroup) app.patternGroup.removeChildren();
+    if (app.itemRegistry) app.itemRegistry.clear();
+    if (app.relationRegistry) app.relationRegistry.clear();
+  }
+`;
+        }
+        else {
+            code += `
+  // Clear items but preserve background
+  if (app.textItemGroup) app.textItemGroup.removeChildren();
+  if (app.itemRegistry) app.itemRegistry.clear();
+  if (app.relationRegistry) app.relationRegistry.clear();
+`;
+        }
+        if (canvasPreset) {
+            code += `
+  // Set canvas to preset
+  app.setCanvasSize('${canvasPreset}');
+  // Allow canvas resize to take effect
+  await new Promise(r => setTimeout(r, 50));
+`;
+        }
+        if (backgroundColor && !preserveBackground) {
+            code += `
+  // Set background color
+  app.setBackgroundColor('${backgroundColor}');
+`;
+        }
+        code += `
+  // Save state
+  if (app.historyManager) app.historyManager.saveState();
+  const _cs = app.getCanvasSize ? app.getCanvasSize() : { width: 800, height: 600 };
+  return { success: true, reset: true, canvasPreset: ${canvasPreset ? `'${canvasPreset}'` : 'null'}, canvasSize: { width: _cs.width || 800, height: _cs.height || 600 } };
+})();
+`;
+        return code.trim();
+    }
+    /**
+     * Generate code for batch execute
+     */
+    generateAgentBatchExecute(input) {
+        const validated = AgentBatchExecuteInputSchema.parse(input);
+        const { operations, atomic } = validated;
+        const isAtomic = atomic !== false;
+        let code = `
+// Batch execute ${operations.length} operations
+(async function() {
+  const results = [];
+  const itemIds = [];
+  let success = true;
+
+  try {
+`;
+        operations.forEach((op, index) => {
+            const opCode = this.generateBatchOperationCode(op, index);
+            code += `
+    // Operation ${index}: ${op.type}
+    try {
+      const result${index} = await (async () => {
+        ${opCode}
+      })();
+      results.push({ index: ${index}, success: true, result: result${index} });
+      if (result${index} && result${index}.itemId) {
+        itemIds.push(result${index}.itemId);
+      }
+    } catch (opError) {
+      results.push({ index: ${index}, success: false, error: opError.message });
+      ${isAtomic ? 'throw opError;' : 'success = false;'}
+    }
+`;
+        });
+        code += `
+    // Save state
+    if (app.historyManager) app.historyManager.saveState();
+
+    const _cs = app.getCanvasSize ? app.getCanvasSize() : { width: 800, height: 600 };
+    return { success, itemIds, results, operationCount: ${operations.length}, canvasSize: { width: _cs.width || 800, height: _cs.height || 600 } };
+  } catch (e) {
+    const _cs = app.getCanvasSize ? app.getCanvasSize() : { width: 800, height: 600 };
+    return { success: false, error: e.message, itemIds, results, operationCount: ${operations.length}, canvasSize: { width: _cs.width || 800, height: _cs.height || 600 } };
+  }
+})();
+`;
+        return code.trim();
+    }
+    /**
+     * Generate code for a single batch operation
+     */
+    generateBatchOperationCode(op, index) {
+        switch (op.type) {
+            case 'create':
+                const pos = op.position || { x: 400, y: 300 };
+                const props = JSON.stringify(op.properties || {});
+                return `
+const item = app.create('${op.itemType}', { position: { x: ${pos.x}, y: ${pos.y} }, ...${props} });
+const itemId = item.data && item.data.id ? item.data.id : app.registerItem(item, '${op.itemType}', { source: 'mcp-batch' });
+// Ensure item is visible above backgrounds/generators
+if (item.bringToFront) item.bringToFront();
+return { itemId };
+`;
+            case 'modify':
+                const itemRef = op.itemId?.startsWith('$')
+                    ? `itemIds[${op.itemId.substring(1)}]`
+                    : `'${op.itemId}'`;
+                const modifyProps = JSON.stringify(op.properties || {});
+                return `
+const targetId = ${itemRef};
+app.select(targetId);
+app.modify(${modifyProps});
+return { itemId: targetId, modified: true };
+`;
+            case 'animate':
+                const animItemRef = op.itemId?.startsWith('$')
+                    ? `itemIds[${op.itemId.substring(1)}]`
+                    : `'${op.itemId}'`;
+                const animOpts = JSON.stringify(op.animationOptions || {});
+                return `
+const targetId = ${animItemRef};
+const item = app.getItemById(targetId);
+if (!item) throw new Error('Item not found: ' + targetId);
+app.animate(item, { animationType: '${op.animationType}', ...${animOpts} });
+return { itemId: targetId, animationType: '${op.animationType}' };
+`;
+            case 'relation':
+                const srcRef = op.sourceId?.startsWith('$')
+                    ? `itemIds[${op.sourceId.substring(1)}]`
+                    : `'${op.sourceId}'`;
+                const tgtRef = op.targetId?.startsWith('$')
+                    ? `itemIds[${op.targetId.substring(1)}]`
+                    : `'${op.targetId}'`;
+                const relOpts = JSON.stringify(op.relationOptions || {});
+                return `
+const sourceId = ${srcRef};
+const targetId = ${tgtRef};
+const source = app.getItemById(sourceId);
+const target = app.getItemById(targetId);
+if (!source) throw new Error('Source not found: ' + sourceId);
+if (!target) throw new Error('Target not found: ' + targetId);
+const relationId = app.addRelation(source, target, '${op.relationType}', ${relOpts});
+return { relationId, sourceId, targetId, relationType: '${op.relationType}' };
+`;
+            case 'delete':
+                const delRef = op.itemId?.startsWith('$')
+                    ? `itemIds[${op.itemId.substring(1)}]`
+                    : `'${op.itemId}'`;
+                return `
+const targetId = ${delRef};
+const item = app.getItemById(targetId);
+if (!item) throw new Error('Item not found: ' + targetId);
+item.remove();
+if (app.itemRegistry) app.itemRegistry.unregister(targetId);
+return { itemId: targetId, deleted: true };
+`;
+            case 'set_background':
+                const bgColor = op.backgroundColor || op.properties?.color || '#000000';
+                return `
+app.setBackgroundColor('${bgColor}');
+return { success: true, backgroundColor: '${bgColor}' };
+`;
+            case 'execute_generator':
+                const genName = op.generatorName || 'drawSunburst';
+                const genParams = JSON.stringify(op.generatorParams || {});
+                return `
+await app.executeGenerator('${genName}', ${genParams});
+return { success: true, generator: '${genName}' };
+`;
+            case 'set_canvas_size': {
+                const w = op.width || 1080;
+                const h = op.height || 1080;
+                const sizeArg = op.preset ? `'${op.preset}'` : `{ width: ${w}, height: ${h} }`;
+                return `
+app.setCanvasSize(${sizeArg});
+await new Promise(r => setTimeout(r, 50));
+return { success: true, width: ${w}, height: ${h} };
+`;
+            }
+            case 'keyframe_animate': {
+                const kfItemRef = op.itemId?.startsWith('$')
+                    ? `itemIds[${op.itemId.substring(1)}]`
+                    : `'${op.itemId}'`;
+                const kfJson = JSON.stringify(op.keyframes || []);
+                const kfDuration = op.duration || (op.keyframes?.length ? Math.max(...op.keyframes.map(k => k.time)) : 5);
+                const kfLoop = op.loop ?? false;
+                return `
+const targetId = ${kfItemRef};
+app.addAnimation(targetId, ${kfJson}, { duration: ${kfDuration}, loop: ${kfLoop} });
+return { itemId: targetId, duration: ${kfDuration}, loop: ${kfLoop} };
+`;
+            }
+            case 'apply_mask': {
+                const maskItemRef = op.itemId?.startsWith('$')
+                    ? `itemIds[${op.itemId.substring(1)}]`
+                    : `'${op.itemId}'`;
+                const maskOpts = JSON.stringify(op.maskOptions || {});
+                return `
+const targetId = ${maskItemRef};
+if (!app.maskSystem) throw new Error('Mask system not available');
+const result = app.maskSystem.applyAnimatedMask(targetId, {
+  preset: ${op.maskPreset ? `'${op.maskPreset}'` : 'null'},
+  maskType: ${op.maskType ? `'${op.maskType}'` : 'null'},
+  options: ${maskOpts},
+  maskOptions: ${maskOpts}
+});
+return result;
+`;
+            }
+            case 'apply_effect': {
+                const effItemRef = op.itemId?.startsWith('$')
+                    ? `itemIds[${op.itemId.substring(1)}]`
+                    : `'${op.itemId}'`;
+                const effParams = JSON.stringify(op.effectParams || {});
+                return `
+const targetId = ${effItemRef};
+const item = app.getItemById(targetId);
+if (!item) throw new Error('Item not found: ' + targetId);
+app.applyEffect(item, '${op.effectType || 'sparkle'}', ${effParams});
+return { itemId: targetId, effectType: '${op.effectType || 'sparkle'}' };
+`;
+            }
+            case 'play_timeline': {
+                const ptAction = op.action || 'play';
+                const ptDuration = op.duration || 5;
+                const ptLoop = op.loop ?? false;
+                if (ptAction === 'play') {
+                    return `
+app.playKeyframeTimeline(${ptDuration}, ${ptLoop});
+return { success: true, action: 'play', duration: ${ptDuration}, loop: ${ptLoop} };
+`;
+                }
+                else if (ptAction === 'stop') {
+                    return `
+app.stopKeyframeTimeline();
+return { success: true, action: 'stop' };
+`;
+                }
+                else {
+                    return `
+app.setPlaybackTime(${op.time || 0});
+return { success: true, action: 'seek', time: ${op.time || 0} };
+`;
+                }
+            }
+            default:
+                return `throw new Error('Unknown operation type: ${op.type}');`;
+        }
+    }
+    /**
+     * Generate code for smart export
+     */
+    generateAgentExport(input) {
+        const validated = AgentExportInputSchema.parse(input);
+        const { platform, format, quality } = validated;
+        const qualityLevel = quality || 'standard';
+        // Quality settings
+        const qualitySettings = {
+            draft: { compression: 0.6, fps: 15, dpi: 72 },
+            standard: { compression: 0.85, fps: 30, dpi: 150 },
+            high: { compression: 0.95, fps: 60, dpi: 300 },
+        }[qualityLevel];
+        // Platform presets
+        const platformPresets = {
+            'instagram': { width: 1080, height: 1080, staticFormat: 'png', animatedFormat: 'mp4' },
+            'instagram-story': { width: 1080, height: 1920, staticFormat: 'png', animatedFormat: 'mp4' },
+            'tiktok': { width: 1080, height: 1920, staticFormat: 'png', animatedFormat: 'mp4' },
+            'youtube': { width: 1920, height: 1080, staticFormat: 'png', animatedFormat: 'mp4' },
+            'youtube-thumbnail': { width: 1280, height: 720, staticFormat: 'png', animatedFormat: 'png' },
+            'twitter': { width: 1200, height: 675, staticFormat: 'png', animatedFormat: 'gif' },
+            'linkedin': { width: 1200, height: 627, staticFormat: 'png', animatedFormat: 'gif' },
+            'web': { width: 800, height: 600, staticFormat: 'svg', animatedFormat: 'svg' },
+            'print-a4': { width: 2480, height: 3508, staticFormat: 'pdf', animatedFormat: 'pdf' },
+            'print-letter': { width: 2550, height: 3300, staticFormat: 'pdf', animatedFormat: 'pdf' },
+        };
+        const preset = platformPresets[platform] || platformPresets['web'];
+        // Resolve "auto" format to the platform's recommended format
+        const exportFormat = (!format || format === 'auto') ? preset.staticFormat : format;
+        return `
+// Smart export for ${platform}
+(async function() {
+  const platform = '${platform}';
+  const format = '${exportFormat}';
+  const quality = '${qualityLevel}';
+  const settings = ${JSON.stringify(qualitySettings)};
+  const dimensions = ${JSON.stringify({ width: preset.width, height: preset.height })};
+
+  let result = { success: false, platform, format, quality };
+
+  try {
+    switch (format) {
+      case 'svg':
+        const svgString = app.exportAnimatedSVG ? app.exportAnimatedSVG() : app.exportSVG();
+        result = {
+          success: true,
+          platform,
+          format: 'svg',
+          data: svgString,
+          mimeType: 'image/svg+xml',
+          size: new Blob([svgString]).size,
+          hasAnimations: svgString.includes('<animate') || svgString.includes('@keyframes')
+        };
+        break;
+
+      case 'png':
+        if (app.exportEngine && app.exportEngine.exportPNG) {
+          const dataUrl = await app.exportEngine.exportPNG({ dpi: settings.dpi });
+          result = {
+            success: true,
+            platform,
+            format: 'png',
+            data: dataUrl,
+            mimeType: 'image/png',
+            size: Math.round(dataUrl.length * 0.75)
+          };
+        } else {
+          const canvas = document.querySelector('canvas');
+          if (canvas) {
+            const dataUrl = canvas.toDataURL('image/png');
+            result = {
+              success: true,
+              platform,
+              format: 'png',
+              data: dataUrl,
+              mimeType: 'image/png',
+              size: Math.round(dataUrl.length * 0.75)
+            };
+          }
+        }
+        break;
+
+      case 'gif':
+        if (app.exportEngine && app.exportEngine.exportGIF) {
+          const blob = await app.exportEngine.exportGIF({ fps: settings.fps, quality: settings.compression, duration: 5 });
+          const reader = new FileReader();
+          const dataUrl = await new Promise(resolve => {
+            reader.onloadend = () => resolve(reader.result);
+            reader.readAsDataURL(blob);
+          });
+          result = { success: true, platform, format: 'gif', data: dataUrl, mimeType: 'image/gif', size: blob.size };
+        } else {
+          result = { success: false, error: 'GIF export not available' };
+        }
+        break;
+
+      case 'mp4':
+      case 'webm':
+        const exportMethod = format === 'mp4' ? 'exportMP4' : 'exportWebM';
+        const mimeType = format === 'mp4' ? 'video/mp4' : 'video/webm';
+        if (app.exportEngine && app.exportEngine[exportMethod]) {
+          const blob = await app.exportEngine[exportMethod]({ fps: settings.fps, duration: 5, ...dimensions });
+          const reader = new FileReader();
+          const dataUrl = await new Promise(resolve => {
+            reader.onloadend = () => resolve(reader.result);
+            reader.readAsDataURL(blob);
+          });
+          result = { success: true, platform, format, data: dataUrl, mimeType, size: blob.size };
+        } else {
+          result = { success: false, error: format.toUpperCase() + ' export not available' };
+        }
+        break;
+
+      case 'pdf':
+        if (app.exportEngine && app.exportEngine.exportPDF) {
+          const blob = await app.exportEngine.exportPDF({ dpi: settings.dpi });
+          const reader = new FileReader();
+          const dataUrl = await new Promise(resolve => {
+            reader.onloadend = () => resolve(reader.result);
+            reader.readAsDataURL(blob);
+          });
+          result = { success: true, platform, format: 'pdf', data: dataUrl, mimeType: 'application/pdf', size: blob.size, dpi: settings.dpi };
+        } else {
+          result = { success: false, error: 'PDF export not available' };
+        }
+        break;
+
+      default:
+        result = { success: false, error: 'Unknown format: ' + format };
+    }
+  } catch (e) {
+    result = { success: false, error: e.message, platform, format };
+  }
+
+  return result;
+})();
+`.trim();
+    }
+    /**
+     * Generate code for content analysis
+     */
+    generateAgentAnalyze(input) {
+        AgentAnalyzeInputSchema.parse(input);
+        return `
+// Analyze canvas content
+(function() {
+  const analysis = {
+    hasAnimations: false,
+    animationTypes: [],
+    colorComplexity: 'simple',
+    itemCount: 0,
+    canvasSize: { width: 0, height: 0 },
+    hasRelations: false,
+    relationTypes: [],
+    hasGradients: false,
+    hasShadows: false,
+    hasText: false,
+    hasImages: false,
+  };
+
+  // Get canvas size
+  if (app.canvasEl) {
+    analysis.canvasSize = { width: app.canvasEl.width, height: app.canvasEl.height };
+  } else if (paper.view) {
+    analysis.canvasSize = { width: paper.view.size.width, height: paper.view.size.height };
+  }
+
+  // Count items and analyze types
+  const items = app.itemRegistry ? app.itemRegistry.getAll() : [];
+  analysis.itemCount = items.length;
+
+  const animationSet = new Set();
+  const relationSet = new Set();
+  let hasGradient = false;
+  let hasShadow = false;
+
+  items.forEach(entry => {
+    const item = entry.item;
+    const data = item.data || {};
+
+    if (entry.type === 'text' || item.className === 'PointText') analysis.hasText = true;
+    if (item.className === 'Raster') analysis.hasImages = true;
+
+    if (data.animationType) {
+      analysis.hasAnimations = true;
+      animationSet.add(data.animationType);
+    }
+    // Detect keyframe animations (added via app.addAnimation with keyframes array)
+    if (data.keyframes || data.animation || data.keyframeAnimation) {
+      analysis.hasAnimations = true;
+      animationSet.add('keyframe');
+    }
+
+    if (item.fillColor && item.fillColor.gradient) hasGradient = true;
+    if (item.strokeColor && item.strokeColor.gradient) hasGradient = true;
+    if (item.shadowColor || item.shadowBlur) hasShadow = true;
+  });
+
+  // Check animation manager for registered animations
+  if (app.animationManager) {
+    const animations = app.animationManager.getAll ? app.animationManager.getAll() : (app.animationManager.animations || []);
+    if (animations.length > 0) {
+      analysis.hasAnimations = true;
+      animationSet.add('managed');
+    }
+  }
+  // Check timeline for active animations
+  if (app.timeline && (app.timeline.isPlaying || app.timeline.animations?.length > 0)) {
+    analysis.hasAnimations = true;
+    animationSet.add('timeline');
+  }
+
+  analysis.animationTypes = Array.from(animationSet);
+  analysis.hasGradients = hasGradient;
+  analysis.hasShadows = hasShadow;
+
+  // Check relations
+  if (app.relationRegistry) {
+    const relations = app.relationRegistry.getAll ? app.relationRegistry.getAll() : [];
+    analysis.hasRelations = relations.length > 0;
+    relations.forEach(rel => {
+      if (rel.relationType) relationSet.add(rel.relationType);
+    });
+    analysis.relationTypes = Array.from(relationSet);
+    if (analysis.hasRelations) analysis.hasAnimations = true;
+  }
+
+  // Determine color complexity
+  if (hasGradient) {
+    analysis.colorComplexity = 'gradient';
+  } else if (analysis.itemCount > 20 || hasShadow) {
+    analysis.colorComplexity = 'complex';
+  }
+
+  // Generate recommendations
+  const recommendations = [];
+  const { width, height } = analysis.canvasSize;
+  const aspectRatio = width / height;
+
+  if (analysis.hasAnimations) {
+    if (analysis.hasGradients || analysis.colorComplexity === 'complex') {
+      recommendations.push({ platform: 'web', format: 'webm', confidence: 0.9, reason: 'Animated content with gradients renders best as WebM' });
+      recommendations.push({ platform: 'instagram', format: 'mp4', confidence: 0.85, reason: 'MP4 for social media compatibility' });
+    } else {
+      recommendations.push({ platform: 'web', format: 'svg', confidence: 0.95, reason: 'Simple animations export well as animated SVG' });
+      recommendations.push({ platform: 'twitter', format: 'gif', confidence: 0.8, reason: 'GIF for social media', warnings: ['Limited to 256 colors'] });
+    }
+  } else {
+    if (analysis.colorComplexity === 'simple' && !analysis.hasImages) {
+      recommendations.push({ platform: 'web', format: 'svg', confidence: 0.95, reason: 'Vector graphics best as SVG for scalability' });
+    } else {
+      recommendations.push({ platform: 'instagram', format: 'png', confidence: 0.9, reason: 'High quality static export as PNG' });
+    }
+  }
+
+  // Platform suggestions based on aspect ratio
+  const suggestedPlatforms = [];
+  if (Math.abs(aspectRatio - 1) < 0.1) suggestedPlatforms.push('instagram');
+  if (aspectRatio < 0.7) suggestedPlatforms.push('instagram-story', 'tiktok');
+  if (aspectRatio > 1.5) suggestedPlatforms.push('youtube', 'twitter', 'linkedin');
+  suggestedPlatforms.push('web');
+
+  return {
+    success: true,
+    analysis,
+    recommendations,
+    suggestedPlatforms
+  };
+})();
+`.trim();
+    }
+    // ===========================================================================
+    // INTERACTIVE TRIGGER CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code for adding a trigger
+     */
+    generateAddTrigger(input) {
+        const validated = AddTriggerInputSchema.parse(input);
+        const { itemId, event, actions, condition, timelineOffset } = validated;
+        const actionsStr = JSON.stringify(actions);
+        const conditionStr = condition ? `'${condition.replace(/'/g, "\\'")}'` : 'null';
+        const offsetStr = timelineOffset !== undefined ? timelineOffset : 'null';
+        return `
+// Add trigger to ${itemId}
+const item = app.getItemById('${itemId}');
+if (!item) throw new Error('Item not found: ${itemId}');
+
+const trigger = {
+  event: '${event}',
+  actions: ${actionsStr},
+  condition: ${conditionStr},
+  timelineOffset: ${offsetStr}
+};
+
+// Initialize triggers array if needed
+if (!item.data) item.data = {};
+if (!item.data.triggers) item.data.triggers = [];
+
+// Add trigger
+item.data.triggers.push(trigger);
+
+// Register event handler
+if (app.triggerManager) {
+  app.triggerManager.registerTrigger(item, trigger);
+}
+
+app.historyManager.saveState();
+({ success: true, itemId: '${itemId}', event: '${event}', triggerId: item.data.triggers.length - 1 });
+`.trim();
+    }
+    /**
+     * Generate code for removing a trigger
+     */
+    generateRemoveTrigger(input) {
+        const validated = RemoveTriggerInputSchema.parse(input);
+        const { itemId, event, removeAll } = validated;
+        if (removeAll) {
+            return `
+// Remove all triggers from ${itemId}
+const item = app.getItemById('${itemId}');
+if (!item) throw new Error('Item not found: ${itemId}');
+
+const removedCount = item.data?.triggers?.length || 0;
+if (item.data) item.data.triggers = [];
+
+if (app.triggerManager) {
+  app.triggerManager.unregisterAll(item);
+}
+
+app.historyManager.saveState();
+({ success: true, itemId: '${itemId}', removedCount, removeAll: true });
+`.trim();
+        }
+        return `
+// Remove ${event} trigger from ${itemId}
+const item = app.getItemById('${itemId}');
+if (!item) throw new Error('Item not found: ${itemId}');
+
+let removedCount = 0;
+if (item.data?.triggers) {
+  const before = item.data.triggers.length;
+  item.data.triggers = item.data.triggers.filter(t => t.event !== '${event}');
+  removedCount = before - item.data.triggers.length;
+}
+
+if (app.triggerManager) {
+  app.triggerManager.unregisterEvent(item, '${event}');
+}
+
+app.historyManager.saveState();
+({ success: true, itemId: '${itemId}', event: '${event}', removedCount });
+`.trim();
+    }
+    /**
+     * Generate code for querying triggers
+     */
+    generateQueryTriggers(input) {
+        const validated = QueryTriggersInputSchema.parse(input);
+        const { itemId, event } = validated;
+        if (itemId) {
+            return `
+// Query triggers for ${itemId}
+const item = app.getItemById('${itemId}');
+if (!item) throw new Error('Item not found: ${itemId}');
+
+let triggers = item.data?.triggers || [];
+${event ? `triggers = triggers.filter(t => t.event === '${event}');` : ''}
+
+({ success: true, itemId: '${itemId}', triggers, count: triggers.length });
+`.trim();
+        }
+        return `
+// Query all triggers
+const allTriggers = [];
+const items = app.itemRegistry ? app.itemRegistry.getAll() : [];
+
+items.forEach(entry => {
+  const item = entry.item;
+  if (item.data?.triggers?.length > 0) {
+    let triggers = item.data.triggers;
+    ${event ? `triggers = triggers.filter(t => t.event === '${event}');` : ''}
+    triggers.forEach((trigger, idx) => {
+      allTriggers.push({
+        itemId: entry.id,
+        triggerId: idx,
+        ...trigger
+      });
+    });
+  }
+});
+
+({ success: true, triggers: allTriggers, count: allTriggers.length${event ? `, event: '${event}'` : ''} });
+`.trim();
+    }
+    // ===========================================================================
+    // QUIZ CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code for creating a quiz
+     */
+    generateCreateQuiz(input) {
+        const validated = CreateQuizInputSchema.parse(input);
+        const { title, questions, passingScore, showScore, allowRetry, shuffleQuestions, shuffleOptions } = validated;
+        const quizConfig = JSON.stringify({
+            title: title || 'Untitled Quiz',
+            questions,
+            passingScore: passingScore || 70,
+            showScore: showScore !== false,
+            allowRetry: allowRetry !== false,
+            shuffleQuestions: shuffleQuestions || false,
+            shuffleOptions: shuffleOptions || false,
+        }, null, 2);
+        return `
+// Create quiz
+const quizConfig = ${quizConfig};
+
+// Initialize quiz manager if needed
+if (!app.quizManager) {
+  app.quizManager = {
+    quizzes: [],
+    activeQuiz: null,
+    createQuiz: function(config) {
+      const quiz = {
+        id: 'quiz_' + Date.now(),
+        ...config,
+        state: {
+          currentQuestion: 0,
+          answers: [],
+          score: 0,
+          maxScore: config.questions.reduce((sum, q) => sum + q.points, 0),
+          complete: false
+        }
+      };
+      this.quizzes.push(quiz);
+      this.activeQuiz = quiz;
+      return quiz;
+    }
+  };
+}
+
+const quiz = app.quizManager.createQuiz(quizConfig);
+app.historyManager.saveState();
+
+({
+  success: true,
+  quizId: quiz.id,
+  title: quiz.title,
+  questionCount: quiz.questions.length,
+  maxScore: quiz.state.maxScore,
+  passingScore: quiz.passingScore
+});
+`.trim();
+    }
+    /**
+     * Generate code for getting quiz state
+     */
+    generateGetQuizState(input) {
+        const validated = GetQuizStateInputSchema.parse(input);
+        const { quizId } = validated;
+        const quizRef = quizId
+            ? `app.quizManager.quizzes.find(q => q.id === '${quizId}')`
+            : 'app.quizManager?.activeQuiz';
+        return `
+// Get quiz state
+if (!app.quizManager) {
+  return { success: false, error: 'No quiz manager initialized' };
+}
+
+const quiz = ${quizRef};
+if (!quiz) {
+  return { success: false, error: 'Quiz not found' };
+}
+
+({
+  success: true,
+  quizId: quiz.id,
+  title: quiz.title,
+  currentQuestion: quiz.state.currentQuestion,
+  totalQuestions: quiz.questions.length,
+  score: quiz.state.score,
+  maxScore: quiz.state.maxScore,
+  answers: quiz.state.answers,
+  complete: quiz.state.complete,
+  passed: quiz.state.complete ? (quiz.state.score / quiz.state.maxScore * 100) >= quiz.passingScore : null
+});
+`.trim();
+    }
+    /**
+     * Generate code for resetting a quiz
+     */
+    generateResetQuiz(input) {
+        const validated = ResetQuizInputSchema.parse(input);
+        const { quizId } = validated;
+        const quizRef = quizId
+            ? `app.quizManager.quizzes.find(q => q.id === '${quizId}')`
+            : 'app.quizManager?.activeQuiz';
+        return `
+// Reset quiz
+if (!app.quizManager) {
+  return { success: false, error: 'No quiz manager initialized' };
+}
+
+const quiz = ${quizRef};
+if (!quiz) {
+  return { success: false, error: 'Quiz not found' };
+}
+
+// Reset state
+quiz.state = {
+  currentQuestion: 0,
+  answers: [],
+  score: 0,
+  maxScore: quiz.questions.reduce((sum, q) => sum + q.points, 0),
+  complete: false
+};
+
+app.historyManager.saveState();
+
+({ success: true, quizId: quiz.id, reset: true });
+`.trim();
+    }
+    // ===========================================================================
+    // WIDGET EXPORT CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code for exporting widget
+     */
+    generateExportWidget(input) {
+        const validated = ExportWidgetInputSchema.parse(input);
+        const { format, sizing, interactivity, autoplay, loop, lmsEnabled, width, height } = validated;
+        const sizingMode = sizing || 'responsive';
+        const interactivityLevel = interactivity || 'view';
+        const shouldAutoplay = autoplay !== false;
+        const shouldLoop = loop !== false;
+        const hasLms = lmsEnabled || false;
+        return `
+// Export widget as ${format}
+(async function() {
+  const format = '${format}';
+  const sizing = '${sizingMode}';
+  const interactivity = '${interactivityLevel}';
+  const autoplay = ${shouldAutoplay};
+  const loop = ${shouldLoop};
+  const lmsEnabled = ${hasLms};
+  const fixedWidth = ${width || 'null'};
+  const fixedHeight = ${height || 'null'};
+
+  // Capture scene data
+  const sceneData = app.exportSceneData ? JSON.stringify(app.exportSceneData()) : '{}';
+
+  // Get canvas dimensions
+  let canvasWidth = fixedWidth || (app.canvasEl ? app.canvasEl.width : 800);
+  let canvasHeight = fixedHeight || (app.canvasEl ? app.canvasEl.height : 600);
+
+  // Check for animations
+  const items = app.itemRegistry ? app.itemRegistry.getAll() : [];
+  const hasAnimations = items.some(e => e.item.data?.animationType);
+  const hasRelations = app.relationRegistry && app.relationRegistry.getAll().length > 0;
+  const hasQuiz = app.quizManager && app.quizManager.quizzes.length > 0;
+  const hasTriggers = items.some(e => e.item.data?.triggers?.length > 0);
+
+  const metadata = {
+    hasInteractivity: hasTriggers || interactivity === 'full',
+    hasAnimations: hasAnimations || hasRelations,
+    hasQuiz,
+    width: canvasWidth,
+    height: canvasHeight,
+    sizing,
+    interactivity
+  };
+
+  let code = '';
+  let embedCode = '';
+
+  switch (format) {
+    case 'web-component':
+      code = \`<script src="https://cdn.pinepaper.io/widget.js"></script>
+<pinepaper-widget
+  data-scene='\${sceneData}'
+  data-sizing="\${sizing}"
+  data-interactivity="\${interactivity}"
+  data-autoplay="\${autoplay}"
+  data-loop="\${loop}"
+  \${fixedWidth ? 'width="' + canvasWidth + '"' : ''}
+  \${fixedHeight ? 'height="' + canvasHeight + '"' : ''}
+></pinepaper-widget>\`;
+      embedCode = code;
+      break;
+
+    case 'standalone-html':
+      code = \`<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>PinePaper Widget</title>
+  <script src="https://cdn.pinepaper.io/runtime.js"></script>
+  <style>
+    body { margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #f5f5f5; }
+    .pinepaper-container { \${sizing === 'responsive' ? 'width: 100%; max-width: ' + canvasWidth + 'px;' : sizing === 'fluid' ? 'width: 100%; height: 100%;' : 'width: ' + canvasWidth + 'px; height: ' + canvasHeight + 'px;'} }
+  </style>
+</head>
+<body>
+  <div class="pinepaper-container" id="pinepaper-widget"></div>
+  <script>
+    PinePaper.init('#pinepaper-widget', {
+      scene: \${sceneData},
+      autoplay: \${autoplay},
+      loop: \${loop},
+      interactivity: '\${interactivity}'\${hasLms ? ',\\n      lms: true' : ''}
+    });
+  </script>
+</body>
+</html>\`;
+      embedCode = \`<iframe src="[URL_TO_HOSTED_FILE]" width="\${canvasWidth}" height="\${canvasHeight}" frameborder="0"></iframe>\`;
+      break;
+
+    case 'iframe-embed':
+      const dataUri = 'data:text/html;base64,' + btoa(\`<!DOCTYPE html><html><head><script src="https://cdn.pinepaper.io/runtime.js"></script></head><body><div id="w"></div><script>PinePaper.init('#w',{scene:\${sceneData},autoplay:\${autoplay},loop:\${loop}});</script></body></html>\`);
+      code = dataUri;
+      embedCode = \`<iframe src="\${dataUri}" width="\${canvasWidth}" height="\${canvasHeight}" frameborder="0" allowfullscreen></iframe>\`;
+      break;
+
+    case 'react-component':
+      code = \`import { useEffect, useRef } from 'react';
+
+export function PinepaperWidget({ className }) {
+  const containerRef = useRef(null);
+
+  useEffect(() => {
+    if (containerRef.current && window.PinePaper) {
+      window.PinePaper.init(containerRef.current, {
+        scene: \${sceneData},
+        autoplay: \${autoplay},
+        loop: \${loop},
+        interactivity: '\${interactivity}'
+      });
+    }
+  }, []);
+
+  return <div ref={containerRef} className={className} style={{ width: '\${sizing === 'fixed' ? canvasWidth + 'px' : '100%'}', height: '\${sizing === 'fixed' ? canvasHeight + 'px' : 'auto'}' }} />;
+}
+
+// Usage: <PinepaperWidget className="my-widget" />\`;
+      embedCode = '<PinepaperWidget />';
+      break;
+
+    case 'vue-component':
+      code = \`<template>
+  <div ref="container" :class="className" :style="containerStyle"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, computed } from 'vue';
+
+const props = defineProps({ className: String });
+const container = ref(null);
+
+const containerStyle = computed(() => ({
+  width: '\${sizing === 'fixed' ? canvasWidth + 'px' : '100%'}',
+  height: '\${sizing === 'fixed' ? canvasHeight + 'px' : 'auto'}'
+}));
+
+onMounted(() => {
+  if (container.value && window.PinePaper) {
+    window.PinePaper.init(container.value, {
+      scene: \${sceneData},
+      autoplay: \${autoplay},
+      loop: \${loop},
+      interactivity: '\${interactivity}'
+    });
+  }
+});
+</script>
+
+<!-- Usage: <PinepaperWidget class="my-widget" /> -->\`;
+      embedCode = '<PinepaperWidget />';
+      break;
+  }
+
+  return {
+    success: true,
+    format,
+    code,
+    embedCode,
+    sceneData,
+    metadata
+  };
+})();
+`.trim();
+    }
+    // ===========================================================================
+    // LETTER COLLAGE CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code to create a letter collage
+     */
+    generateCreateLetterCollage(input) {
+        const validated = CreateLetterCollageInputSchema.parse(input);
+        const { text, style = 'tile', palette, position, fontSize = 48, fontFamily = 'Inter, sans-serif', spacing = 1.1, gradientPalette, gradientDirection = 'vertical', cornerRadius = 4, shadowEnabled = true, } = validated;
+        // Build options object
+        const options = {
+            style,
+            fontSize,
+            fontFamily,
+            spacing,
+            cornerRadius,
+            shadowEnabled,
+        };
+        if (palette)
+            options.palette = palette;
+        if (position)
+            options.position = position;
+        if (gradientPalette)
+            options.gradientPalette = gradientPalette;
+        if (gradientDirection)
+            options.gradientDirection = gradientDirection;
+        return `
+// Create letter collage: "${text}"
+(function() {
+  const text = ${JSON.stringify(text)};
+  const options = ${JSON.stringify(options, null, 2)};
+
+  if (!app.createLetterCollage) {
+    return { success: false, error: 'Letter collage feature not available' };
+  }
+
+  const result = app.createLetterCollage(text, options);
+
+  if (app.historyManager) {
+    app.historyManager.saveState('create_letter_collage');
+  }
+
+  return result;
+})();
+`.trim();
+    }
+    /**
+     * Generate code to animate a letter collage
+     */
+    generateAnimateLetterCollage(input) {
+        const validated = AnimateLetterCollageInputSchema.parse(input);
+        const { collageId, animationType, staggerDelay = 0.1, animationSpeed = 1, } = validated;
+        return `
+// Animate letter collage: ${collageId}
+(function() {
+  const collageId = ${JSON.stringify(collageId)};
+  const animationType = ${JSON.stringify(animationType)};
+  const staggerDelay = ${staggerDelay};
+  const animationSpeed = ${animationSpeed};
+
+  if (!app.animateLetterCollage) {
+    return { success: false, error: 'Letter collage animation not available' };
+  }
+
+  const result = app.animateLetterCollage(collageId, {
+    animationType,
+    staggerDelay,
+    animationSpeed
+  });
+
+  return result;
+})();
+`.trim();
+    }
+    /**
+     * Generate code to get letter collage options
+     */
+    generateGetLetterCollageOptions() {
+        return `
+// Get letter collage options
+(function() {
+  if (!app.getLetterCollageOptions) {
+    // Return static options if function not available
+    return {
+      success: true,
+      styles: ['tile', 'magazine', 'paperCut', 'fold', 'gradient', 'image'],
+      tilePalettes: {
+        game: ['wordle', 'scrabble'],
+        vibrant: ['candy', 'neon', 'rainbow'],
+        soft: ['pastel', 'cotton'],
+        natural: ['earth', 'ocean', 'forest', 'sunset'],
+        professional: ['corporate', 'minimal', 'slate'],
+        seasonal: ['christmas', 'halloween', 'spring'],
+        magazine: ['magazine', 'newspaper', 'vintage'],
+        paperCraft: ['paperCraft', 'origami', 'craftPaper']
+      },
+      gradientPalettes: ['rainbow', 'sunset', 'ocean', 'fire', 'gold', 'rose', 'ice', 'cyberpunk', 'neonGlow', 'purplePink'],
+      gradientDirections: ['vertical', 'horizontal', 'diagonal', 'radial']
+    };
+  }
+
+  return app.getLetterCollageOptions();
+})();
+`.trim();
+    }
+    // ===========================================================================
+    // CANVAS PRESETS CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code to get canvas presets
+     */
+    generateGetCanvasPresets() {
+        return `
+// Get canvas presets
+(function() {
+  if (app.getCanvasPresets) {
+    return app.getCanvasPresets();
+  }
+
+  // Return static presets if function not available
+  return {
+    success: true,
+    presets: [
+      { key: 'youtube-thumbnail', name: 'YouTube Thumbnail', width: 1280, height: 720, aspectRatio: '16:9', category: 'video' },
+      { key: 'youtube-short', name: 'YouTube Shorts', width: 1080, height: 1920, aspectRatio: '9:16', category: 'video' },
+      { key: 'tiktok', name: 'TikTok', width: 1080, height: 1920, aspectRatio: '9:16', category: 'video' },
+      { key: 'instagram-story', name: 'Instagram Story', width: 1080, height: 1920, aspectRatio: '9:16', category: 'social' },
+      { key: 'instagram-post', name: 'Instagram Post (Square)', width: 1080, height: 1080, aspectRatio: '1:1', category: 'social' },
+      { key: 'instagram-landscape', name: 'Instagram Landscape', width: 1080, height: 566, aspectRatio: '1.91:1', category: 'social' },
+      { key: 'instagram-portrait', name: 'Instagram Portrait', width: 1080, height: 1350, aspectRatio: '4:5', category: 'social' },
+      { key: 'facebook-post', name: 'Facebook Post', width: 1200, height: 630, aspectRatio: '1.91:1', category: 'social' },
+      { key: 'facebook-cover', name: 'Facebook Cover', width: 820, height: 312, aspectRatio: '2.63:1', category: 'social' },
+      { key: 'facebook-story', name: 'Facebook Story', width: 1080, height: 1920, aspectRatio: '9:16', category: 'social' },
+      { key: 'twitter-post', name: 'Twitter/X Post', width: 1200, height: 675, aspectRatio: '16:9', category: 'social' },
+      { key: 'twitter-header', name: 'Twitter/X Header', width: 1500, height: 500, aspectRatio: '3:1', category: 'social' },
+      { key: 'linkedin-post', name: 'LinkedIn Post', width: 1200, height: 627, aspectRatio: '1.91:1', category: 'social' },
+      { key: 'linkedin-banner', name: 'LinkedIn Banner', width: 1584, height: 396, aspectRatio: '4:1', category: 'social' },
+      { key: 'pinterest-pin', name: 'Pinterest Pin', width: 1000, height: 1500, aspectRatio: '2:3', category: 'social' },
+      { key: 'presentation-16x9', name: 'Presentation 16:9', width: 1920, height: 1080, aspectRatio: '16:9', category: 'presentation' },
+      { key: 'presentation-4x3', name: 'Presentation 4:3', width: 1024, height: 768, aspectRatio: '4:3', category: 'presentation' },
+      { key: 'hd-720p', name: 'HD 720p', width: 1280, height: 720, aspectRatio: '16:9', category: 'video' },
+      { key: 'full-hd-1080p', name: 'Full HD 1080p', width: 1920, height: 1080, aspectRatio: '16:9', category: 'video' },
+      { key: 'default', name: 'Default', width: 800, height: 600, aspectRatio: '4:3', category: 'general' }
+    ]
+  };
+})();
+`.trim();
+    }
+    // ===========================================================================
+    // MAP CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code to load a geographic map
+     */
+    generateLoadMap(input) {
+        const validated = LoadMapInputSchema.parse(input);
+        const { mapId, ...mapOptions } = validated;
+        const optionsStr = Object.keys(mapOptions).length > 0 ? JSON.stringify(mapOptions) : '{}';
+        return `
+// Load geographic map
+(async function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = await app.mapSystem.loadMap('${mapId}', ${optionsStr});
+    return {
+      success: true,
+      mapId: result.mapId || '${mapId}',
+      regions: result.regions?.length || 0,
+      bounds: result.bounds,
+      center: result.center
+    };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to highlight map regions
+     */
+    generateHighlightRegions(input) {
+        const validated = HighlightRegionsInputSchema.parse(input);
+        const regionIds = JSON.stringify(validated.regionIds);
+        const optionsStr = validated.options ? JSON.stringify(validated.options) : '{}';
+        return `
+// Highlight map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.highlightRegions(${regionIds}, ${optionsStr});
+    return { success: true, highlighted: ${regionIds} };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to unhighlight map regions
+     */
+    generateUnhighlightRegions(input) {
+        const validated = UnhighlightRegionsInputSchema.parse(input);
+        const regionIds = validated.regionIds === 'all' ? "'all'" : JSON.stringify(validated.regionIds);
+        return `
+// Unhighlight map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.unhighlightRegions(${regionIds});
+    return { success: true };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to apply data-driven colors (choropleth)
+     */
+    generateApplyDataColors(input) {
+        const validated = ApplyDataColorsInputSchema.parse(input);
+        const dataStr = JSON.stringify(validated.data);
+        const optionsStr = validated.options ? JSON.stringify(validated.options) : '{}';
+        return `
+// Apply choropleth data colors
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.applyDataColors(${dataStr}, ${optionsStr});
+    return { success: true, regionsColored: ${Object.keys(validated.data).length} };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to add a map marker
+     */
+    generateAddMarker(input) {
+        const validated = AddMarkerInputSchema.parse(input);
+        const options = {
+            lat: validated.lat,
+            lon: validated.lon,
+        };
+        if (validated.label)
+            options.label = validated.label;
+        if (validated.color)
+            options.color = validated.color;
+        if (validated.size)
+            options.size = validated.size;
+        if (validated.pulse !== undefined)
+            options.pulse = validated.pulse;
+        if (validated.shape)
+            options.shape = validated.shape;
+        return `
+// Add map marker
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const marker = app.mapSystem.addMarker(${JSON.stringify(options)});
+    return { success: true, markerId: marker?.id || 'marker_added' };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to add map labels
+     */
+    generateAddMapLabels(input) {
+        const validated = AddMapLabelsInputSchema.parse(input);
+        const regionsStr = validated.regions ? JSON.stringify(validated.regions) : 'null';
+        const optionsStr = validated.options ? JSON.stringify(validated.options) : '{}';
+        return `
+// Add map labels
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.addLabels({ regions: ${regionsStr}, ...${optionsStr} });
+    return { success: true };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to pan the map
+     */
+    generatePanMap(input) {
+        const validated = PanMapInputSchema.parse(input);
+        const options = {};
+        if (validated.animate !== undefined)
+            options.animate = validated.animate;
+        if (validated.duration !== undefined)
+            options.duration = validated.duration;
+        return `
+// Pan map to coordinates
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.panTo(${validated.lat}, ${validated.lon}${Object.keys(options).length > 0 ? ', ' + JSON.stringify(options) : ''});
+    return { success: true, panTo: [${validated.lat}, ${validated.lon}] };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to zoom the map
+     */
+    generateZoomMap(input) {
+        const validated = ZoomMapInputSchema.parse(input);
+        const options = {};
+        if (validated.animate !== undefined)
+            options.animate = validated.animate;
+        if (validated.duration !== undefined)
+            options.duration = validated.duration;
+        return `
+// Set map zoom level
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.zoomTo(${validated.level}${Object.keys(options).length > 0 ? ', ' + JSON.stringify(options) : ''});
+    return { success: true, zoomLevel: ${validated.level} };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to export map configuration
+     */
+    generateExportMap() {
+        return `
+// Export map configuration
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const mapData = app.mapSystem.exportMap();
+    return { success: true, ...mapData };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to import a custom map
+     */
+    generateImportCustomMap(input) {
+        const validated = ImportCustomMapInputSchema.parse(input);
+        const optionsStr = validated.options ? JSON.stringify(validated.options) : '{}';
+        if (validated.url) {
+            return `
+// Import custom map from URL
+(async function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = await app.mapSystem.importCustomMap('${validated.url}', ${optionsStr});
+    return { success: true, ...result };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+        }
+        else if (validated.geoJson) {
+            return `
+// Import custom GeoJSON map
+(async function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = await app.mapSystem.importCustomMap(${JSON.stringify(validated.geoJson)}, ${optionsStr});
+    return { success: true, ...result };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+        }
+        return `
+// Import custom map - no source provided
+(function() {
+  return { success: false, error: 'Either url or geoJson must be provided' };
+})();
+`.trim();
+    }
+    /**
+     * Generate code to get region at a point (hit testing)
+     */
+    generateGetRegionAtPoint(input) {
+        const validated = GetRegionAtPointInputSchema.parse(input);
+        return `
+// Get region at canvas point
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const region = app.mapSystem.getRegionAtPoint({ x: ${validated.x}, y: ${validated.y} });
+    if (region) {
+      return { success: true, regionId: region.id, regionName: region.name, properties: region.properties };
+    }
+    return { success: true, regionId: null, message: 'No region at this point' };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    // ===========================================================================
+    // MAP ANIMATION/CSV CODE GENERATORS
+    // ===========================================================================
+    /**
+     * Generate code to animate map regions with keyframes
+     */
+    generateAnimateMapRegions(input) {
+        const validated = AnimateMapRegionsInputSchema.parse(input);
+        const regionsStr = JSON.stringify(validated.regions);
+        return `
+// Animate map regions with keyframes
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.animateRegions({
+      duration: ${validated.duration || 5},
+      loop: ${validated.loop !== false},
+      regions: ${regionsStr}
+    });
+    return { success: true, animatedRegions: Object.keys(${regionsStr}), duration: ${validated.duration || 5}, errors: result?.errors || [] };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to create wave animation across map regions
+     */
+    generateAnimateMapWave(input) {
+        const validated = AnimateMapWaveInputSchema.parse(input);
+        const colorsStr = validated.colors ? JSON.stringify(validated.colors) : '["#ef4444", "#fbbf24", "#22c55e", "#3b82f6"]';
+        return `
+// Create wave animation across map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.animateWave({
+      duration: ${validated.duration || 10},
+      loop: ${validated.loop !== false},
+      colors: ${colorsStr},
+      waveDirection: '${validated.waveDirection || 'horizontal'}'
+    });
+    return { success: true, animatedRegions: result?.animatedRegions || [], totalRegions: result?.totalRegions || 0 };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to stop map animations
+     */
+    generateStopMapAnimations(input) {
+        const validated = StopMapAnimationsInputSchema.parse(input);
+        const regionsStr = validated.regions ? JSON.stringify(validated.regions) : 'null';
+        return `
+// Stop map region animations
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.stopAnimations({
+      regions: ${regionsStr},
+      resetColors: ${validated.resetColors !== false}
+    });
+    return { success: true };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to get animated map regions
+     */
+    generateGetAnimatedMapRegions() {
+        return `
+// Get animated map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.getAnimatedRegions();
+    return { animatedRegions: result?.animatedRegions || [], count: result?.count || 0 };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to export map region data as CSV
+     */
+    generateExportMapRegionCSV(input) {
+        const validated = ExportMapRegionCSVInputSchema.parse(input);
+        return `
+// Export map region data as CSV
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.exportRegionCSV({
+      includeHighlighted: ${validated.includeHighlighted !== false},
+      includeSelected: ${validated.includeSelected !== false},
+      includeColors: ${validated.includeColors !== false},
+      download: ${validated.download === true},
+      filename: '${validated.filename || 'map-regions.csv'}'
+    });
+    return { success: true, csv: result?.csv || '', regionCount: result?.regionCount || 0 };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to import CSV data to update map regions
+     */
+    generateImportMapRegionCSV(input) {
+        const validated = ImportMapRegionCSVInputSchema.parse(input);
+        // Escape the CSV text for JavaScript string
+        const escapedCsv = validated.csvText.replace(/\\/g, '\\\\').replace(/`/g, '\\`').replace(/\$/g, '\\$');
+        return `
+// Import CSV data to update map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.importRegionCSV({
+      csvText: \`${escapedCsv}\`,
+      applyColors: ${validated.applyColors !== false},
+      applyHighlight: ${validated.applyHighlight !== false},
+      applySelection: ${validated.applySelection !== false}
+    });
+    return { success: true, updatedRegions: result?.updatedRegions || 0, notFound: result?.notFound || [], errors: result?.errors || [] };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to select map regions
+     */
+    generateSelectMapRegions(input) {
+        const validated = SelectMapRegionsInputSchema.parse(input);
+        const regionIds = JSON.stringify(validated.regionIds);
+        return `
+// Select map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.selectRegions(${regionIds});
+    return { success: true, selected: ${regionIds} };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to deselect map regions
+     */
+    generateDeselectMapRegions(input) {
+        const validated = DeselectMapRegionsInputSchema.parse(input);
+        const regionIds = validated.regionIds ? JSON.stringify(validated.regionIds) : 'null';
+        return `
+// Deselect map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    app.mapSystem.deselectRegions(${regionIds});
+    return { success: true };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to get highlighted map regions
+     */
+    generateGetHighlightedMapRegions() {
+        return `
+// Get highlighted map regions
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.getHighlightedRegions();
+    return { highlighted: result?.highlighted || [], count: result?.count || 0 };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to export the complete scene state
+     */
+    generateExportScene() {
+        return `
+// Export complete scene state
+(function() {
+  try {
+    const items = [];
+    const relations = [];
+    const decorative = [];
+
+    // Collect items from registry
+    if (app.itemRegistry) {
+      for (const [id, item] of app.itemRegistry.entries()) {
+        const itemData = {
+          id: id,
+          type: item.data?.type || item.className?.toLowerCase() || 'unknown',
+          position: item.position ? { x: item.position.x, y: item.position.y } : null,
+          bounds: item.bounds ? {
+            x: item.bounds.x,
+            y: item.bounds.y,
+            width: item.bounds.width,
+            height: item.bounds.height
+          } : null,
+          properties: {}
+        };
+
+        // Collect common properties
+        if (item.fillColor) itemData.properties.fillColor = item.fillColor.toCSS ? item.fillColor.toCSS() : item.fillColor;
+        if (item.strokeColor) itemData.properties.strokeColor = item.strokeColor.toCSS ? item.strokeColor.toCSS() : item.strokeColor;
+        if (item.strokeWidth) itemData.properties.strokeWidth = item.strokeWidth;
+        if (item.opacity !== undefined) itemData.properties.opacity = item.opacity;
+        if (item.rotation) itemData.properties.rotation = item.rotation;
+        if (item.data?.content) itemData.properties.content = item.data.content;
+
+        if (item.data?.isDecorative) {
+          decorative.push(itemData);
+        } else {
+          items.push(itemData);
+        }
+      }
+    }
+
+    // Collect relations
+    if (app.getRelations) {
+      const activeRelations = app.getRelations();
+      for (const rel of activeRelations) {
+        relations.push({
+          sourceId: rel.sourceId,
+          targetId: rel.targetId,
+          type: rel.type,
+          params: rel.params
+        });
+      }
+    }
+
+    // Get background color and canvas size
+    const backgroundColor = app.getBackgroundColor ? app.getBackgroundColor() : null;
+    const canvasSize = app.getCanvasSize ? app.getCanvasSize() : { width: 800, height: 600 };
+
+    return {
+      success: true,
+      items: items,
+      relations: relations,
+      decorative: decorative,
+      backgroundColor: backgroundColor,
+      canvasSize: canvasSize,
+      itemCount: items.length,
+      relationCount: relations.length
+    };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to export map as GeoJSON with current styling
+     */
+    generateExportMapGeoJson(options = {}) {
+        const includeStyles = options.includeStyles !== false;
+        const includeMetadata = options.includeMetadata !== false;
+        const selectedOnly = options.selectedOnly || false;
+        const download = options.download || false;
+        const filename = options.filename || 'map-export.geojson';
+        return `
+// Export map as GeoJSON
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.exportGeoJSON({
+      includeStyles: ${includeStyles},
+      includeMetadata: ${includeMetadata},
+      selectedOnly: ${selectedOnly},
+      download: ${download},
+      filename: ${JSON.stringify(filename)}
+    });
+    return result;
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to export original map GeoJSON (unmodified boundaries)
+     */
+    generateExportOriginalMapGeoJson(options = {}) {
+        const download = options.download || false;
+        const filename = options.filename || 'map-source.geojson';
+        return `
+// Export original map GeoJSON
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.exportOriginalGeoJSON({
+      download: ${download},
+      filename: ${JSON.stringify(filename)}
+    });
+    return result;
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to get map source info
+     */
+    generateGetMapSourceInfo() {
+        return `
+// Get map source info
+(function() {
+  if (!app.mapSystem) {
+    return { success: false, error: 'Map system not available' };
+  }
+
+  try {
+    const result = app.mapSystem.getSourceInfo();
+    return result;
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    /**
+     * Generate code to register a Paper.js item
+     */
+    generateRegisterItem(input) {
+        const itemJsonStr = JSON.stringify(input.itemJson);
+        const propertiesStr = input.properties ? JSON.stringify(input.properties) : '{}';
+        return `
+// Register Paper.js item
+(function() {
+  try {
+    // Import the Paper.js item from JSON
+    const item = paper.project.importJSON(${itemJsonStr});
+    if (!item) {
+      return { success: false, error: 'Failed to import item from JSON' };
+    }
+
+    // Register in item registry
+    const itemId = app.itemRegistry ? 'item_' + (app.itemRegistry.size + 1) : 'item_1';
+    item.data = item.data || {};
+    item.data.registryId = itemId;
+    item.data.type = ${JSON.stringify(input.itemType)};
+
+    // Merge custom properties
+    const customProps = ${propertiesStr};
+    Object.assign(item.data, customProps);
+
+    // Add to registry
+    if (app.itemRegistry) {
+      app.itemRegistry.set(itemId, item);
+    }
+
+    // Add to appropriate group
+    if (app.textItemGroup) {
+      app.textItemGroup.addChild(item);
+    }
+
+    return {
+      success: true,
+      itemId: itemId,
+      type: ${JSON.stringify(input.itemType)},
+      position: item.position ? { x: item.position.x, y: item.position.y } : null,
+      bounds: item.bounds ? {
+        x: item.bounds.x,
+        y: item.bounds.y,
+        width: item.bounds.width,
+        height: item.bounds.height
+      } : null
+    };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    // =============================================================================
+    // CUSTOM RELATION & CODE GENERATORS
+    // =============================================================================
+    generateRegisterCustomRelation(input) {
+        const validated = RegisterCustomRelationInputSchema.parse(input);
+        const paramsStr = validated.params ? JSON.stringify(validated.params) : '{}';
+        const templatesStr = validated.templates ? JSON.stringify(validated.templates) : '[]';
+        return `
+// Register custom relation: ${validated.name}
+(function() {
+  try {
+    app.registerRelationRule('${validated.name}', {
+      description: ${JSON.stringify(validated.description || '')},
+      params: ${paramsStr},
+      compute: (ctx) => {
+        const { fromPosition, toPosition, params, delta, time } = ctx;
+        ${validated.computeFunction}
+      },
+      apply: (item, target, computed, params) => {
+        ${validated.applyFunction}
+      },
+      templates: ${templatesStr},
+      continuous: ${validated.continuous !== false},
+      priority: ${validated.priority || 0}
+    });
+    return { success: true, relationName: '${validated.name}', message: 'Custom relation registered successfully' };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    generateExecuteCustomCode(input) {
+        const validated = ExecuteCustomCodeInputSchema.parse(input);
+        const description = validated.description || 'Execute custom code';
+        return `
+// ${description}
+(function() {
+  try {
+    ${validated.code}
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    // =============================================================================
+    // MASK GENERATORS
+    // =============================================================================
+    generateApplyAnimatedMask(input) {
+        const validated = ApplyAnimatedMaskInputSchema.parse(input);
+        const optionsStr = validated.options ? JSON.stringify(validated.options) : '{}';
+        const keyframesStr = validated.keyframes ? JSON.stringify(validated.keyframes) : 'null';
+        const maskOptionsStr = validated.maskOptions ? JSON.stringify(validated.maskOptions) : '{}';
+        return `
+// Apply animated mask to ${validated.itemId}
+(function() {
+  if (!app.maskSystem) {
+    return { success: false, error: 'Mask system not available' };
+  }
+
+  try {
+    const result = app.maskSystem.applyAnimatedMask('${validated.itemId}', {
+      preset: ${validated.preset ? `'${validated.preset}'` : 'null'},
+      maskType: ${validated.maskType ? `'${validated.maskType}'` : 'null'},
+      keyframes: ${keyframesStr},
+      options: ${optionsStr},
+      maskOptions: ${maskOptionsStr}
+    });
+    return result;
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    generateApplyCustomMask(input) {
+        const validated = ApplyCustomMaskInputSchema.parse(input);
+        const keyframesStr = JSON.stringify(validated.keyframes);
+        const maskOptionsStr = validated.maskOptions ? JSON.stringify(validated.maskOptions) : '{}';
+        return `
+// Apply custom mask to ${validated.itemId}
+(function() {
+  if (!app.maskSystem) {
+    return { success: false, error: 'Mask system not available' };
+  }
+
+  try {
+    const result = app.maskSystem.applyCustomMask('${validated.itemId}', {
+      maskType: '${validated.maskType}',
+      keyframes: ${keyframesStr},
+      maskOptions: ${maskOptionsStr}
+    });
+    return result;
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    generateRemoveMask(input) {
+        const validated = RemoveMaskInputSchema.parse(input);
+        return `
+// Remove mask from ${validated.itemId}
+(function() {
+  if (!app.maskSystem) {
+    return { success: false, error: 'Mask system not available' };
+  }
+
+  try {
+    const result = app.maskSystem.removeMask('${validated.itemId}');
+    return { success: true, itemId: '${validated.itemId}', message: 'Mask removed' };
+  } catch (error) {
+    return { success: false, error: error.message };
+  }
+})();
+`.trim();
+    }
+    generateGetAnimatableProperties() {
+        return `
+// Get animatable properties for mask types
+(function() {
+  return {
+    rectangle: {
+      properties: ['x', 'y', 'width', 'height', 'rotation', 'opacity'],
+      description: 'Rectangular mask with position and size'
+    },
+    circle: {
+      properties: ['x', 'y', 'radius', 'scale', 'opacity'],
+      description: 'Circular mask with center and radius'
+    },
+    ellipse: {
+      properties: ['x', 'y', 'radiusX', 'radiusY', 'rotation', 'scale', 'opacity'],
+      description: 'Elliptical mask with separate radii'
+    },
+    star: {
+      properties: ['x', 'y', 'radius', 'scale', 'rotation', 'opacity'],
+      description: 'Star mask with configurable points'
+    },
+    triangle: {
+      properties: ['x', 'y', 'scale', 'rotation', 'opacity'],
+      description: 'Triangular mask'
+    },
+    hexagon: {
+      properties: ['x', 'y', 'scale', 'rotation', 'opacity'],
+      description: 'Hexagonal mask'
+    },
+    heart: {
+      properties: ['x', 'y', 'scale', 'rotation', 'opacity'],
+      description: 'Heart-shaped mask'
+    },
+    rounded: {
+      properties: ['x', 'y', 'width', 'height', 'cornerRadius', 'rotation', 'opacity'],
+      description: 'Rounded rectangle mask'
+    }
+  };
+})();
+`.trim();
+    }
+    generateGetAvailableEasings() {
+        return `
+// Get available easing functions
+(function() {
+  return {
+    easings: ['linear', 'easeIn', 'easeOut', 'easeInOut', 'bounce', 'elastic'],
+    descriptions: {
+      linear: 'Constant speed',
+      easeIn: 'Slow start, fast end',
+      easeOut: 'Fast start, slow end',
+      easeInOut: 'Slow start and end',
+      bounce: 'Bouncing effect at end',
+      elastic: 'Spring-like overshoot'
+    }
+  };
+})();
+`.trim();
+    }
+    generateGetMaskTypes() {
+        return `
+// Get available mask types
+(function() {
+  return {
+    maskTypes: ['rectangle', 'circle', 'ellipse', 'star', 'triangle', 'hexagon', 'heart', 'rounded', 'custom']
+  };
+})();
+`.trim();
+    }
+    generateGetMaskAnimations() {
+        return `
+// Get available mask animation presets
+(function() {
+  return {
+    animations: [
+      'wipeLeft', 'wipeRight', 'wipeUp', 'wipeDown',
+      'iris', 'irisOut',
+      'star', 'heart',
+      'curtainHorizontal', 'curtainVertical', 'cinematic',
+      'diagonalWipe',
+      'revealUp', 'revealDown'
+    ]
+  };
+})();
+`.trim();
+    }
+    generateApplyTemplate(input) {
+        const { templateId, category, listOnly } = input;
+        if (listOnly || !templateId) {
+            // List mode: return available templates, optionally filtered by category
+            const categoryFilter = category ? `'${category}'` : 'null';
+            return `
+// List available templates
+(function() {
+  if (!app.templateManager) {
+    return { error: 'Template manager not available. Make sure PinePaper Studio is loaded.' };
+  }
+  const allTemplates = app.templateManager.getAllTemplates();
+  const category = ${categoryFilter};
+  const filtered = category
+    ? allTemplates.filter(t => t.category === category)
+    : allTemplates;
+  return {
+    templates: filtered.map(t => ({
+      id: t.id,
+      name: t.name,
+      category: t.category,
+      description: t.description || ''
+    })),
+    count: filtered.length,
+    categories: [...new Set(allTemplates.map(t => t.category))]
+  };
+})();
+`.trim();
+        }
+        // Load mode: apply a specific template
+        return `
+// Apply template: ${templateId}
+(async function() {
+  if (!app.templateManager) {
+    return { error: 'Template manager not available. Make sure PinePaper Studio is loaded.' };
+  }
+  try {
+    await app.templateManager.loadTemplate('${templateId}', true);
+    return { success: true, templateId: '${templateId}', message: 'Template applied successfully. Canvas has been replaced with template content.' };
+  } catch (e) {
+    return { error: 'Failed to apply template: ' + e.message };
+  }
+})();
+`.trim();
+    }
+    generateImportImage(input) {
+        const { url, position, maxWidth, maxHeight, mask } = input;
+        const positionOpts = position ? `, position: { x: ${position.x}, y: ${position.y} }` : '';
+        const maxWidthOpt = maxWidth !== undefined ? `, maxWidth: ${maxWidth}` : '';
+        const maxHeightOpt = maxHeight !== undefined ? `, maxHeight: ${maxHeight}` : '';
+        return `
+// Import image from URL
+(async function() {
+  if (!app.imageTools) {
+    return { error: 'Image tools not available. Make sure PinePaper Studio is loaded.' };
+  }
+  try {
+    const entry = await app.imageTools.uploadFromURL('${url}');
+    const opts = {${positionOpts}${maxWidthOpt}${maxHeightOpt} };
+    const raster = await app.imageTools.placeImage(entry.id, Object.keys(opts).length > 0 ? opts : undefined);
+${mask ? `    app.imageTools.applyMask(raster, '${mask}');\n` : ''}    const itemId = raster.data?.itemId || raster.name || raster.id;
+    return {
+      success: true,
+      itemId: itemId,
+      message: 'Image imported and placed on canvas.',
+      bounds: { x: raster.bounds.x, y: raster.bounds.y, width: raster.bounds.width, height: raster.bounds.height }${mask ? `,\n      mask: '${mask}'` : ''}
+    };
+  } catch (e) {
+    return { error: 'Failed to import image: ' + e.message };
+  }
+})();
+`.trim();
+    }
 }
 // Export singleton instance
 export const codeGenerator = new PinePaperCodeGenerator();