@nexart/codemode-sdk 1.0.1 → 1.1.1

package/dist/soundart-sketches/isoflow.js

@@ -0,0 +1,60 @@
+export const ISOFLOW_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const cx = width / 2;
+  const cy = height / 2;
+  const maxRadius = min(width, height) * 0.6;
+  const layers = 3;
+  const burstsPerLayer = Math.floor(map(S.rhythmicity, 0, 100, 20, 40));
+
+  noFill();
+
+  for (let l = 0; l < layers; l++) {
+    const hue = map(l === 0 ? S.bass : (l === 1 ? S.brightness : S.treble), 0, 100, 0, 360);
+    const alpha = map(l === 0 ? S.volume : (l === 1 ? S.aggression : S.dynamicRange), 0, 100, 0.7, 1);
+    const sat = 85 + random() * 15;
+    
+    stroke('hsla(' + hue + ',' + sat + '%,95%,' + alpha + ')');
+    strokeWeight(map(S.volume + l * 10, 0, 130, 1.2, 4.8));
+    
+    const radiusScale = map(S.dynamicRange + l * 20, 0, 150, 0.8, 1.4);
+    const noiseAmp = map(S.aggression, 0, 100, 0.5, 3.0);
+    const swirl = map(S.treble + l * 20, 0, 150, 0.3, 1.5);
+    const rotSkew = map(S.harmonicity, 0, 100, -0.5, 0.5);
+    const deformSkew = map(S.attack, 0, 100, -PI * 0.4, PI * 0.4);
+    const centerJitter = map(S.bass, 0, 100, -60, 60);
+
+    for (let b = 0; b < burstsPerLayer; b++) {
+      const baseAngle = map(b + l * burstsPerLayer, 0, layers * burstsPerLayer, 0, PI * 2);
+      const burstCount = Math.floor(map(S.volume + S.rhythmicity, 0, 200, 30, 90));
+      
+      for (let j = 0; j < burstCount; j++) {
+        const angle = baseAngle + map(j, 0, burstCount, -0.02, 0.02);
+        const ox = cx + cos(angle) * centerJitter;
+        const oy = cy + sin(angle) * centerJitter;
+        
+        beginShape();
+        for (let r0 = 0; r0 < maxRadius * radiusScale; r0 += 3) {
+          const normR = r0 / maxRadius;
+          const n = noise(cos(angle + rotSkew) * normR * noiseAmp, sin(angle + swirl) * normR * noiseAmp);
+          const deform = map(n, 0, 1, -PI * swirl, PI * swirl) + deformSkew;
+          const px = ox + cos(angle + deform) * r0;
+          const py = oy + sin(angle + deform) * r0;
+          vertex(px, py);
+        }
+        endShape();
+      }
+    }
+  }
+}
+`;
+export default ISOFLOW_SKETCH;

package/dist/soundart-sketches/loomWeave.d.ts

@@ -0,0 +1,3 @@
+export declare const LOOM_WEAVE_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const threadsX = Math.round(map(S.rhythmicity, 0, 100, 4, 22));\n  const threadsY = Math.round(map(S.volume, 0, 100, 4, 22));\n  const margin = map(S.dynamicRange, 0, 100, 80, 220);\n  const threadW = map(S.amplitude, 0, 100, 8, 26);\n  const noiseFreq = map(S.harmonicity, 0, 100, 0.012, 0.035);\n  const noiseAmp = map(S.aggression, 0, 100, 8, 38);\n  const hueBase = map(S.hue, 0, 100, 0, 360);\n  const warpHue = hueBase;\n  const weftHue = (hueBase + 180) % 360;\n  const brightness = map(S.brightness, 0, 100, 45, 75);\n  const chroma = map(S.chroma, 0, 100, 70, 95);\n  const alphaVal = map(S.attack, 0, 100, 0.8, 1.0);\n\n  noStroke();\n\n  for (let i = 0; i < threadsX; i++) {\n    const xBase = margin + (width - 2 * margin) * (i / max(1, threadsX - 1));\n    fill('hsla(' + warpHue + ',' + chroma + '%,' + brightness + '%,' + alphaVal + ')');\n    beginShape();\n    for (let y = 0; y <= height; y += 16) {\n      const dx = map(noise(i * 0.25, y * noiseFreq), 0, 1, -noiseAmp, noiseAmp);\n      vertex(xBase + dx - threadW / 2, y);\n    }\n    for (let y = height; y >= 0; y -= 16) {\n      const dx = map(noise(i * 0.37, y * noiseFreq + 200), 0, 1, -noiseAmp, noiseAmp);\n      vertex(xBase + dx + threadW / 2, y);\n    }\n    endShape(CLOSE);\n  }\n\n  for (let j = 0; j < threadsY; j++) {\n    const yBase = margin + (height - 2 * margin) * (j / max(1, threadsY - 1));\n    fill('hsla(' + weftHue + ',' + chroma + '%,' + brightness + '%,' + alphaVal + ')');\n    beginShape();\n    for (let x = 0; x <= width; x += 16) {\n      const dy = map(noise(j * 0.25, x * noiseFreq), 0, 1, -noiseAmp, noiseAmp);\n      vertex(x, yBase + dy - threadW / 2);\n    }\n    for (let x = width; x >= 0; x -= 16) {\n      const dy = map(noise(j * 0.37, x * noiseFreq + 200), 0, 1, -noiseAmp, noiseAmp);\n      vertex(x, yBase + dy + threadW / 2);\n    }\n    endShape(CLOSE);\n  }\n}\n";
+export default LOOM_WEAVE_SKETCH;
+//# sourceMappingURL=loomWeave.d.ts.map

package/dist/soundart-sketches/loomWeave.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loomWeave.d.ts","sourceRoot":"","sources":["../../soundart-sketches/loomWeave.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB,0wEAyD7B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/soundart-sketches/loomWeave.js

@@ -0,0 +1,59 @@
+export const LOOM_WEAVE_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const threadsX = Math.round(map(S.rhythmicity, 0, 100, 4, 22));
+  const threadsY = Math.round(map(S.volume, 0, 100, 4, 22));
+  const margin = map(S.dynamicRange, 0, 100, 80, 220);
+  const threadW = map(S.amplitude, 0, 100, 8, 26);
+  const noiseFreq = map(S.harmonicity, 0, 100, 0.012, 0.035);
+  const noiseAmp = map(S.aggression, 0, 100, 8, 38);
+  const hueBase = map(S.hue, 0, 100, 0, 360);
+  const warpHue = hueBase;
+  const weftHue = (hueBase + 180) % 360;
+  const brightness = map(S.brightness, 0, 100, 45, 75);
+  const chroma = map(S.chroma, 0, 100, 70, 95);
+  const alphaVal = map(S.attack, 0, 100, 0.8, 1.0);
+
+  noStroke();
+
+  for (let i = 0; i < threadsX; i++) {
+    const xBase = margin + (width - 2 * margin) * (i / max(1, threadsX - 1));
+    fill('hsla(' + warpHue + ',' + chroma + '%,' + brightness + '%,' + alphaVal + ')');
+    beginShape();
+    for (let y = 0; y <= height; y += 16) {
+      const dx = map(noise(i * 0.25, y * noiseFreq), 0, 1, -noiseAmp, noiseAmp);
+      vertex(xBase + dx - threadW / 2, y);
+    }
+    for (let y = height; y >= 0; y -= 16) {
+      const dx = map(noise(i * 0.37, y * noiseFreq + 200), 0, 1, -noiseAmp, noiseAmp);
+      vertex(xBase + dx + threadW / 2, y);
+    }
+    endShape(CLOSE);
+  }
+
+  for (let j = 0; j < threadsY; j++) {
+    const yBase = margin + (height - 2 * margin) * (j / max(1, threadsY - 1));
+    fill('hsla(' + weftHue + ',' + chroma + '%,' + brightness + '%,' + alphaVal + ')');
+    beginShape();
+    for (let x = 0; x <= width; x += 16) {
+      const dy = map(noise(j * 0.25, x * noiseFreq), 0, 1, -noiseAmp, noiseAmp);
+      vertex(x, yBase + dy - threadW / 2);
+    }
+    for (let x = width; x >= 0; x -= 16) {
+      const dy = map(noise(j * 0.37, x * noiseFreq + 200), 0, 1, -noiseAmp, noiseAmp);
+      vertex(x, yBase + dy + threadW / 2);
+    }
+    endShape(CLOSE);
+  }
+}
+`;
+export default LOOM_WEAVE_SKETCH;

