@nexart/codemode-sdk 0.1.0

package/README.md

@@ -0,0 +1,304 @@
+# NexArt Code Mode Runtime SDK
+
+Version: 0.1.0
+
+A minimal, deterministic rendering engine for generative art.
+
+---
+
+> **This SDK enforces the NexArt Code Mode Runtime Execution Specification (v0.x).**
+>
+> **This is NOT the protocol-stable GSL v1.**
+
+---
+
+## Install
+
+```bash
+npm install @nexart/codemode-sdk
+```
+
+---
+
+## Usage
+
+```typescript
+import { createEngine } from '@nexart/codemode-sdk';
+
+const engine = createEngine({ mode: 'static' });
+
+await engine.run({
+  code: `
+    function setup() {
+      background(255);
+      fill(0);
+      ellipse(width/2, height/2, 100);
+    }
+  `,
+  onComplete: (result) => {
+    console.log(result.type); // 'image'
+    console.log(result.blob); // PNG Blob
+  }
+});
+```
+
+---
+
+## What This SDK Is
+
+This SDK provides a headless runtime for executing p5.js-style generative art code and producing deterministic output:
+
+- **Static Mode**: Executes `setup()` only, outputs PNG
+- **Loop Mode**: Frame-authoritative rendering, outputs MP4
+
+---
+
+## What This SDK Is NOT
+
+- **Not a protocol layer** — Does not validate protocol claims, system hashes, or GSL v1
+- **Not a UI library** — No React components, no wallet integration
+- **Not an IPFS client** — Does not handle storage or minting
+- **Not p5.js** — Uses a minimal subset of p5.js-like functions
+
+---
+
+## Target Version
+
+**Code Mode Runtime v0.x**
+
+This SDK extracts the current NexArt Code Mode execution logic. Future versions may introduce:
+- GSL v1 SDK (protocol layer) — separate package
+- Extended p5.js compatibility
+
+---
+
+## API
+
+### `createEngine(config: EngineConfig): Engine`
+
+Create a rendering engine instance.
+
+```typescript
+import { createEngine } from '@nexart/codemode-sdk';
+
+const engine = createEngine({
+  mode: 'static',      // 'static' | 'loop'
+  width: 1950,         // Optional, default: 1950
+  height: 2400,        // Optional, default: 2400
+  duration: 2,         // Loop mode only, 1-4 seconds
+  fps: 30,             // Loop mode only, default: 30
+});
+```
+
+### `engine.run(options: RunOptions): Promise<void>`
+
+Execute code and produce output.
+
+```typescript
+await engine.run({
+  code: `
+    function setup() {
+      background(255);
+      fill(0);
+      ellipse(width/2, height/2, 100);
+    }
+  `,
+  onPreview: (canvas) => {
+    // Optional: called with canvas after first frame
+  },
+  onProgress: (info) => {
+    // Optional: progress updates
+    console.log(info.message, info.percent + '%');
+  },
+  onComplete: (result) => {
+    // Required: called with final result
+    console.log(result.type); // 'image' | 'video'
+    console.log(result.blob); // Blob
+  },
+  onError: (error) => {
+    // Optional: called on error
+    console.error(error);
+  },
+});
+```
+
+### `engine.stop(): void`
+
+Cancel a running render (Loop mode only).
+
+### `engine.getConfig(): EngineConfig`
+
+Get the resolved engine configuration.
+
+---
+
+## Execution Rules
+
+### Static Mode
+
+1. `setup()` is executed once
+2. `draw()` is **NOT** executed
+3. Canvas is captured as PNG
+4. Time variables are all `0`
+
+### Loop Mode
+
+1. `setup()` is executed once
+2. `draw()` is executed once per frame
+3. Canvas is **cleared** before each `draw()` call
+4. If artist calls `background()` in draw, it paints over the clear
+5. No canvas persistence between frames
+
+**Time Variables:**
+
+| Variable | Type | Description |
+|----------|------|-------------|
+| `frameCount` | int | Current frame (0, 1, 2, ...) |
+| `t` | float | Normalized time [0.0, 1.0) |
+| `time` | float | Elapsed seconds |
+| `tGlobal` | float | Alias for `t` |
+
+---
+
+## Forbidden Patterns
+
+These patterns will throw errors:
+
+- `createCanvas()` — Canvas is pre-initialized by the SDK
+- `setTimeout()`, `setInterval()`, `requestAnimationFrame()` — Async timing breaks determinism
+- `noLoop()` in Loop Mode — Incompatible with frame capture
+
+---
+
+## Example: Static Mode
+
+```typescript
+import { createEngine } from '@nexart/codemode-sdk';
+
+const engine = createEngine({ mode: 'static' });
+
+await engine.run({
+  code: `
+    function setup() {
+      background(30);
+      noStroke();
+      for (let i = 0; i < 100; i++) {
+        fill(random(255), random(255), random(255));
+        ellipse(random(width), random(height), 50);
+      }
+    }
+  `,
+  onComplete: (result) => {
+    // result.type === 'image'
+    // result.blob is a PNG Blob
+    const url = URL.createObjectURL(result.blob);
+    document.body.innerHTML = `<img src="${url}" />`;
+  },
+});
+```
+
+---
+
+## Example: Loop Mode
+
+```typescript
+import { createEngine } from '@nexart/codemode-sdk';
+
+const engine = createEngine({
+  mode: 'loop',
+  duration: 2,  // 2 second loop
+});
+
+await engine.run({
+  code: `
+    function setup() {
+      // Called once
+    }
+    
+    function draw() {
+      background(30);
+      
+      // t goes from 0 to 1 over the loop duration
+      let x = width/2 + cos(t * TWO_PI) * 200;
+      let y = height/2 + sin(t * TWO_PI) * 200;
+      
+      fill(255);
+      ellipse(x, y, 80);
+    }
+  `,
+  onProgress: (info) => {
+    console.log(info.message);
+  },
+  onComplete: (result) => {
+    // result.type === 'video'
+    // result.blob is an MP4 Blob
+    const url = URL.createObjectURL(result.blob);
+    document.body.innerHTML = `<video src="${url}" autoplay loop />`;
+  },
+});
+```
+
+---
+
+## Supported Functions
+
+The SDK includes a minimal p5.js-like runtime with:
+
+**Drawing:**
+`background`, `clear`, `fill`, `noFill`, `stroke`, `noStroke`, `strokeWeight`
+
+**Shapes:**
+`ellipse`, `circle`, `rect`, `square`, `line`, `point`, `triangle`, `quad`, `arc`
+
+**Vertex:**
+`beginShape`, `vertex`, `endShape`
+
+**Transform:**
+`push`, `pop`, `translate`, `rotate`, `scale`, `resetMatrix`
+
+**Color:**
+`colorMode`, `color`, `lerpColor`
+
+**Math:**
+`random`, `noise`, `map`, `constrain`, `lerp`, `dist`, `mag`, `norm`
+
+**Trig:**
+`sin`, `cos`, `tan`, `asin`, `acos`, `atan`, `atan2`, `radians`, `degrees`
+
+**Constants:**
+`PI`, `TWO_PI`, `HALF_PI`, `QUARTER_PI`, `width`, `height`, `frameCount`
+
+---
+
+## Video Encoding
+
+Loop Mode requires server-side video encoding. The SDK calls:
+
+```
+POST /api/encode-loop
+```
+
+Ensure your server has this endpoint available, or provide your own encoding solution.
+
+---
+
+## Files
+
+```
+@nexart/codemode-sdk/
+├── index.ts         # Main export
+├── engine.ts        # createEngine entry point
+├── types.ts         # TypeScript types
+├── static-engine.ts # Static mode implementation
+├── loop-engine.ts   # Loop mode implementation
+├── p5-runtime.ts    # p5.js-like runtime
+└── README.md        # This file
+```
+
+---
+
+## License
+
+MIT License
+
+Copyright (c) 2024 NexArt

