@vib3code/sdk 2.0.3-canary.6f35b4c → 2.0.3-canary.75a3290

package/src/render/MultiCanvasBridge.js

@@ -7,30 +7,30 @@
  * UnifiedRenderBridge instances — one per canvas — and coordinates shader
  * compilation, uniform updates, and rendering across all layers.
  *
+ * Layer parameters are derived through a LayerRelationshipGraph, where one
+ * layer acts as the keystone (driver) and others derive their state through
+ * configurable relationship functions — not static multipliers.
+ *
  * Usage:
  *   const multi = new MultiCanvasBridge();
  *   await multi.initialize({
- *       canvases: {
- *           background: document.getElementById('bg-canvas'),
- *           shadow: document.getElementById('shadow-canvas'),
- *           content: document.getElementById('content-canvas'),
- *           highlight: document.getElementById('highlight-canvas'),
- *           accent: document.getElementById('accent-canvas'),
- *       },
- *       preferWebGPU: true
+ *       canvases: { background, shadow, content, highlight, accent },
+ *       preferWebGPU: true,
+ *       relationshipProfile: 'holographic' // or 'symmetry', 'chord', 'storm'
  *   });
  *
  *   multi.compileShaderAll('holographic', shaderSources);
- *   multi.setSharedUniforms({ u_time: t, u_resolution: [w, h] });
- *   multi.setLayerUniforms('background', { u_layerOpacity: 0.2, u_densityMult: 0.4 });
+ *   multi.setKeystoneUniforms({ u_time: t, u_density: 1.0, u_hue: 320 });
  *   multi.renderAll('holographic');
  */
 
 import { UnifiedRenderBridge } from './UnifiedRenderBridge.js';