package/dist/soundart-sketches/noiseTerraces.d.ts

@@ -0,0 +1,3 @@
+export declare const NOISE_TERRACES_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const levels = Math.floor(map(S.harmonicity, 0, 100, 6, 16));\n  const res = Math.floor(map(S.brightness, 0, 100, 3, 10));\n\n  const mainHue = (S.brightness * 3.6) % 360;\n  const palette = [];\n  for (let i = 0; i < 16; i++) {\n    const h = (mainHue + i * 22.5) % 360;\n    const sat = map(S.treble, 0, 100, 60, 90);\n    const bri = map(S.bass, 0, 100, 70, 95);\n    palette.push([h, sat, bri]);\n  }\n\n  noStroke();\n\n  for (let lvl = 0; lvl < levels; lvl++) {\n    const iso = lvl / levels;\n    const [h, sat, bri] = palette[lvl % palette.length];\n    const satBoost = map(S.treble, 0, 100, 1.0, 1.4);\n    const alpha = lerp(0.95, 0.5, iso) * map(S.volume, 0, 100, 0.5, 1.0);\n    \n    fill(hslColor(h, constrain(sat * satBoost, 0, 100), bri, alpha));\n    \n    const scale = 0.012 + lvl * 0.0025;\n    for (let x = 0; x < width; x += res) {\n      for (let y = 0; y < height; y += res) {\n        if (noise(x * scale, y * scale) > iso * map(S.rhythmicity, 0, 100, 3.4, 8.3)) {\n          const rw = res * (0.9 + random() * 0.3);\n          const rh = res * (0.9 + random() * 0.3);\n          rect(x, y, rw, rh);\n        }\n      }\n    }\n  }\n}\n\nfunction hslColor(h, s, l, a) {\n  if (a !== undefined) return 'hsla(' + h + ',' + s + '%,' + l + '%,' + a + ')';\n  return 'hsl(' + h + ',' + s + '%,' + l + '%)';\n}\n";
+export default NOISE_TERRACES_SKETCH;
+//# sourceMappingURL=noiseTerraces.d.ts.map