package/dist/engine.d.ts

@@ -0,0 +1,24 @@
+/**
+ * NexArt Code Mode Runtime SDK
+ * Version: 0.1.0
+ *
+ * Main entry point for the Code Mode runtime engine.
+ *
+ * Usage:
+ *   const engine = createEngine({ mode: 'static' });
+ *   engine.run({
+ *     code: 'function setup() { background(255); ellipse(width/2, height/2, 100); }',
+ *     onComplete: (result) => console.log(result.blob)
+ *   });
+ */
+import type { Engine, EngineConfig } from './types';
+/**
+ * Create a NexArt Code Mode rendering engine.
+ *
+ * @param config - Engine configuration
+ * @returns Engine instance
+ */
+export declare function createEngine(config: EngineConfig): Engine;
+export type { Engine, EngineConfig, RunOptions, RenderResult, ProgressInfo } from './types';
+export { DEFAULT_CONFIG } from './types';
+//# sourceMappingURL=engine.d.ts.map

package/dist/engine.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"engine.d.ts","sourceRoot":"","sources":["../engine.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,MAAM,EAAE,YAAY,EAAc,MAAM,SAAS,CAAC;AAKhE;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,CA+CzD;AAGD,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC5F,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC"}

package/dist/engine.js

@@ -0,0 +1,67 @@
+/**
+ * NexArt Code Mode Runtime SDK
+ * Version: 0.1.0
+ *
+ * Main entry point for the Code Mode runtime engine.
+ *
+ * Usage:
+ *   const engine = createEngine({ mode: 'static' });
+ *   engine.run({
+ *     code: 'function setup() { background(255); ellipse(width/2, height/2, 100); }',
+ *     onComplete: (result) => console.log(result.blob)
+ *   });
+ */
+import { DEFAULT_CONFIG } from './types';
+import { runStaticMode } from './static-engine';
+import { runLoopMode, cancelLoopMode } from './loop-engine';
+/**
+ * Create a NexArt Code Mode rendering engine.
+ *
+ * @param config - Engine configuration
+ * @returns Engine instance
+ */
+export function createEngine(config) {
+    const resolvedConfig = {
+        mode: config.mode,
+        width: config.width ?? DEFAULT_CONFIG.width,
+        height: config.height ?? DEFAULT_CONFIG.height,
+        duration: config.duration ?? DEFAULT_CONFIG.duration,
+        fps: config.fps ?? DEFAULT_CONFIG.fps,
+    };
+    let isRunning = false;
+    const run = async (options) => {
+        if (isRunning) {
+            throw new Error('Engine is already running. Call stop() first.');
+        }
+        isRunning = true;
+        try {
+            if (resolvedConfig.mode === 'static') {
+                await runStaticMode(resolvedConfig, options);
+            }
+            else if (resolvedConfig.mode === 'loop') {
+                await runLoopMode(resolvedConfig, options);
+            }
+            else {
+                throw new Error(`Unknown mode: ${resolvedConfig.mode}`);
+            }
+        }
+        finally {
+            isRunning = false;
+        }
+    };
+    const stop = () => {
+        if (resolvedConfig.mode === 'loop') {
+            cancelLoopMode();
+        }
+        isRunning = false;
+    };
+    const getConfig = () => {
+        return { ...resolvedConfig };
+    };
+    return {
+        run,
+        stop,
+        getConfig,
+    };
+}
+export { DEFAULT_CONFIG } from './types';