+import { LayerRelationshipGraph, LAYER_ORDER as GRAPH_LAYER_ORDER } from './LayerRelationshipGraph.js';
 
 /**
- * Default layer configuration matching the VIB3+ holographic system.
- * Each layer has role-specific opacity, density, and speed multipliers.
+ * Default layer configuration — used as fallback when no relationship graph
+ * is active (legacy mode). Preserved for backward compatibility only.
+ * @deprecated Use LayerRelationshipGraph profiles instead.
  */
 const DEFAULT_LAYER_CONFIG = {
     background: { layerScale: 1.0, layerOpacity: 0.2, densityMult: 0.4, speedMult: 0.2 },
@@ -43,7 +43,7 @@ const DEFAULT_LAYER_CONFIG = {
 /**
  * Standard layer order (back to front).
  */
-const LAYER_ORDER = ['background', 'shadow', 'content', 'highlight', 'accent'];
+const LAYER_ORDER = GRAPH_LAYER_ORDER;
 
 export class MultiCanvasBridge {
     constructor() {
@@ -59,7 +59,7 @@ export class MultiCanvasBridge {
         /** @type {Map<string, object>} Per-layer uniform overrides */
         this._layerUniforms = new Map();
 
-        /** @type {Map<string, object>} Per-layer config (opacity, density, speed) */
+        /** @type {Map<string, object>} Per-layer config (opacity, density, speed) — legacy fallback */
         this._layerConfig = new Map();
 
         /** @type {boolean} */
@@ -67,6 +67,12 @@ export class MultiCanvasBridge {
 
         /** @type {string|null} Active backend type (set after init) */
         this._backendType = null;
+
+        /** @type {LayerRelationshipGraph|null} */
+        this._relationshipGraph = null;
+
+        /** @type {number} Frame time counter for relationship resolution */
+        this._frameTime = 0;
     }
 
     /**
@@ -76,7 +82,9 @@ export class MultiCanvasBridge {
      * @param {object} options.canvases - Map of layer name → HTMLCanvasElement
      * @param {boolean} [options.preferWebGPU=true] - Try WebGPU for each canvas
      * @param {boolean} [options.debug=false]
-     * @param {object} [options.layerConfig] - Override default layer configuration
+     * @param {object} [options.layerConfig] - Override default layer configuration (legacy)
+     * @param {string} [options.relationshipProfile] - Named relationship profile to load
+     * @param {LayerRelationshipGraph} [options.relationshipGraph] - Pre-configured graph instance
      * @returns {Promise<void>}
      */
     async initialize(options) {
@@ -84,7 +92,9 @@ export class MultiCanvasBridge {
             canvases,
             preferWebGPU = true,
             debug = false,
-            layerConfig = {}
+            layerConfig = {},
+            relationshipProfile,
+            relationshipGraph
         } = options;
 
         // Initialize bridges in parallel
@@ -102,7 +112,7 @@ export class MultiCanvasBridge {
                 this._bridges.set(layerName, bridge);
                 this._canvases.set(layerName, canvas);
 
-                // Apply layer config (user override > default)
+                // Apply legacy layer config (user override > default)
                 const config = {
                     ...(DEFAULT_LAYER_CONFIG[layerName] || {}),
                     ...(layerConfig[layerName] || {})
@@ -118,9 +128,19 @@ export class MultiCanvasBridge {
             }
         }
 
+        // Set up relationship graph
+        if (relationshipGraph instanceof LayerRelationshipGraph) {
+            this._relationshipGraph = relationshipGraph;
+        } else if (relationshipProfile) {
+            this._relationshipGraph = new LayerRelationshipGraph({ profile: relationshipProfile });
+        }
+
         this._initialized = this._bridges.size > 0;
         if (debug) {
-            console.log(`MultiCanvasBridge: ${this._bridges.size}/${entries.length} layers initialized (${this._backendType})`);
+            const graphInfo = this._relationshipGraph
+                ? ` [graph: ${this._relationshipGraph.activeProfile || 'custom'}]`
+                : ' [legacy mode]';
+            console.log(`MultiCanvasBridge: ${this._bridges.size}/${entries.length} layers initialized (${this._backendType})${graphInfo}`);
         }
     }
 
@@ -157,6 +177,55 @@ export class MultiCanvasBridge {
         return this._bridges.get(layerName);
     }
 
+    // ========================================================================
+    // Layer Relationship Graph
+    // ========================================================================
+
+    /**
+     * Get the active relationship graph. Creates one with 'holographic' profile
+     * if none exists.
+     * @returns {LayerRelationshipGraph}
+     */
+    get relationshipGraph() {
+        if (!this._relationshipGraph) {
+            this._relationshipGraph = new LayerRelationshipGraph({ profile: 'holographic' });
+        }
+        return this._relationshipGraph;
+    }
+
+    /**
+     * Set or replace the relationship graph.
+     * @param {LayerRelationshipGraph} graph
+     */
+    set relationshipGraph(graph) {
+        this._relationshipGraph = graph;
+    }
+
+    /**
+     * Load a named relationship profile.
+     * @param {string} profileName - holographic, symmetry, chord, storm, legacy
+     */
+    loadRelationshipProfile(profileName) {
+        this.relationshipGraph.loadProfile(profileName);
+    }
+
+    /**
+     * Set the keystone (driver) layer.
+     * @param {string} layerName
+     */
+    setKeystone(layerName) {
+        this.relationshipGraph.setKeystone(layerName);
+    }
+
+    /**
+     * Set the relationship for a dependent layer.
+     * @param {string} layerName
+     * @param {string|Function|Object} relationship - Preset name, function, or { preset, config }
+     */
+    setLayerRelationship(layerName, relationship) {
+        this.relationshipGraph.setRelationship(layerName, relationship);
+    }
+
     // ========================================================================
     // Shader Compilation
     // ========================================================================
@@ -204,6 +273,7 @@ export class MultiCanvasBridge {
 
     /**
      * Set uniforms shared across all layers (e.g. time, resolution, geometry).
+     * When a relationship graph is active, these are treated as keystone parameters.
      *
      * @param {object} uniforms
      */
@@ -212,7 +282,17 @@ export class MultiCanvasBridge {
     }
 
     /**
-     * Set per-layer uniform overrides (e.g. layerOpacity, densityMult).
+     * Alias for setSharedUniforms when using relationship graph mode.
+     * Makes intent clearer — these are the keystone's parameters.
+     *
+     * @param {object} uniforms - Keystone parameters to derive other layers from
+     */
+    setKeystoneUniforms(uniforms) {
+        this._sharedUniforms = uniforms;
+    }
+
+    /**
+     * Set per-layer uniform overrides. Applied after relationship resolution.
      *
      * @param {string} layerName
      * @param {object} uniforms
@@ -223,7 +303,8 @@ export class MultiCanvasBridge {
     }
 
     /**
-     * Update the layer configuration.
+     * Update the legacy layer configuration.
+     * @deprecated Use setLayerRelationship() instead.
      *
      * @param {string} layerName
      * @param {object} config - Partial config update
@@ -236,15 +317,38 @@ export class MultiCanvasBridge {
     /**
      * Build the merged uniform set for a specific layer.
      *
-     * Priority: shared < layer config < layer overrides
+     * When a relationship graph is active:
+     *   1. Shared uniforms are treated as keystone parameters
+     *   2. The graph resolves derived parameters for the layer
+     *   3. Per-layer overrides are applied on top
+     *
+     * Legacy fallback (no graph):
+     *   Priority: shared < layer config < layer overrides
      *
      * @param {string} layerName
      * @returns {object}
      */
     _buildLayerUniforms(layerName) {
-        const config = this._layerConfig.get(layerName) || {};
         const overrides = this._layerUniforms.get(layerName) || {};
 
+        if (this._relationshipGraph) {
+            // Relationship graph mode: resolve layer params from keystone
+            const resolved = this._relationshipGraph.resolve(
+                this._sharedUniforms,
+                layerName,
+                this._frameTime
+            );
+
+            // Map relationship output to shader uniforms
+            return {
+                ...resolved,
+                u_layerOpacity: resolved.layerOpacity || resolved.u_layerOpacity || 1.0,
+                ...overrides
+            };
+        }
+
+        // Legacy mode: static multipliers
+        const config = this._layerConfig.get(layerName) || {};
         return {
             ...this._sharedUniforms,
             u_layerScale: config.layerScale || 1.0,
@@ -260,15 +364,31 @@ export class MultiCanvasBridge {
     // ========================================================================
 
     /**
-     * Render all layers in order using the named shader.
+     * Render all layers in order.
+     *
+     * When a relationship graph is active, each layer may use a different shader
+     * as assigned by graph.setLayerShader(). The shaderName parameter serves as
+     * the default for layers without an explicit shader assignment.
      *
-     * @param {string} shaderName - Shader program to use
+     * @param {string} shaderName - Default shader program to use
      * @param {object} [options]
      * @param {number[]} [options.clearColor] - RGBA clear color
+     * @param {number} [options.time] - Frame time for relationship resolution
      */
     renderAll(shaderName, options = {}) {
+        if (options.time !== undefined) {
+            this._frameTime = options.time;
+        } else {
+            this._frameTime += 16; // ~60fps fallback
+        }
+
         for (const layerName of this.layerNames) {
-            this.renderLayer(layerName, shaderName, options);
+            // Per-layer shader from relationship graph, or default
+            const layerShader = (this._relationshipGraph
+                ? this._relationshipGraph.getLayerShader(layerName)
+                : null) || shaderName;
+
+            this.renderLayer(layerName, layerShader, options);
         }
     }
 
@@ -334,7 +454,10 @@ export class MultiCanvasBridge {
         this._sharedUniforms = {};
         this._initialized = false;
         this._backendType = null;
+        this._relationshipGraph = null;
+        this._frameTime = 0;
     }
 }
 
+export { DEFAULT_LAYER_CONFIG, LAYER_ORDER };
 export default MultiCanvasBridge;

package/src/render/index.js

@@ -119,6 +119,31 @@ export {
     MultiCanvasBridge
 } from './MultiCanvasBridge.js';
 
+// Layer relationship graph (keystone-driven inter-layer parameter system)
+export {
+    LayerRelationshipGraph,
+    LAYER_ORDER,
+    PROFILES,
+    PRESET_REGISTRY,
+    echo,
+    mirror,
+    complement,
+    harmonic,
+    reactive,
+    chase
+} from './LayerRelationshipGraph.js';
+
+// Layer preset manager (save/load/tune relationship presets)
+export {
+    LayerPresetManager
+} from './LayerPresetManager.js';
+
+// Layer reactivity bridge (audio/tilt/input → relationship modulation)
+export {
+    LayerReactivityBridge,
+    MODULATION_PROFILES
+} from './LayerReactivityBridge.js';
+
 /**
  * Create a complete rendering context
  * @param {HTMLCanvasElement} canvas
@@ -129,8 +154,7 @@ export function createRenderContext(canvas, options = {}) {
     if (options.backend === 'webgpu') {
         return null;
     }
-    const { createWebGLBackend } = require('./backends/WebGLBackend.js');
-    const backend = createWebGLBackend(canvas, options);
+    const backend = _createWebGLBackend(canvas, options);
 
     if (!backend) {
         return null;
@@ -365,3 +389,4 @@ import { RenderState } from './RenderState.js';
 import { ShaderProgram, ShaderLib } from './ShaderProgram.js';
 import { UnifiedRenderBridge } from './UnifiedRenderBridge.js';
 import { createWebGPUBackend } from './backends/WebGPUBackend.js';
+import { createWebGLBackend as _createWebGLBackend } from './backends/WebGLBackend.js';

package/src/scene/index.js

@@ -60,10 +60,10 @@ export function createSceneContext(options = {}) {
         poolInitialSize = 100
     } = options;
 
-    const scene = new (require('./Scene4D.js').Scene4D)(sceneName);
-    const resources = new (require('./ResourceManager.js').ResourceManager)();
-    const disposal = new (require('./Disposable.js').DisposalManager)();
-    const poolManager = new (require('./MemoryPool.js').PoolManager)();
+    const scene = new Scene4D(sceneName);
+    const resources = new ResourceManager();
+    const disposal = new DisposalManager();
+    const poolManager = new PoolManager();
 
     resources.memoryLimit = memoryLimit;
 

package/src/testing/ParallelTestFramework.js

@@ -151,8 +151,8 @@ export class ParallelTestFramework {
         // Create system instance based on type
         switch (testSpec.system) {
             case 'faceted':
-                const { VIB34DIntegratedEngine } = await import('../core/Engine.js');
-                testSystem = new VIB34DIntegratedEngine();
+                const { VIB3Engine } = await import('../core/VIB3Engine.js');
+                testSystem = new VIB3Engine();
                 break;
             case 'quantum':
                 const { QuantumEngine } = await import('../quantum/QuantumEngine.js');

package/src/viewer/GalleryUI.js

@@ -749,6 +749,23 @@ export class GalleryUI extends EventEmitter {
         this.render();
     }
 
+    /**
+     * Handle search input
+     */
+    _onSearch(event) {
+        this.searchQuery = event.target.value;
+        this._applyFilters();
+        this.render();
+    }
+
+    /**
+     * Handle page change
+     */
+    _onPageChange(page) {
+        this.currentPage = page;
+        this.render();
+    }
+
     /**
      * Handle variation hover
      */

package/src/viewer/ViewerPortal.js

@@ -185,14 +185,14 @@ export class ViewerPortal extends EventEmitter {
 
     captureFrame(format = 'png', quality = 0.92) {
         if (!this.canvas) return null;
-        return this.canvas.toDataURL(\`image/\${format}\`, quality);
+        return this.canvas.toDataURL(`image/${format}`, quality);
     }
 
     downloadFrame(filename = 'vib3-capture', format = 'png') {
         const dataUrl = this.captureFrame(format);
         if (!dataUrl) return;
         const link = document.createElement('a');
-        link.download = \`\${filename}.\${format}\`;
+        link.download = `${filename}.${format}`;
         link.href = dataUrl;
         link.click();
     }

package/types/adaptive-sdk.d.ts

@@ -5,14 +5,20 @@
  * Barrel re-export for all typed modules.
  *
  * Typed modules:
- *   - core/VIB3Engine (engine, systems, parameters, state)
- *   - core/ErrorReporter (opt-in error capture)
- *   - reactivity (ReactivityManager, ReactivityConfig, all input types)
- *   - reactivity/SpatialInputSystem (universal spatial input)
+ *   - core (VIB3Engine, CanvasManager, ParameterManager, ParameterMapper, VitalitySystem, RendererContracts, UnifiedResourceManager)
+ *   - math (constants, projections, rotations, Vec4)
+ *   - geometry (GeometryLibrary, generators, BufferBuilder)
+ *   - systems (QuantumEngine, FacetedSystem, RealHolographicSystem)
+ *   - scene (ObjectPool, TypedArrayPool, Vec4Pool, PoolManager)
+ *   - viewer (ViewerPortal, ViewerInputHandler, GalleryUI, CardBending, AudioReactivity, TradingCardExporter)
+ *   - variations (VariationManager)
+ *   - reactivity (ReactivityManager, ReactivityConfig, SpatialInputSystem)
  *   - render (WebGL/WebGPU backends, ShaderProgram, RenderState, CommandBuffer)
- *   - creative (ColorPresets, TransitionAnimator, PostProcessing, Timeline)
+ *   - creative (ColorPresets, TransitionAnimator, PostProcessing, Timeline, AestheticMapper, ChoreographyPlayer)
  *   - integrations (React, Vue, Svelte, Figma, Three.js, TouchDesigner, OBS)
  *   - advanced (WebXR, WebGPU Compute, MIDI, AI Presets, OffscreenWorker)
+ *   - export (ExportManager, ShaderExporter, VIB3PackageExporter, TradingCardGenerator)
+ *   - agent (MCPServer, AgentCLI, TelemetryService)
  */
 
 // Core engine
@@ -99,6 +105,37 @@ export {
     Shader4DOptions
 } from './render/index';
 
+// Layer relationship system
+export {
+    LayerRelationshipGraph,
+    RelationshipFn,
+    RelationshipPreset,
+    RelationshipConfig,
+    LayerRelationshipProfile,
+    LayerRelationshipExport,
+    LAYER_ORDER as RENDER_LAYER_ORDER,
+    PRESET_REGISTRY,
+    PROFILES
+} from './render/LayerRelationshipGraph';
+
+// Layer preset manager
+export {
+    LayerPresetManager,
+    LayerPreset,
+    PresetMetadata,
+    PresetLibrary,
+    PresetManagerOptions
+} from './render/LayerPresetManager';
+
+// Layer reactivity bridge
+export {
+    LayerReactivityBridge,
+    ModulationMapping,
+    InputState as LayerInputState,
+    ReactivityBridgeConfig,
+    MODULATION_PROFILES
+} from './render/LayerReactivityBridge';
+
 // Creative tooling
 export {
     ColorPresetsSystem,
@@ -183,3 +220,165 @@ export {
     WorkerSwitchMessage,
     WorkerResizeMessage
 } from './advanced/index';
+
+// Export system
+export {
+    ExportManager,
+    ShaderExporter,
+    VIB3PackageExporter,
+    TradingCardGenerator,
+    TradingCardManager,
+    CardGeneratorBase,
+    FacetedCardGenerator,
+    QuantumCardGenerator,
+    HolographicCardGenerator,
+    TradingCardSystemFaceted,
+    TradingCardSystemHolographic,
+    TradingCardSystemQuantum,
+    VIB3_PACKAGE_VERSION,
+    exportSVG,
+    downloadSVG,
+    exportCSS,
+    downloadCSS,
+    toStyleObject,
+    exportLottie,
+    downloadLottie,
+    createVIB3Package
+} from './export/index';
+
+// Core - expanded types (CanvasManager, Parameters, RendererContracts, etc.)
+export {
+    CanvasManager,
+    CanvasLayer,
+    ParameterManager,
+    ParameterDef,
+    VIB3Parameters,
+    ParameterConfiguration,
+    ParameterMapper,
+    MappableSystem,
+    VitalitySystem,
+    RendererContract,
+    RendererContractAdapter,
+    ResourceManagerContract,
+    FrameState,
+    UnifiedResourceManager
+} from './core/index';
+
+// Math - constants, projections, rotations, Vec4
+export {
+    PI, TAU, HALF_PI, QUARTER_PI,
+    DEG_TO_RAD, RAD_TO_DEG,
+    EPSILON,
+    PHI, PHI_INV,
+    PLANE_NAMES as ROTATION_PLANE_NAMES,
+    encodeGeometry,
+    decodeGeometry,
+    toRadians,
+    toDegrees,
+    clamp,
+    lerp,
+    smoothstep,
+    smootherstep,
+    perspectiveProject4D,
+    stereographicProject4D,
+    ProjectionResult,
+    createRotationMatrix4D,
+    identityMatrix4x4,
+    multiplyMatrix4x4,
+    transposeMatrix4x4,
+    applyMatrix4x4,
+    vectorLength4D,
+    normalizeVector4D,
+    normalizeRotationAngles,
+    composeRotationMatrixFromAngles,
+    RotationPlane,
+    Matrix4x4,
+    Vector4D,
+    Vec4
+} from './math/index';
+
+// Geometry - library, generators, buffers
+export {
+    GeometryLibrary,
+    Geometry4D,
+    VariationParameters,
+    GeometryBuffers,
+    buildVertexBuffer,
+    buildEdgeIndexBuffer,
+    buildFaceIndexBuffer,
+    buildGeometryBuffers,
+    generateTesseract,
+    generateSphere,
+    generateTorus
+} from './geometry/index';
+
+// Visualization systems
+export {
+    QuantumEngine,
+    QuantumEngineOptions,
+    FacetedSystem,
+    FacetedSystemOptions,
+    RealHolographicSystem,
+    HolographicSystemOptions,
+    CanvasSet,
+    AudioData,
+    RenderMode
+} from './systems/index';
+
+// Scene - memory pools
+export {
+    ObjectPool,
+    TypedArrayPool,
+    Vec4Pool,
+    Mat4x4Pool,
+    PoolManager,
+    pools,
+    PoolStats,
+    ObjectPoolOptions
+} from './scene/index';
+
+// Viewer - portal, input, gallery, cards
+export {
+    ViewerPortal,
+    ViewerInputHandler,
+    GalleryUI,
+    CardBending,
+    AudioReactivity as ViewerAudioReactivity,
+    TradingCardExporter,
+    PortalMode,
+    RotationState,
+    InputSource,
+    InputPreset,
+    GalleryViewMode,
+    BendPreset,
+    FrameStyle,
+    RarityLevel
+} from './viewer/index';
+
+// Variations
+export {
+    VariationManager,
+    VariationSlot,
+    VariationOptions
+} from './variations/index';
+
+// Agent system
+export {
+    MCPServer,
+    mcpServer,
+    toolDefinitions,
+    AgentCLI,
+    BatchExecutor,
+    CommandType,
+    ResponseStatus,
+    TelemetryService,
+    TelemetrySpan,
+    EventType,
+    telemetry,
+    EventStreamServer,
+    EventStreamClient,
+    PrometheusExporter,
+    JSONExporter,
+    NDJSONExporter,
+    ConsoleExporter
+} from './agent/index';