package/dist/soundart-sketches/noiseTerraces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"noiseTerraces.d.ts","sourceRoot":"","sources":["../../soundart-sketches/noiseTerraces.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,qBAAqB,muDAmDjC,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/soundart-sketches/noiseTerraces.js

@@ -0,0 +1,53 @@
+export const NOISE_TERRACES_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const levels = Math.floor(map(S.harmonicity, 0, 100, 6, 16));
+  const res = Math.floor(map(S.brightness, 0, 100, 3, 10));
+
+  const mainHue = (S.brightness * 3.6) % 360;
+  const palette = [];
+  for (let i = 0; i < 16; i++) {
+    const h = (mainHue + i * 22.5) % 360;
+    const sat = map(S.treble, 0, 100, 60, 90);
+    const bri = map(S.bass, 0, 100, 70, 95);
+    palette.push([h, sat, bri]);
+  }
+
+  noStroke();
+
+  for (let lvl = 0; lvl < levels; lvl++) {
+    const iso = lvl / levels;
+    const [h, sat, bri] = palette[lvl % palette.length];
+    const satBoost = map(S.treble, 0, 100, 1.0, 1.4);
+    const alpha = lerp(0.95, 0.5, iso) * map(S.volume, 0, 100, 0.5, 1.0);
+    
+    fill(hslColor(h, constrain(sat * satBoost, 0, 100), bri, alpha));
+    
+    const scale = 0.012 + lvl * 0.0025;
+    for (let x = 0; x < width; x += res) {
+      for (let y = 0; y < height; y += res) {
+        if (noise(x * scale, y * scale) > iso * map(S.rhythmicity, 0, 100, 3.4, 8.3)) {
+          const rw = res * (0.9 + random() * 0.3);
+          const rh = res * (0.9 + random() * 0.3);
+          rect(x, y, rw, rh);
+        }
+      }
+    }
+  }
+}
+
+function hslColor(h, s, l, a) {
+  if (a !== undefined) return 'hsla(' + h + ',' + s + '%,' + l + '%,' + a + ')';
+  return 'hsl(' + h + ',' + s + '%,' + l + '%)';
+}
+`;
+export default NOISE_TERRACES_SKETCH;

package/dist/soundart-sketches/orb.d.ts

@@ -0,0 +1,3 @@
+export declare const ORB_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const cx = width / 2 + map(S.dynamicRange, 0, 100, -150, 150);\n  const cy = height / 2 + map(S.rhythmicity, 0, 100, -100, 100);\n  const baseRadius = map(S.length, 0, 100, 240, 1200);\n  const steps = Math.round(map(S.rhythmicity, 0, 100, 280, 400));\n  const baseHue = map(S.hue, 0, 100, 0, 360);\n  const hue1 = baseHue;\n  const hue2 = (baseHue + map(S.attack, 0, 100, 80, 180)) % 360;\n\n  noStroke();\n\n  for (let i = steps; i > 0; i--) {\n    const pct = i / steps;\n    const r = baseRadius * pct * map(S.aggression, 0, 100, 0.92, 1.06);\n    const t = pow(pct, map(S.brightness, 0, 100, 1.8, 2.8));\n    const h = (lerp(hue1, hue2, t) + pct * map(S.harmonicity, 0, 100, -15, 15) + sin(pct * PI * 3) * map(S.brightness, 0, 100, -12, 12)) % 360;\n    const sat = constrain(70 + map(S.treble, 0, 100, -20, 20), 0, 100);\n    const bri = constrain(lerp(90, 30, t) + map(S.brightness, 0, 100, -6, 4), 0, 100);\n    const alpha = (map(pct, 1, 0, 18, 70) + sin(i * 0.15) * map(S.treble, 0, 100, 1, 4)) * map(S.volume, 0, 100, 0.8, 1.1) * 1.2;\n    \n    fill(hslColor(h, sat, bri, constrain(alpha / 100, 0, 1)));\n    \n    const rx = r * map(S.aggression, 0, 100, 0.9, 1.05);\n    const ry = r * map(S.aggression, 0, 100, 0.9, 1.05);\n    const angle = pct * PI * map(S.rhythmicity, 0, 100, 2, 4);\n    const wobbleAmp = map(S.aggression, 0, 100, 10, 40);\n    const wobbleX = sin(angle) * wobbleAmp;\n    const wobbleY = cos(angle) * wobbleAmp;\n    \n    ellipse(cx + wobbleX, cy + wobbleY, rx * 2, ry * 2);\n  }\n}\n\nfunction hslColor(h, s, l, a) {\n  if (a !== undefined) return 'hsla(' + h + ',' + s + '%,' + l + '%,' + a + ')';\n  return 'hsl(' + h + ',' + s + '%,' + l + '%)';\n}\n";
+export default ORB_SKETCH;
+//# sourceMappingURL=orb.d.ts.map

package/dist/soundart-sketches/orb.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"orb.d.ts","sourceRoot":"","sources":["../../soundart-sketches/orb.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,4kEAgDtB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/soundart-sketches/orb.js

@@ -0,0 +1,50 @@
+export const ORB_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const cx = width / 2 + map(S.dynamicRange, 0, 100, -150, 150);
+  const cy = height / 2 + map(S.rhythmicity, 0, 100, -100, 100);
+  const baseRadius = map(S.length, 0, 100, 240, 1200);
+  const steps = Math.round(map(S.rhythmicity, 0, 100, 280, 400));
+  const baseHue = map(S.hue, 0, 100, 0, 360);
+  const hue1 = baseHue;
+  const hue2 = (baseHue + map(S.attack, 0, 100, 80, 180)) % 360;
+
+  noStroke();
+
+  for (let i = steps; i > 0; i--) {
+    const pct = i / steps;
+    const r = baseRadius * pct * map(S.aggression, 0, 100, 0.92, 1.06);
+    const t = pow(pct, map(S.brightness, 0, 100, 1.8, 2.8));
+    const h = (lerp(hue1, hue2, t) + pct * map(S.harmonicity, 0, 100, -15, 15) + sin(pct * PI * 3) * map(S.brightness, 0, 100, -12, 12)) % 360;
+    const sat = constrain(70 + map(S.treble, 0, 100, -20, 20), 0, 100);
+    const bri = constrain(lerp(90, 30, t) + map(S.brightness, 0, 100, -6, 4), 0, 100);
+    const alpha = (map(pct, 1, 0, 18, 70) + sin(i * 0.15) * map(S.treble, 0, 100, 1, 4)) * map(S.volume, 0, 100, 0.8, 1.1) * 1.2;
+    
+    fill(hslColor(h, sat, bri, constrain(alpha / 100, 0, 1)));
+    
+    const rx = r * map(S.aggression, 0, 100, 0.9, 1.05);
+    const ry = r * map(S.aggression, 0, 100, 0.9, 1.05);
+    const angle = pct * PI * map(S.rhythmicity, 0, 100, 2, 4);
+    const wobbleAmp = map(S.aggression, 0, 100, 10, 40);
+    const wobbleX = sin(angle) * wobbleAmp;
+    const wobbleY = cos(angle) * wobbleAmp;
+    
+    ellipse(cx + wobbleX, cy + wobbleY, rx * 2, ry * 2);
+  }
+}
+
+function hslColor(h, s, l, a) {
+  if (a !== undefined) return 'hsla(' + h + ',' + s + '%,' + l + '%,' + a + ')';
+  return 'hsl(' + h + ',' + s + '%,' + l + '%)';
+}
+`;
+export default ORB_SKETCH;