package/dist/index.d.ts

@@ -0,0 +1,31 @@
+/**
+ * NexArt Code Mode Runtime SDK
+ * Version: 0.1.0
+ *
+ * A minimal, deterministic rendering engine for generative art.
+ * Supports Static (PNG) and Loop (MP4) modes.
+ *
+ * @example
+ * ```typescript
+ * import { createEngine } from '@nexart/codemode-sdk';
+ *
+ * const engine = createEngine({ mode: 'static' });
+ *
+ * engine.run({
+ *   code: `
+ *     function setup() {
+ *       background(255);
+ *       fill(0);
+ *       ellipse(width/2, height/2, 100);
+ *     }
+ *   `,
+ *   onComplete: (result) => {
+ *     console.log('Rendered:', result.type, result.blob.size, 'bytes');
+ *   }
+ * });
+ * ```
+ */
+export { createEngine } from './engine';
+export type { Engine, EngineConfig, RunOptions, RenderResult, ProgressInfo, RenderMode, TimeVariables, } from './types';
+export { DEFAULT_CONFIG } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,YAAY,EACV,MAAM,EACN,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,aAAa,GACd,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,29 @@
+/**
+ * NexArt Code Mode Runtime SDK
+ * Version: 0.1.0
+ *
+ * A minimal, deterministic rendering engine for generative art.
+ * Supports Static (PNG) and Loop (MP4) modes.
+ *
+ * @example
+ * ```typescript
+ * import { createEngine } from '@nexart/codemode-sdk';
+ *
+ * const engine = createEngine({ mode: 'static' });
+ *
+ * engine.run({
+ *   code: `
+ *     function setup() {
+ *       background(255);
+ *       fill(0);
+ *       ellipse(width/2, height/2, 100);
+ *     }
+ *   `,
+ *   onComplete: (result) => {
+ *     console.log('Rendered:', result.type, result.blob.size, 'bytes');
+ *   }
+ * });
+ * ```
+ */
+export { createEngine } from './engine';
+export { DEFAULT_CONFIG } from './types';

package/dist/loop-engine.d.ts

@@ -0,0 +1,15 @@
+/**
+ * NexArt Code Mode Runtime SDK - Loop Engine
+ * Version: 0.1.0
+ *
+ * Loop mode renderer: frame-authoritative, stateless execution.
+ * - Executes setup() once
+ * - Executes draw() once per frame
+ * - Clears canvas before each frame (transparent)
+ * - Injects normalized time variables
+ * - No canvas persistence between frames
+ */
+import type { EngineConfig, RunOptions } from './types';
+export declare function cancelLoopMode(): void;
+export declare function runLoopMode(config: EngineConfig, options: RunOptions): Promise<void>;
+//# sourceMappingURL=loop-engine.d.ts.map

package/dist/loop-engine.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loop-engine.d.ts","sourceRoot":"","sources":["../loop-engine.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAA+B,MAAM,SAAS,CAAC;AAMrF,wBAAgB,cAAc,IAAI,IAAI,CAErC;AAED,wBAAsB,WAAW,CAC/B,MAAM,EAAE,YAAY,EACpB,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,IAAI,CAAC,CA4Lf"}

package/dist/loop-engine.js