package/dist/soundart-sketches/pixelGlyphs.d.ts

@@ -0,0 +1,3 @@
+export declare const PIXEL_GLYPHS_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const cols = Math.floor(map(S.length, 0, 100, 2, 18));\n  const rows = Math.floor(map(S.length, 0, 100, 3, 24));\n  const density = map(S.volume, 0, 100, 0.25, 0.6);\n  const jitter = map(S.attack, 0, 100, 0, 0.25);\n  const sparkRate = map(S.treble, 0, 100, 0.05, 0.45);\n  const invertRate = map(S.dynamicRange, 0, 100, 0.05, 0.35);\n\n  const margin = 140, gutter = 20, glyphRes = 7;\n  const P = [[11,16,38],[255,51,102],[0,224,255],[255,209,102],[124,255,178],[138,43,226]];\n  const cellW = (width - margin*2 - gutter*(cols - 1)) / cols;\n  const cellH = (height - margin*2 - gutter*(rows - 1)) / rows;\n  if (cellW <= 0 || cellH <= 0) return;\n\n  noStroke();\n\n  for (let gy = 0; gy < rows; gy++) {\n    for (let gx = 0; gx < cols; gx++) {\n      const cx = margin + gx * (cellW + gutter);\n      const cy = margin + gy * (cellH + gutter);\n      const invert = noise(gx * 0.4, gy * 0.3) < invertRate;\n      const baseA = map(S.amplitude, 0, 100, 0.8, 1.0);\n      const rndVal = noise(gx * 0.5, gy * 0.7);\n      const baseIdx = 1 + Math.floor(rndVal * 5);\n      const accentIdx = 1 + Math.floor(noise(gx + 3.3, gy + 4.4) * 5);\n      const baseCol = invert ? [240, 245, 255] : P[baseIdx];\n      const accCol = invert ? P[baseIdx] : P[accentIdx];\n\n      const px = Math.floor((cellW * 0.84) / glyphRes);\n      const py = Math.floor((cellH * 0.84) / glyphRes);\n      const gw = px * glyphRes, gh = py * glyphRes;\n      const ox = cx + Math.floor((cellW - gw) * 0.5);\n      const oy = cy + Math.floor((cellH - gh) * 0.5);\n\n      for (let j = 0; j < glyphRes; j++) {\n        for (let i = 0; i < Math.ceil(glyphRes / 2); i++) {\n          const pNoise = noise(gx * 0.51 + i * 0.19, gy * 0.47 + j * 0.21);\n          const p = density + (pNoise - 0.5) * 0.35;\n          if (random() < constrain(p, 0.05, 0.9)) {\n            const jx = Math.floor((random() - 0.5) * jitter * px);\n            const jy = Math.floor((random() - 0.5) * jitter * py);\n            const x0 = ox + i * px + jx;\n            const y0 = oy + j * py + jy;\n            \n            fill(baseCol[0], baseCol[1], baseCol[2], baseA * 255);\n            rect(x0, y0, px, py);\n            const mi = glyphRes - 1 - i;\n            rect(ox + mi * px - jx, y0, px, py);\n            \n            if (random() < sparkRate) {\n              fill(accCol[0], accCol[1], accCol[2], baseA * 255);\n              rect(x0 + px * 0.2, y0 + py * 0.2, px * 0.6, py * 0.6);\n            }\n          }\n        }\n      }\n    }\n  }\n}\n";
+export default PIXEL_GLYPHS_SKETCH;
+//# sourceMappingURL=pixelGlyphs.d.ts.map

package/dist/soundart-sketches/pixelGlyphs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pixelGlyphs.d.ts","sourceRoot":"","sources":["../../soundart-sketches/pixelGlyphs.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB,m4FAsE/B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/soundart-sketches/pixelGlyphs.js

@@ -0,0 +1,72 @@
+export const PIXEL_GLYPHS_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const cols = Math.floor(map(S.length, 0, 100, 2, 18));
+  const rows = Math.floor(map(S.length, 0, 100, 3, 24));
+  const density = map(S.volume, 0, 100, 0.25, 0.6);
+  const jitter = map(S.attack, 0, 100, 0, 0.25);
+  const sparkRate = map(S.treble, 0, 100, 0.05, 0.45);
+  const invertRate = map(S.dynamicRange, 0, 100, 0.05, 0.35);
+
+  const margin = 140, gutter = 20, glyphRes = 7;
+  const P = [[11,16,38],[255,51,102],[0,224,255],[255,209,102],[124,255,178],[138,43,226]];
+  const cellW = (width - margin*2 - gutter*(cols - 1)) / cols;
+  const cellH = (height - margin*2 - gutter*(rows - 1)) / rows;
+  if (cellW <= 0 || cellH <= 0) return;
+
+  noStroke();
+
+  for (let gy = 0; gy < rows; gy++) {
+    for (let gx = 0; gx < cols; gx++) {
+      const cx = margin + gx * (cellW + gutter);
+      const cy = margin + gy * (cellH + gutter);
+      const invert = noise(gx * 0.4, gy * 0.3) < invertRate;
+      const baseA = map(S.amplitude, 0, 100, 0.8, 1.0);
+      const rndVal = noise(gx * 0.5, gy * 0.7);
+      const baseIdx = 1 + Math.floor(rndVal * 5);
+      const accentIdx = 1 + Math.floor(noise(gx + 3.3, gy + 4.4) * 5);
+      const baseCol = invert ? [240, 245, 255] : P[baseIdx];
+      const accCol = invert ? P[baseIdx] : P[accentIdx];
+
+      const px = Math.floor((cellW * 0.84) / glyphRes);
+      const py = Math.floor((cellH * 0.84) / glyphRes);
+      const gw = px * glyphRes, gh = py * glyphRes;
+      const ox = cx + Math.floor((cellW - gw) * 0.5);
+      const oy = cy + Math.floor((cellH - gh) * 0.5);
+
+      for (let j = 0; j < glyphRes; j++) {
+        for (let i = 0; i < Math.ceil(glyphRes / 2); i++) {
+          const pNoise = noise(gx * 0.51 + i * 0.19, gy * 0.47 + j * 0.21);
+          const p = density + (pNoise - 0.5) * 0.35;
+          if (random() < constrain(p, 0.05, 0.9)) {
+            const jx = Math.floor((random() - 0.5) * jitter * px);
+            const jy = Math.floor((random() - 0.5) * jitter * py);
+            const x0 = ox + i * px + jx;
+            const y0 = oy + j * py + jy;
+            
+            fill(baseCol[0], baseCol[1], baseCol[2], baseA * 255);
+            rect(x0, y0, px, py);
+            const mi = glyphRes - 1 - i;
+            rect(ox + mi * px - jx, y0, px, py);
+            
+            if (random() < sparkRate) {
+              fill(accCol[0], accCol[1], accCol[2], baseA * 255);
+              rect(x0 + px * 0.2, y0 + py * 0.2, px * 0.6, py * 0.6);
+            }
+          }
+        }
+      }
+    }
+  }
+}
+`;
+export default PIXEL_GLYPHS_SKETCH;

package/dist/soundart-sketches/prismFlowFields.d.ts

@@ -0,0 +1,3 @@
+export declare const PRISM_FLOW_FIELDS_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const particleCount = Math.floor(map(S.volume, 0, 100, 1500, 8200));\n  const maxSteps = Math.floor(map(S.rhythmicity, 0, 100, 200, 680));\n  const weightMin = map(S.volume, 0, 100, 0.5, 1.8);\n  const weightMax = map(S.treble, 0, 100, 1.2, 3.2);\n  const angleMult = map(max(0, S.harmonicity - 5), 0, 95, 2.5, 7.0);\n  const stepJitter = map(S.aggression, 0, 100, 0.5, 2.5);\n  const skewOffset = map(S.hue, 0, 100, -PI / 6, PI / 6);\n  const alphaBase = map(S.brightness, 0, 100, 0.4, 0.7);\n  const scaleF = map(S.harmonicity, 0, 100, 0.0001, 0.0024);\n\n  noFill();\n\n  for (let i = 0; i < particleCount; i++) {\n    let x = random() * width;\n    let y = random() * height;\n    const hueShift = (i / particleCount) * 360 + (S.hue * 3.6);\n    const h = hueShift % 360;\n    const sat = map(S.aggression, 0, 100, 70, 100);\n    const bri = map(S.brightness, 0, 100, 60, 100);\n    \n    stroke('hsla(' + h + ',' + sat + '%,' + bri + '%,' + alphaBase + ')');\n    strokeWeight(map(random(), 0, 1, weightMin, weightMax));\n    \n    beginShape();\n    vertex(x, y);\n    for (let j = 0; j < maxSteps; j++) {\n      const angle = noise(x * scaleF, y * scaleF) * PI * 4 + skewOffset;\n      const dx = cos(angle) * (angleMult + (random() - 0.5) * stepJitter);\n      const dy = sin(angle) * (angleMult + (random() - 0.5) * stepJitter);\n      x += dx;\n      y += dy;\n      if (x < 0 || x > width || y < 0 || y > height) break;\n      vertex(x, y);\n    }\n    endShape();\n  }\n}\n";
+export default PRISM_FLOW_FIELDS_SKETCH;
+//# sourceMappingURL=prismFlowFields.d.ts.map

package/dist/soundart-sketches/prismFlowFields.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prismFlowFields.d.ts","sourceRoot":"","sources":["../../soundart-sketches/prismFlowFields.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,wBAAwB,43DAiDpC,CAAC;AAEF,eAAe,wBAAwB,CAAC"}

package/dist/soundart-sketches/prismFlowFields.js

@@ -0,0 +1,51 @@
+export const PRISM_FLOW_FIELDS_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const particleCount = Math.floor(map(S.volume, 0, 100, 1500, 8200));
+  const maxSteps = Math.floor(map(S.rhythmicity, 0, 100, 200, 680));
+  const weightMin = map(S.volume, 0, 100, 0.5, 1.8);
+  const weightMax = map(S.treble, 0, 100, 1.2, 3.2);
+  const angleMult = map(max(0, S.harmonicity - 5), 0, 95, 2.5, 7.0);
+  const stepJitter = map(S.aggression, 0, 100, 0.5, 2.5);
+  const skewOffset = map(S.hue, 0, 100, -PI / 6, PI / 6);
+  const alphaBase = map(S.brightness, 0, 100, 0.4, 0.7);
+  const scaleF = map(S.harmonicity, 0, 100, 0.0001, 0.0024);
+
+  noFill();
+
+  for (let i = 0; i < particleCount; i++) {
+    let x = random() * width;
+    let y = random() * height;
+    const hueShift = (i / particleCount) * 360 + (S.hue * 3.6);
+    const h = hueShift % 360;
+    const sat = map(S.aggression, 0, 100, 70, 100);
+    const bri = map(S.brightness, 0, 100, 60, 100);
+    
+    stroke('hsla(' + h + ',' + sat + '%,' + bri + '%,' + alphaBase + ')');
+    strokeWeight(map(random(), 0, 1, weightMin, weightMax));
+    
+    beginShape();
+    vertex(x, y);
+    for (let j = 0; j < maxSteps; j++) {
+      const angle = noise(x * scaleF, y * scaleF) * PI * 4 + skewOffset;
+      const dx = cos(angle) * (angleMult + (random() - 0.5) * stepJitter);
+      const dy = sin(angle) * (angleMult + (random() - 0.5) * stepJitter);
+      x += dx;
+      y += dy;
+      if (x < 0 || x > width || y < 0 || y > height) break;
+      vertex(x, y);
+    }
+    endShape();
+  }
+}
+`;
+export default PRISM_FLOW_FIELDS_SKETCH;

package/dist/soundart-sketches/radialBurst.d.ts