@@ -0,0 +1,208 @@
+/**
+ * NexArt Code Mode Runtime SDK - Loop Engine
+ * Version: 0.1.0
+ *
+ * Loop mode renderer: frame-authoritative, stateless execution.
+ * - Executes setup() once
+ * - Executes draw() once per frame
+ * - Clears canvas before each frame (transparent)
+ * - Injects normalized time variables
+ * - No canvas persistence between frames
+ */
+import { DEFAULT_CONFIG } from './types';
+import { createP5Runtime } from './p5-runtime';
+let isCancelled = false;
+export function cancelLoopMode() {
+    isCancelled = true;
+}
+export async function runLoopMode(config, options) {
+    const { code, onPreview, onProgress, onComplete, onError } = options;
+    const width = config.width ?? DEFAULT_CONFIG.width;
+    const height = config.height ?? DEFAULT_CONFIG.height;
+    const duration = Math.max(DEFAULT_CONFIG.minDuration, Math.min(DEFAULT_CONFIG.maxDuration, config.duration ?? DEFAULT_CONFIG.duration));
+    const fps = config.fps ?? DEFAULT_CONFIG.fps;
+    const totalFrames = Math.floor(duration * fps);
+    isCancelled = false;
+    try {
+        onProgress?.({
+            phase: 'setup',
+            percent: 0,
+            message: 'Initializing canvas...',
+        });
+        // Create canvas
+        const canvas = document.createElement('canvas');
+        canvas.width = width;
+        canvas.height = height;
+        // Create p5 runtime
+        const p = createP5Runtime(canvas, width, height);
+        // Validate code
+        const hasDrawFunction = /function\s+draw\s*\(\s*\)/.test(code);
+        if (!hasDrawFunction) {
+            throw new Error('Loop Mode requires a draw() function.');
+        }
+        const forbiddenPatterns = [
+            { pattern: /noLoop\s*\(\s*\)/, name: 'noLoop()' },
+            { pattern: /setTimeout\s*\(/, name: 'setTimeout' },
+            { pattern: /setInterval\s*\(/, name: 'setInterval' },
+            { pattern: /requestAnimationFrame\s*\(/, name: 'requestAnimationFrame' },
+        ];
+        for (const { pattern, name } of forbiddenPatterns) {
+            if (pattern.test(code)) {
+                throw new Error(`Forbidden function in Loop Mode: ${name}`);
+            }
+        }
+        onProgress?.({
+            phase: 'setup',
+            percent: 5,
+            message: 'Parsing code...',
+        });
+        // Extract setup() and draw() functions
+        const setupMatch = code.match(/function\s+setup\s*\(\s*\)\s*\{([\s\S]*?)\}(?=\s*function|\s*$)/);
+        const drawMatch = code.match(/function\s+draw\s*\(\s*\)\s*\{([\s\S]*?)\}(?=\s*function|\s*$)/);
+        const setupCode = setupMatch ? setupMatch[1].trim() : '';
+        const drawCode = drawMatch ? drawMatch[1].trim() : '';
+        if (!drawCode) {
+            throw new Error('Loop Mode requires a draw() function with content.');
+        }
+        // Create wrapped functions with p5 context and time variables
+        const wrappedSetup = new Function('p', 'frameCount', 't', 'time', 'tGlobal', `with(p) { ${setupCode} }`);
+        const wrappedDraw = new Function('p', 'frameCount', 't', 'time', 'tGlobal', `with(p) { ${drawCode} }`);
+        onProgress?.({
+            phase: 'setup',
+            percent: 10,
+            message: 'Executing setup()...',
+        });
+        // Execute setup() once with time = 0
+        wrappedSetup(p, 0, 0, 0, 0);
+        // Capture frames
+        const frames = [];
+        onProgress?.({
+            phase: 'rendering',
+            frame: 0,
+            totalFrames,
+            percent: 10,
+            message: `Rendering frames (0/${totalFrames})...`,
+        });
+        for (let frame = 0; frame < totalFrames; frame++) {
+            if (isCancelled) {
+                throw new Error('Rendering cancelled');
+            }
+            // Calculate normalized time variables
+            // t = frame / totalFrames (range [0, 1))
+            const t = frame / totalFrames;
+            const time = t * duration;
+            // Update p5 runtime frameCount
+            p.frameCount = frame;
+            // CRITICAL: Clear canvas before each draw() call
+            // This enforces stateless, frame-authoritative rendering
+            // Preserves artist-defined backgrounds (if they call background() in draw)
+            p.clear();
+            // Execute draw() with time variables
+            wrappedDraw(p, frame, t, time, t);
+            // Capture frame as PNG blob
+            const blob = await new Promise((resolve, reject) => {
+                canvas.toBlob((b) => b ? resolve(b) : reject(new Error(`Failed to capture frame ${frame}`)), 'image/png');
+            });
+            frames.push(blob);
+            // Provide preview on first frame
+            if (frame === 0) {
+                onPreview?.(canvas);
+            }
+            // Update progress
+            const percent = 10 + Math.floor((frame / totalFrames) * 60);
+            onProgress?.({
+                phase: 'rendering',
+                frame: frame + 1,
+                totalFrames,
+                percent,
+                message: `Rendering frames (${frame + 1}/${totalFrames})...`,
+            });
+            // Yield to prevent blocking UI
+            if (frame % 10 === 0) {
+                await new Promise(resolve => setTimeout(resolve, 0));
+            }
+        }
+        onProgress?.({
+            phase: 'encoding',
+            frame: totalFrames,
+            totalFrames,
+            percent: 70,
+            message: 'Encoding video...',
+        });
+        // Encode to video (MP4)
+        const videoBlob = await encodeFramesToMP4(frames, fps, width, height, (progress) => {
+            const percent = 70 + Math.floor(progress * 30);
+            onProgress?.({
+                phase: 'encoding',
+                frame: totalFrames,
+                totalFrames,
+                percent,
+                message: `Encoding video (${Math.floor(progress * 100)}%)...`,
+            });
+        });
+        onProgress?.({
+            phase: 'complete',
+            frame: totalFrames,
+            totalFrames,
+            percent: 100,
+            message: 'Complete',
+        });
+        const result = {
+            type: 'video',
+            blob: videoBlob,
+            frames: totalFrames,
+            duration,
+        };
+        onComplete(result);
+    }
+    catch (error) {
+        const err = error instanceof Error ? error : new Error(String(error));
+        onError?.(err);
+    }
+}
+/**
+ * Encode frames to MP4 video
+ * Uses server-side encoding endpoint for cross-browser reliability
+ */
+async function encodeFramesToMP4(frames, fps, width, height, onProgress) {
+    // Convert frames to base64 for server transport
+    const frameDataUrls = [];
+    for (let i = 0; i < frames.length; i++) {
+        const reader = new FileReader();
+        const dataUrl = await new Promise((resolve, reject) => {
+            reader.onload = () => resolve(reader.result);
+            reader.onerror = reject;
+            reader.readAsDataURL(frames[i]);
+        });
+        frameDataUrls.push(dataUrl);
+        onProgress?.(i / frames.length * 0.3);
+    }
+    // Send to server for encoding
+    const response = await fetch('/api/encode-loop', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+            frames: frameDataUrls,
+            fps,
+            width,
+            height,
+        }),
+    });
+    if (!response.ok) {
+        const errorText = await response.text();
+        throw new Error(`Video encoding failed: ${errorText}`);
+    }
+    onProgress?.(0.8);
+    const data = await response.json();
+    if (!data.video) {
+        throw new Error('No video data returned from encoder');
+    }
+    // Convert base64 to blob
+    const binaryString = atob(data.video.split(',')[1] || data.video);
+    const bytes = new Uint8Array(binaryString.length);
+    for (let i = 0; i < binaryString.length; i++) {
+        bytes[i] = binaryString.charCodeAt(i);
+    }
+    onProgress?.(1);
+    return new Blob([bytes], { type: 'video/mp4' });
+}

package/dist/p5-runtime.d.ts

@@ -0,0 +1,21 @@
+/**
+ * NexArt Code Mode Runtime SDK - p5-like Runtime
+ * Version: 0.1.0
+ *
+ * Minimal p5.js-like runtime for deterministic generative art execution.
+ * This is a headless runtime - no UI dependencies.
+ */
+import type { TimeVariables } from './types';
+export interface P5Runtime {
+    [key: string]: any;
+    width: number;
+    height: number;
+    frameCount: number;
+    PI: number;
+    TWO_PI: number;
+    HALF_PI: number;
+    QUARTER_PI: number;
+}
+export declare function createP5Runtime(canvas: HTMLCanvasElement, width: number, height: number): P5Runtime;
+export declare function injectTimeVariables(p: P5Runtime, time: TimeVariables): void;
+//# sourceMappingURL=p5-runtime.d.ts.map

package/dist/p5-runtime.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"p5-runtime.d.ts","sourceRoot":"","sources":["../p5-runtime.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C,MAAM,WAAW,SAAS;IACxB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,iBAAiB,EACzB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,SAAS,CAkVX;AAED,wBAAgB,mBAAmB,CAAC,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,aAAa,GAAG,IAAI,CAE3E"}

package/dist/p5-runtime.js

@@ -0,0 +1,315 @@
+/**
+ * NexArt Code Mode Runtime SDK - p5-like Runtime
+ * Version: 0.1.0
+ *
+ * Minimal p5.js-like runtime for deterministic generative art execution.
+ * This is a headless runtime - no UI dependencies.
+ */
+export function createP5Runtime(canvas, width, height) {
+    const ctx = canvas.getContext('2d', { willReadFrequently: true });
+    let currentFill = 'rgba(255, 255, 255, 1)';
+    let currentStroke = 'rgba(0, 0, 0, 1)';
+    let strokeEnabled = true;
+    let fillEnabled = true;
+    let currentStrokeWeight = 1;
+    let colorModeSettings = { mode: 'RGB', maxR: 255, maxG: 255, maxB: 255, maxA: 255 };
+    const parseColor = (...args) => {
+        if (args.length === 0)
+            return 'rgba(0, 0, 0, 1)';
+        const { mode, maxR, maxG, maxB, maxA } = colorModeSettings;
+        if (args.length === 1) {
+            const val = args[0];
+            if (typeof val === 'string')
+                return val;
+            if (mode === 'HSB') {
+                return `hsla(${val}, 100%, 50%, 1)`;
+            }
+            const gray = Math.round((val / maxR) * 255);
+            return `rgba(${gray}, ${gray}, ${gray}, 1)`;
+        }
+        if (args.length === 2) {
+            const [gray, alpha] = args;
+            const g = Math.round((gray / maxR) * 255);
+            const a = alpha / maxA;
+            return `rgba(${g}, ${g}, ${g}, ${a})`;
+        }
+        if (args.length === 3) {
+            const [r, g, b] = args;
+            if (mode === 'HSB') {
+                return `hsla(${(r / maxR) * 360}, ${(g / maxG) * 100}%, ${(b / maxB) * 100}%, 1)`;
+            }
+            return `rgba(${Math.round((r / maxR) * 255)}, ${Math.round((g / maxG) * 255)}, ${Math.round((b / maxB) * 255)}, 1)`;
+        }
+        if (args.length === 4) {
+            const [r, g, b, a] = args;
+            if (mode === 'HSB') {
+                return `hsla(${(r / maxR) * 360}, ${(g / maxG) * 100}%, ${(b / maxB) * 100}%, ${a / maxA})`;
+            }
+            return `rgba(${Math.round((r / maxR) * 255)}, ${Math.round((g / maxG) * 255)}, ${Math.round((b / maxB) * 255)}, ${a / maxA})`;
+        }
+        return 'rgba(0, 0, 0, 1)';
+    };
+    const p = {
+        width,
+        height,
+        frameCount: 0,
+        // Constants
+        PI: Math.PI,
+        TWO_PI: Math.PI * 2,
+        HALF_PI: Math.PI / 2,
+        QUARTER_PI: Math.PI / 4,
+        // Shape mode constants
+        CORNER: 'corner',
+        CENTER: 'center',
+        CORNERS: 'corners',
+        RADIUS: 'radius',
+        ROUND: 'round',
+        SQUARE: 'square',
+        PROJECT: 'project',
+        MITER: 'miter',
+        BEVEL: 'bevel',
+        CLOSE: 'close',
+        // Canvas operations
+        background: (...args) => {
+            ctx.save();
+            ctx.fillStyle = parseColor(...args);
+            ctx.fillRect(0, 0, width, height);
+            ctx.restore();
+        },
+        clear: () => {
+            ctx.clearRect(0, 0, width, height);
+        },
+        // Color functions
+        fill: (...args) => {
+            fillEnabled = true;
+            currentFill = parseColor(...args);
+            ctx.fillStyle = currentFill;
+        },
+        noFill: () => {
+            fillEnabled = false;
+        },
+        stroke: (...args) => {
+            strokeEnabled = true;
+            currentStroke = parseColor(...args);
+            ctx.strokeStyle = currentStroke;
+        },
+        noStroke: () => {
+            strokeEnabled = false;
+        },
+        strokeWeight: (weight) => {
+            currentStrokeWeight = weight;
+            ctx.lineWidth = weight;
+        },
+        colorMode: (mode, max1, max2, max3, maxA) => {
+            colorModeSettings = {
+                mode: mode.toUpperCase(),
+                maxR: max1 ?? 255,
+                maxG: max2 ?? max1 ?? 255,
+                maxB: max3 ?? max1 ?? 255,
+                maxA: maxA ?? 255,
+            };
+        },
+        color: (...args) => parseColor(...args),
+        lerpColor: (c1, c2, amt) => {
+            return c1; // Simplified - full implementation would blend colors
+        },
+        // Shape functions
+        ellipse: (x, y, w, h) => {
+            const rw = w / 2;
+            const rh = (h ?? w) / 2;
+            ctx.beginPath();
+            ctx.ellipse(x, y, rw, rh, 0, 0, Math.PI * 2);
+            if (fillEnabled)
+                ctx.fill();
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        circle: (x, y, d) => {
+            p.ellipse(x, y, d, d);
+        },
+        rect: (x, y, w, h, r) => {
+            const height = h ?? w;
+            ctx.beginPath();
+            if (r && r > 0) {
+                ctx.roundRect(x, y, w, height, r);
+            }
+            else {
+                ctx.rect(x, y, w, height);
+            }
+            if (fillEnabled)
+                ctx.fill();
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        square: (x, y, s, r) => {
+            p.rect(x, y, s, s, r);
+        },
+        line: (x1, y1, x2, y2) => {
+            ctx.beginPath();
+            ctx.moveTo(x1, y1);
+            ctx.lineTo(x2, y2);
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        point: (x, y) => {
+            ctx.beginPath();
+            ctx.arc(x, y, currentStrokeWeight / 2, 0, Math.PI * 2);
+            ctx.fillStyle = currentStroke;
+            ctx.fill();
+        },
+        triangle: (x1, y1, x2, y2, x3, y3) => {
+            ctx.beginPath();
+            ctx.moveTo(x1, y1);
+            ctx.lineTo(x2, y2);
+            ctx.lineTo(x3, y3);
+            ctx.closePath();
+            if (fillEnabled)
+                ctx.fill();
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        quad: (x1, y1, x2, y2, x3, y3, x4, y4) => {
+            ctx.beginPath();
+            ctx.moveTo(x1, y1);
+            ctx.lineTo(x2, y2);
+            ctx.lineTo(x3, y3);
+            ctx.lineTo(x4, y4);
+            ctx.closePath();
+            if (fillEnabled)
+                ctx.fill();
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        arc: (x, y, w, h, start, stop, mode) => {
+            ctx.beginPath();
+            ctx.ellipse(x, y, w / 2, h / 2, 0, start, stop);
+            if (mode === 'pie' || mode === 'PIE') {
+                ctx.lineTo(x, y);
+                ctx.closePath();
+            }
+            else if (mode === 'chord' || mode === 'CHORD') {
+                ctx.closePath();
+            }
+            if (fillEnabled)
+                ctx.fill();
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        // Vertex-based shapes
+        beginShape: () => {
+            ctx.beginPath();
+        },
+        vertex: (x, y) => {
+            if (ctx.isPointInPath(x, y)) {
+                ctx.lineTo(x, y);
+            }
+            else {
+                ctx.moveTo(x, y);
+                ctx.lineTo(x, y);
+            }
+        },
+        endShape: (mode) => {
+            if (mode === 'close' || mode === 'CLOSE') {
+                ctx.closePath();
+            }
+            if (fillEnabled)
+                ctx.fill();
+            if (strokeEnabled)
+                ctx.stroke();
+        },
+        // Transform functions
+        push: () => {
+            ctx.save();
+        },
+        pop: () => {
+            ctx.restore();
+            ctx.fillStyle = currentFill;
+            ctx.strokeStyle = currentStroke;
+            ctx.lineWidth = currentStrokeWeight;
+        },
+        translate: (x, y) => {
+            ctx.translate(x, y);
+        },
+        rotate: (angle) => {
+            ctx.rotate(angle);
+        },
+        scale: (sx, sy) => {
+            ctx.scale(sx, sy ?? sx);
+        },
+        resetMatrix: () => {
+            ctx.setTransform(1, 0, 0, 1, 0, 0);
+        },
+        // Math functions
+        random: (min, max) => {
+            if (min === undefined)
+                return Math.random();
+            if (max === undefined)
+                return Math.random() * min;
+            return min + Math.random() * (max - min);
+        },
+        randomSeed: (seed) => {
+            // Simplified - would need proper seeded random
+        },
+        noise: (x, y, z) => {
+            // Simplified Perlin-like noise
+            const hash = (n) => {
+                const s = Math.sin(n) * 43758.5453123;
+                return s - Math.floor(s);
+            };
+            const xVal = x ?? 0;
+            const yVal = y ?? 0;
+            const zVal = z ?? 0;
+            return hash(xVal * 12.9898 + yVal * 78.233 + zVal * 37.719);
+        },
+        noiseSeed: (seed) => { },
+        noiseDetail: (lod, falloff) => { },
+        map: (value, start1, stop1, start2, stop2) => {
+            return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));
+        },
+        constrain: (n, low, high) => {
+            return Math.max(low, Math.min(high, n));
+        },
+        lerp: (start, stop, amt) => {
+            return start + (stop - start) * amt;
+        },
+        dist: (x1, y1, x2, y2) => {
+            return Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2);
+        },
+        mag: (x, y) => {
+            return Math.sqrt(x * x + y * y);
+        },
+        norm: (value, start, stop) => {
+            return (value - start) / (stop - start);
+        },
+        // Trig functions
+        sin: Math.sin,
+        cos: Math.cos,
+        tan: Math.tan,
+        asin: Math.asin,
+        acos: Math.acos,
+        atan: Math.atan,
+        atan2: Math.atan2,
+        radians: (degrees) => degrees * (Math.PI / 180),
+        degrees: (radians) => radians * (180 / Math.PI),
+        // Utility functions
+        abs: Math.abs,
+        ceil: Math.ceil,
+        floor: Math.floor,
+        round: Math.round,
+        sqrt: Math.sqrt,
+        pow: Math.pow,
+        exp: Math.exp,
+        log: Math.log,
+        min: Math.min,
+        max: Math.max,
+        // Loop control (no-ops for SDK)
+        noLoop: () => { },
+        loop: () => { },
+        redraw: () => { },
+        frameRate: (fps) => { },
+    };
+    return p;
+}
+export function injectTimeVariables(p, time) {
+    p.frameCount = time.frameCount;
+}

package/dist/static-engine.d.ts

@@ -0,0 +1,10 @@
+/**
+ * NexArt Code Mode Runtime SDK - Static Engine
+ * Version: 0.1.0
+ *
+ * Static mode renderer: executes setup() only, captures single PNG.
+ * Does NOT execute draw() - per NexArt Execution Specification v1.
+ */
+import type { EngineConfig, RunOptions } from './types';
+export declare function runStaticMode(config: EngineConfig, options: RunOptions): Promise<void>;
+//# sourceMappingURL=static-engine.d.ts.map

package/dist/static-engine.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"static-engine.d.ts","sourceRoot":"","sources":["../static-engine.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAgB,MAAM,SAAS,CAAC;AAItE,wBAAsB,aAAa,CACjC,MAAM,EAAE,YAAY,EACpB,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,IAAI,CAAC,CA+Ff"}

package/dist/static-engine.js

@@ -0,0 +1,83 @@
+/**
+ * NexArt Code Mode Runtime SDK - Static Engine
+ * Version: 0.1.0
+ *
+ * Static mode renderer: executes setup() only, captures single PNG.
+ * Does NOT execute draw() - per NexArt Execution Specification v1.
+ */
+import { DEFAULT_CONFIG } from './types';
+import { createP5Runtime, injectTimeVariables } from './p5-runtime';
+export async function runStaticMode(config, options) {
+    const { code, onPreview, onProgress, onComplete, onError } = options;
+    const width = config.width ?? DEFAULT_CONFIG.width;
+    const height = config.height ?? DEFAULT_CONFIG.height;
+    try {
+        onProgress?.({
+            phase: 'setup',
+            percent: 0,
+            message: 'Initializing canvas...',
+        });
+        // Create offscreen canvas
+        const canvas = document.createElement('canvas');
+        canvas.width = width;
+        canvas.height = height;
+        // Create p5 runtime
+        const p = createP5Runtime(canvas, width, height);
+        // Inject time variables (static = frame 0, t = 0)
+        injectTimeVariables(p, {
+            frameCount: 0,
+            t: 0,
+            time: 0,
+            tGlobal: 0,
+        });
+        onProgress?.({
+            phase: 'setup',
+            percent: 10,
+            message: 'Parsing code...',
+        });
+        // Extract setup() function only - draw() is NOT executed in Static Mode
+        const setupMatch = code.match(/function\s+setup\s*\(\s*\)\s*\{([\s\S]*?)\}(?=\s*function|\s*$)/);
+        const setupCode = setupMatch ? setupMatch[1].trim() : code;
+        // Validate - no forbidden patterns
+        const forbiddenPatterns = ['setTimeout', 'setInterval', 'requestAnimationFrame'];
+        for (const pattern of forbiddenPatterns) {
+            if (code.includes(pattern)) {
+                throw new Error(`Forbidden async timing function: ${pattern}`);
+            }
+        }
+        onProgress?.({
+            phase: 'rendering',
+            percent: 30,
+            message: 'Executing setup()...',
+        });
+        // Create wrapped setup function with p5 context
+        const wrappedSetup = new Function('p', 'frameCount', 't', 'time', 'tGlobal', `with(p) { ${setupCode} }`);
+        // Execute setup() only
+        wrappedSetup(p, 0, 0, 0, 0);
+        // Provide preview callback
+        onPreview?.(canvas);
+        onProgress?.({
+            phase: 'encoding',
+            percent: 70,
+            message: 'Capturing PNG...',
+        });
+        // Capture as PNG
+        const blob = await new Promise((resolve, reject) => {
+            canvas.toBlob((b) => b ? resolve(b) : reject(new Error('Failed to capture PNG')), 'image/png');
+        });
+        onProgress?.({
+            phase: 'complete',
+            percent: 100,
+            message: 'Complete',
+        });
+        const result = {
+            type: 'image',
+            blob,
+        };
+        onComplete(result);
+    }
+    catch (error) {
+        const err = error instanceof Error ? error : new Error(String(error));
+        onError?.(err);
+    }
+}

package/dist/types.d.ts

@@ -0,0 +1,54 @@
+/**
+ * NexArt Code Mode Runtime SDK - Types
+ * Version: 0.1.0
+ *
+ * Type definitions for the Code Mode runtime engine.
+ */
+export type RenderMode = 'static' | 'loop';
+export interface EngineConfig {
+    mode: RenderMode;
+    width?: number;
+    height?: number;
+    duration?: number;
+    fps?: number;
+}
+export interface RenderResult {
+    type: 'image' | 'video';
+    blob: Blob;
+    frames?: number;
+    duration?: number;
+}
+export interface RunOptions {
+    code: string;
+    onPreview?: (canvas: HTMLCanvasElement) => void;
+    onProgress?: (progress: ProgressInfo) => void;
+    onComplete: (result: RenderResult) => void;
+    onError?: (error: Error) => void;
+}
+export interface ProgressInfo {
+    phase: 'setup' | 'rendering' | 'encoding' | 'complete';
+    frame?: number;
+    totalFrames?: number;
+    percent: number;
+    message: string;
+}
+export interface Engine {
+    run: (options: RunOptions) => Promise<void>;
+    stop: () => void;
+    getConfig: () => Readonly<EngineConfig>;
+}
+export interface TimeVariables {
+    frameCount: number;
+    t: number;
+    time: number;
+    tGlobal: number;
+}
+export declare const DEFAULT_CONFIG: {
+    readonly width: 1950;
+    readonly height: 2400;
+    readonly duration: 2;
+    readonly fps: 30;
+    readonly minDuration: 1;
+    readonly maxDuration: 4;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE3C,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC;IACxB,IAAI,EAAE,IAAI,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9C,UAAU,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,OAAO,GAAG,WAAW,GAAG,UAAU,GAAG,UAAU,CAAC;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,MAAM;IACrB,GAAG,EAAE,CAAC,OAAO,EAAE,UAAU,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,SAAS,EAAE,MAAM,QAAQ,CAAC,YAAY,CAAC,CAAC;CACzC;AAED,MAAM,WAAW,aAAa;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,cAAc;;;;;;;CAOjB,CAAC"}

package/dist/types.js

@@ -0,0 +1,14 @@
+/**
+ * NexArt Code Mode Runtime SDK - Types
+ * Version: 0.1.0
+ *
+ * Type definitions for the Code Mode runtime engine.
+ */
+export const DEFAULT_CONFIG = {
+    width: 1950,
+    height: 2400,
+    duration: 2,
+    fps: 30,
+    minDuration: 1,
+    maxDuration: 4,
+};

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@nexart/codemode-sdk",
+  "version": "0.1.0",
+  "description": "NexArt Code Mode Runtime SDK - Deterministic generative art rendering engine",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "prepublishOnly": "npm run build"
+  },
+  "devDependencies": {
+    "typescript": "^5.0.0"
+  },
+  "keywords": [
+    "generative-art",
+    "p5js",
+    "canvas",
+    "rendering",
+    "deterministic",
+    "nft",
+    "creative-coding"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/artnames/nexart-codemode-sdk.git"
+  },
+  "author": "NexArt",
+  "publishConfig": {
+    "access": "public"
+  }
+}