@@ -0,0 +1,3 @@
+export declare const RADIAL_BURST_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const centerX = width / 2;\n  const centerY = height / 2;\n  const baseN = Math.floor(map(S.rhythmicity, 0, 100, 90, 320));\n  const rhythmMask = 0.4 + (S.rhythmicity / 100) * 0.6;\n\n  const palette = [];\n  const mainHue = (S.brightness * 3.6) % 360;\n  for (let i = 0; i < 16; i++) {\n    const h = (mainHue + i * 22.5) % 360;\n    const sat = map(S.treble, 0, 100, 60, 90);\n    const bri = map(S.bass, 0, 100, 70, 95);\n    palette.push('hsl(' + h + ',' + sat + '%,' + bri + '%)');\n  }\n\n  noFill();\n\n  for (let i = 0; i < baseN; i++) {\n    if ((i % 3) && random() > rhythmMask) continue;\n\n    const angle = (i / baseN) * PI * 2;\n    const col = palette[i % palette.length];\n\n    const lenJit = map(S.dynamicRange, 0, 100, 0, height * 2.45);\n    const rayLength = (S.amplitude / 100) * (height * 1.65) + random() * lenJit;\n\n    const waveAmp = map(S.harmonicity, 0, 100, 0, 42);\n    const waveFreq = map(S.treble, 0, 100, 1, 48);\n    const segments = 28;\n\n    const thickness = 1.2 + (S.attack / 100) * 7 + (S.aggression / 100) * 5 + sin(i * 0.9) * 1.4;\n\n    stroke(col);\n    strokeWeight(thickness);\n\n    beginShape();\n    for (let s = 0; s <= segments; s++) {\n      const t = s / segments;\n      const radius = t * rayLength;\n      const wobble = sin(t * PI * waveFreq + i * 0.2) * waveAmp * (1 - t);\n      const wx = centerX + cos(angle + wobble * 0.01) * radius;\n      const wy = centerY + sin(angle + wobble * 0.01) * radius;\n      vertex(wx, wy);\n    }\n    endShape();\n  }\n}\n";
+export default RADIAL_BURST_SKETCH;
+//# sourceMappingURL=radialBurst.d.ts.map

package/dist/soundart-sketches/radialBurst.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radialBurst.d.ts","sourceRoot":"","sources":["../../soundart-sketches/radialBurst.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB,+5DA0D/B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/soundart-sketches/radialBurst.js

@@ -0,0 +1,60 @@
+export const RADIAL_BURST_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const centerX = width / 2;
+  const centerY = height / 2;
+  const baseN = Math.floor(map(S.rhythmicity, 0, 100, 90, 320));
+  const rhythmMask = 0.4 + (S.rhythmicity / 100) * 0.6;
+
+  const palette = [];
+  const mainHue = (S.brightness * 3.6) % 360;
+  for (let i = 0; i < 16; i++) {
+    const h = (mainHue + i * 22.5) % 360;
+    const sat = map(S.treble, 0, 100, 60, 90);
+    const bri = map(S.bass, 0, 100, 70, 95);
+    palette.push('hsl(' + h + ',' + sat + '%,' + bri + '%)');
+  }
+
+  noFill();
+
+  for (let i = 0; i < baseN; i++) {
+    if ((i % 3) && random() > rhythmMask) continue;
+
+    const angle = (i / baseN) * PI * 2;
+    const col = palette[i % palette.length];
+
+    const lenJit = map(S.dynamicRange, 0, 100, 0, height * 2.45);
+    const rayLength = (S.amplitude / 100) * (height * 1.65) + random() * lenJit;
+
+    const waveAmp = map(S.harmonicity, 0, 100, 0, 42);
+    const waveFreq = map(S.treble, 0, 100, 1, 48);
+    const segments = 28;
+
+    const thickness = 1.2 + (S.attack / 100) * 7 + (S.aggression / 100) * 5 + sin(i * 0.9) * 1.4;
+
+    stroke(col);
+    strokeWeight(thickness);
+
+    beginShape();
+    for (let s = 0; s <= segments; s++) {
+      const t = s / segments;
+      const radius = t * rayLength;
+      const wobble = sin(t * PI * waveFreq + i * 0.2) * waveAmp * (1 - t);
+      const wx = centerX + cos(angle + wobble * 0.01) * radius;
+      const wy = centerY + sin(angle + wobble * 0.01) * radius;
+      vertex(wx, wy);
+    }
+    endShape();
+  }
+}
+`;
+export default RADIAL_BURST_SKETCH;

package/dist/soundart-sketches/resonantSoundBodies.d.ts

@@ -0,0 +1,3 @@
+export declare const RESONANT_SOUND_BODIES_SKETCH = "\nfunction setup() {\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  if (bgMode === 'white') background(245, 245, 245);\n  else if (bgMode === 'black') background(10, 10, 10);\n  else {\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n\n  const cx = width / 2;\n  const cy = height / 2;\n  const maxR = min(width, height) * 0.45;\n  const shapeSeed = S.bass * 17.3 + S.treble * 23.7 + S.rhythmicity * 11.1;\n\n  const numBodies = Math.floor(8 + (S.volume / 100) * 12 + (S.bass / 100) * 8);\n  \n  noFill();\n\n  for (let i = 0; i < numBodies; i++) {\n    const t = i / numBodies;\n    const radius = maxR * (0.15 + t * 0.85);\n    \n    const hue = (((S.hue / 100) + t * 0.3 + (S.harmonicity / 100) * 0.2) % 1) * 360;\n    const sat = lerp(50, 80, S.brightness / 100);\n    const lum = lerp(30, 60, S.brightness / 100);\n    \n    const alpha = lerp(0.4, 0.15, t) * (0.5 + (S.volume / 100) * 0.5);\n    stroke('hsla(' + hue + ',' + sat + '%,' + lum + '%,' + alpha + ')');\n    strokeWeight(lerp(3, 1, t) * (1 + (S.aggression / 100) * 2));\n    \n    beginShape();\n    const points = Math.floor(64 + (S.aggression / 100) * 64);\n    \n    for (let j = 0; j <= points; j++) {\n      const angle = (j / points) * PI * 2;\n      \n      const wobble = noise(\n        cos(angle) * 3 + i * 0.5 + shapeSeed * 0.001,\n        sin(angle) * 3 + i * 0.5\n      );\n      \n      const bassWobble = sin(angle * (2 + Math.floor((S.bass / 100) * 6))) * (S.bass / 100) * 0.15;\n      const trebleWobble = sin(angle * (8 + Math.floor((S.treble / 100) * 12))) * (S.treble / 100) * 0.08;\n      \n      const r = radius * (1 + (wobble - 0.5) * 0.3 * (S.aggression / 100) + bassWobble + trebleWobble);\n      \n      const x = cx + cos(angle) * r;\n      const y = cy + sin(angle) * r;\n      \n      vertex(x, y);\n    }\n    endShape(CLOSE);\n    \n    if (i % 3 === 0) {\n      const fillAlpha = alpha * 0.1;\n      fill('hsla(' + hue + ',' + sat + '%,' + lum + '%,' + fillAlpha + ')');\n      beginShape();\n      for (let j = 0; j <= points; j++) {\n        const angle = (j / points) * PI * 2;\n        const wobble = noise(cos(angle) * 3 + i * 0.5 + shapeSeed * 0.001, sin(angle) * 3 + i * 0.5);\n        const bodyR = radius * (1 + (wobble - 0.5) * 0.3 * (S.aggression / 100));\n        vertex(cx + cos(angle) * bodyR, cy + sin(angle) * bodyR);\n      }\n      endShape(CLOSE);\n      noFill();\n    }\n  }\n\n  const numNodes = Math.floor(12 + (S.rhythmicity / 100) * 20);\n  for (let i = 0; i < numNodes; i++) {\n    const angle = (i / numNodes) * PI * 2 + shapeSeed * 0.001;\n    const dist = maxR * (0.3 + noise(i * 0.1, shapeSeed * 0.001) * 0.6);\n    \n    const x = cx + cos(angle) * dist;\n    const y = cy + sin(angle) * dist;\n    \n    const nodeSize = lerp(2, 8, S.volume / 100) * (1 + (S.bass / 100) * 2);\n    const hue = ((((S.hue / 100) + i * 0.05 + (S.treble / 100) * 0.3) % 1)) * 360;\n    \n    fill('hsla(' + hue + ',70%,' + lerp(40, 70, S.brightness / 100) + '%,' + lerp(0.3, 0.7, S.harmonicity / 100) + ')');\n    noStroke();\n    ellipse(x, y, nodeSize * 2, nodeSize * 2);\n  }\n}\n";
+export default RESONANT_SOUND_BODIES_SKETCH;
+//# sourceMappingURL=resonantSoundBodies.d.ts.map

package/dist/soundart-sketches/resonantSoundBodies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resonantSoundBodies.d.ts","sourceRoot":"","sources":["../../soundart-sketches/resonantSoundBodies.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,4BAA4B,wtGAuFxC,CAAC;AAEF,eAAe,4BAA4B,CAAC"}

package/dist/soundart-sketches/resonantSoundBodies.js

@@ -0,0 +1,89 @@
+export const RESONANT_SOUND_BODIES_SKETCH = `
+function setup() {
+  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';
+  if (bgMode === 'white') background(245, 245, 245);
+  else if (bgMode === 'black') background(10, 10, 10);
+  else {
+    const r = Math.floor((S.brightness / 100) * 255);
+    const g = Math.floor((S.rhythmicity / 100) * 255);
+    const b = Math.floor((S.harmonicity / 100) * 255);
+    background(r, g, b);
+  }
+
+  const cx = width / 2;
+  const cy = height / 2;
+  const maxR = min(width, height) * 0.45;
+  const shapeSeed = S.bass * 17.3 + S.treble * 23.7 + S.rhythmicity * 11.1;
+
+  const numBodies = Math.floor(8 + (S.volume / 100) * 12 + (S.bass / 100) * 8);
+  
+  noFill();
+
+  for (let i = 0; i < numBodies; i++) {
+    const t = i / numBodies;
+    const radius = maxR * (0.15 + t * 0.85);
+    
+    const hue = (((S.hue / 100) + t * 0.3 + (S.harmonicity / 100) * 0.2) % 1) * 360;
+    const sat = lerp(50, 80, S.brightness / 100);
+    const lum = lerp(30, 60, S.brightness / 100);
+    
+    const alpha = lerp(0.4, 0.15, t) * (0.5 + (S.volume / 100) * 0.5);
+    stroke('hsla(' + hue + ',' + sat + '%,' + lum + '%,' + alpha + ')');
+    strokeWeight(lerp(3, 1, t) * (1 + (S.aggression / 100) * 2));
+    
+    beginShape();
+    const points = Math.floor(64 + (S.aggression / 100) * 64);
+    
+    for (let j = 0; j <= points; j++) {
+      const angle = (j / points) * PI * 2;
+      
+      const wobble = noise(
+        cos(angle) * 3 + i * 0.5 + shapeSeed * 0.001,
+        sin(angle) * 3 + i * 0.5
+      );
+      
+      const bassWobble = sin(angle * (2 + Math.floor((S.bass / 100) * 6))) * (S.bass / 100) * 0.15;
+      const trebleWobble = sin(angle * (8 + Math.floor((S.treble / 100) * 12))) * (S.treble / 100) * 0.08;
+      
+      const r = radius * (1 + (wobble - 0.5) * 0.3 * (S.aggression / 100) + bassWobble + trebleWobble);
+      
+      const x = cx + cos(angle) * r;
+      const y = cy + sin(angle) * r;
+      
+      vertex(x, y);
+    }
+    endShape(CLOSE);
+    
+    if (i % 3 === 0) {
+      const fillAlpha = alpha * 0.1;
+      fill('hsla(' + hue + ',' + sat + '%,' + lum + '%,' + fillAlpha + ')');
+      beginShape();
+      for (let j = 0; j <= points; j++) {
+        const angle = (j / points) * PI * 2;
+        const wobble = noise(cos(angle) * 3 + i * 0.5 + shapeSeed * 0.001, sin(angle) * 3 + i * 0.5);
+        const bodyR = radius * (1 + (wobble - 0.5) * 0.3 * (S.aggression / 100));
+        vertex(cx + cos(angle) * bodyR, cy + sin(angle) * bodyR);
+      }
+      endShape(CLOSE);
+      noFill();
+    }
+  }
+
+  const numNodes = Math.floor(12 + (S.rhythmicity / 100) * 20);
+  for (let i = 0; i < numNodes; i++) {
+    const angle = (i / numNodes) * PI * 2 + shapeSeed * 0.001;
+    const dist = maxR * (0.3 + noise(i * 0.1, shapeSeed * 0.001) * 0.6);
+    
+    const x = cx + cos(angle) * dist;
+    const y = cy + sin(angle) * dist;
+    
+    const nodeSize = lerp(2, 8, S.volume / 100) * (1 + (S.bass / 100) * 2);
+    const hue = ((((S.hue / 100) + i * 0.05 + (S.treble / 100) * 0.3) % 1)) * 360;
+    
+    fill('hsla(' + hue + ',70%,' + lerp(40, 70, S.brightness / 100) + '%,' + lerp(0.3, 0.7, S.harmonicity / 100) + ')');
+    noStroke();
+    ellipse(x, y, nodeSize * 2, nodeSize * 2);
+  }
+}
+`;
+export default RESONANT_SOUND_BODIES_SKETCH;

package/dist/soundart-sketches/rings.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Flow Grid Rings - SoundArt Style as Code Mode Sketch
+ *
+ * This is the first SoundArt style converted to a Code Mode sketch.
+ * It uses S.* globals (sound snapshot) instead of direct sound data.
+ *
+ * Original: client/src/pages/soundart/engine/styles_impl.ts - drawFlowGridRings
+ */
+export declare const RINGS_SKETCH = "\n// Flow Grid Rings - SoundArt Style\n// Uses S.* sound globals and standard p5-like functions\n\nfunction setup() {\n  // Set background based on mode (rgb derived from sound, black, or white)\n  const bgMode = typeof backgroundMode !== 'undefined' ? backgroundMode : 'rgb';\n  \n  if (bgMode === 'white') {\n    background(245, 245, 245);\n  } else if (bgMode === 'black') {\n    background(10, 10, 10);\n  } else {\n    // Deterministic RGB background derived from sound snapshot\n    // Previously used clock time, now uses sound parameters for reproducibility\n    const r = Math.floor((S.brightness / 100) * 255);\n    const g = Math.floor((S.rhythmicity / 100) * 255);\n    const b = Math.floor((S.harmonicity / 100) * 255);\n    background(r, g, b);\n  }\n  \n  // Grid dimensions based on sound volume\n  const cols = Math.floor(map(S.volume, 0, 100, 2, 32));\n  const rows = Math.floor(cols * 1.5);\n  const margin = map(S.length, 0, 100, width * 0.05, width * 0.1);\n  const innerW = width - margin * 2;\n  const innerH = height - margin * 2;\n  const cellW = innerW / cols;\n  const cellH = innerH / rows;\n  const gap = Math.min(cellW, cellH) * 0.25;\n  const maxRadius = (Math.min(cellW, cellH) - gap) / 2;\n  \n  // Palette Harmony based on sound\n  const mainHue = (S.brightness * 3.6) % 360;\n  const hueShift = map(S.harmonicity, 0, 100, 20, 60);\n  const sat = map(S.treble, 0, 100, 60, 90);\n  const bri = map(S.bass, 0, 100, 70, 95);\n  \n  // Generate palette\n  const palette = [\n    hslColor(mainHue, sat, bri),\n    hslColor((mainHue + hueShift) % 360, sat - 10, bri + 5),\n    hslColor((mainHue - hueShift + 360) % 360, sat - 10, bri + 5),\n    hslColor((mainHue + 180) % 360, sat - 20, bri - 10),\n    hslColor((mainHue + 120) % 360, sat, bri - 5),\n    hslColor((mainHue + 240) % 360, sat, bri - 5),\n  ];\n  \n  // Flow field parameters\n  const noiseScale = 0.15;\n  const noiseStrength = map(S.aggression, 0, 100, 0.5, 4.0);\n  const jitter = map(S.rhythmicity, 0, 100, 0, 0.15);\n  const ringBias = map(S.attack, 0, 100, 0.85, 1.15);\n  \n  noStroke();\n  \n  // Render Grid\n  for (let gx = 0; gx < cols; gx++) {\n    for (let gy = 0; gy < rows; gy++) {\n      const cx = margin + gx * cellW + cellW / 2 + (random() - 0.5) * jitter * cellW;\n      const cy = margin + gy * cellH + cellH / 2 + (random() - 0.5) * jitter * cellH;\n      \n      const n = noise(gx * noiseScale, gy * noiseScale);\n      const angle = n * PI * 2 * noiseStrength;\n      const rings = Math.max(1, Math.floor(map(sin(angle), -1, 1, 1, 6)));\n      const step = (maxRadius / rings) * ringBias * 0.9;\n      \n      for (let i = rings; i > 0; i--) {\n        fill(palette[(rings - i) % palette.length]);\n        ellipse(cx, cy, i * step * 2, i * step * 2);\n      }\n    }\n  }\n}\n\n// Helper function for HSL colors\nfunction hslColor(h, s, l) {\n  return 'hsl(' + h + ',' + s + '%,' + l + '%)';\n}\n";
+export default RINGS_SKETCH;
+//# sourceMappingURL=rings.d.ts.map

package/dist/soundart-sketches/rings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rings.d.ts","sourceRoot":"","sources":["../../soundart-sketches/rings.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,eAAO,MAAM,YAAY,u2FA+ExB,CAAC;AAEF,eAAe,YAAY,CAAC"}