@shogo-ai/voice 1.9.13 → 2.4.1

package/dist/react/visuals.cjs

@@ -0,0 +1,1048 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/react/visuals.ts
+var visuals_exports = {};
+__export(visuals_exports, {
+  OrganicParticles: () => OrganicParticles,
+  OrganicSphere: () => OrganicSphere
+});
+module.exports = __toCommonJS(visuals_exports);
+
+// src/react/OrganicSphere.tsx
+var import_react = require("react");
+var THREE = __toESM(require("three"), 1);
+
+// src/react/shaders/organicSphereShaders.ts
+var PERLIN_4D = (
+  /* glsl */
+  `
+vec4 permute(vec4 x){return mod(((x*34.0)+1.0)*x, 289.0);}
+vec4 taylorInvSqrt(vec4 r){return 1.79284291400159 - 0.85373472095314 * r;}
+vec4 fade(vec4 t) {return t*t*t*(t*(t*6.0-15.0)+10.0);}
+
+float perlin4d(vec4 P){
+  vec4 Pi0 = floor(P);
+  vec4 Pi1 = Pi0 + 1.0;
+  Pi0 = mod(Pi0, 289.0);
+  Pi1 = mod(Pi1, 289.0);
+  vec4 Pf0 = fract(P);
+  vec4 Pf1 = Pf0 - 1.0;
+  vec4 ix = vec4(Pi0.x, Pi1.x, Pi0.x, Pi1.x);
+  vec4 iy = vec4(Pi0.yy, Pi1.yy);
+  vec4 iz0 = vec4(Pi0.zzzz);
+  vec4 iz1 = vec4(Pi1.zzzz);
+  vec4 iw0 = vec4(Pi0.wwww);
+  vec4 iw1 = vec4(Pi1.wwww);
+
+  vec4 ixy = permute(permute(ix) + iy);
+  vec4 ixy0 = permute(ixy + iz0);
+  vec4 ixy1 = permute(ixy + iz1);
+  vec4 ixy00 = permute(ixy0 + iw0);
+  vec4 ixy01 = permute(ixy0 + iw1);
+  vec4 ixy10 = permute(ixy1 + iw0);
+  vec4 ixy11 = permute(ixy1 + iw1);
+
+  vec4 gx00 = ixy00 / 7.0;
+  vec4 gy00 = floor(gx00) / 7.0;
+  vec4 gz00 = floor(gy00) / 6.0;
+  gx00 = fract(gx00) - 0.5;
+  gy00 = fract(gy00) - 0.5;
+  gz00 = fract(gz00) - 0.5;
+  vec4 gw00 = vec4(0.75) - abs(gx00) - abs(gy00) - abs(gz00);
+  vec4 sw00 = step(gw00, vec4(0.0));
+  gx00 -= sw00 * (step(0.0, gx00) - 0.5);
+  gy00 -= sw00 * (step(0.0, gy00) - 0.5);
+
+  vec4 gx01 = ixy01 / 7.0;
+  vec4 gy01 = floor(gx01) / 7.0;
+  vec4 gz01 = floor(gy01) / 6.0;
+  gx01 = fract(gx01) - 0.5;
+  gy01 = fract(gy01) - 0.5;
+  gz01 = fract(gz01) - 0.5;
+  vec4 gw01 = vec4(0.75) - abs(gx01) - abs(gy01) - abs(gz01);
+  vec4 sw01 = step(gw01, vec4(0.0));
+  gx01 -= sw01 * (step(0.0, gx01) - 0.5);
+  gy01 -= sw01 * (step(0.0, gy01) - 0.5);
+
+  vec4 gx10 = ixy10 / 7.0;
+  vec4 gy10 = floor(gx10) / 7.0;
+  vec4 gz10 = floor(gy10) / 6.0;
+  gx10 = fract(gx10) - 0.5;
+  gy10 = fract(gy10) - 0.5;
+  gz10 = fract(gz10) - 0.5;
+  vec4 gw10 = vec4(0.75) - abs(gx10) - abs(gy10) - abs(gz10);
+  vec4 sw10 = step(gw10, vec4(0.0));
+  gx10 -= sw10 * (step(0.0, gx10) - 0.5);
+  gy10 -= sw10 * (step(0.0, gy10) - 0.5);
+
+  vec4 gx11 = ixy11 / 7.0;
+  vec4 gy11 = floor(gx11) / 7.0;
+  vec4 gz11 = floor(gy11) / 6.0;
+  gx11 = fract(gx11) - 0.5;
+  gy11 = fract(gy11) - 0.5;
+  gz11 = fract(gz11) - 0.5;
+  vec4 gw11 = vec4(0.75) - abs(gx11) - abs(gy11) - abs(gz11);
+  vec4 sw11 = step(gw11, vec4(0.0));
+  gx11 -= sw11 * (step(0.0, gx11) - 0.5);
+  gy11 -= sw11 * (step(0.0, gy11) - 0.5);
+
+  vec4 g0000 = vec4(gx00.x,gy00.x,gz00.x,gw00.x);
+  vec4 g1000 = vec4(gx00.y,gy00.y,gz00.y,gw00.y);
+  vec4 g0100 = vec4(gx00.z,gy00.z,gz00.z,gw00.z);
+  vec4 g1100 = vec4(gx00.w,gy00.w,gz00.w,gw00.w);
+  vec4 g0010 = vec4(gx10.x,gy10.x,gz10.x,gw10.x);
+  vec4 g1010 = vec4(gx10.y,gy10.y,gz10.y,gw10.y);
+  vec4 g0110 = vec4(gx10.z,gy10.z,gz10.z,gw10.z);
+  vec4 g1110 = vec4(gx10.w,gy10.w,gz10.w,gw10.w);
+  vec4 g0001 = vec4(gx01.x,gy01.x,gz01.x,gw01.x);
+  vec4 g1001 = vec4(gx01.y,gy01.y,gz01.y,gw01.y);
+  vec4 g0101 = vec4(gx01.z,gy01.z,gz01.z,gw01.z);
+  vec4 g1101 = vec4(gx01.w,gy01.w,gz01.w,gw01.w);
+  vec4 g0011 = vec4(gx11.x,gy11.x,gz11.x,gw11.x);
+  vec4 g1011 = vec4(gx11.y,gy11.y,gz11.y,gw11.y);
+  vec4 g0111 = vec4(gx11.z,gy11.z,gz11.z,gw11.z);
+  vec4 g1111 = vec4(gx11.w,gy11.w,gz11.w,gw11.w);
+
+  vec4 norm00 = taylorInvSqrt(vec4(dot(g0000, g0000), dot(g0100, g0100), dot(g1000, g1000), dot(g1100, g1100)));
+  g0000 *= norm00.x; g0100 *= norm00.y; g1000 *= norm00.z; g1100 *= norm00.w;
+
+  vec4 norm01 = taylorInvSqrt(vec4(dot(g0001, g0001), dot(g0101, g0101), dot(g1001, g1001), dot(g1101, g1101)));
+  g0001 *= norm01.x; g0101 *= norm01.y; g1001 *= norm01.z; g1101 *= norm01.w;
+
+  vec4 norm10 = taylorInvSqrt(vec4(dot(g0010, g0010), dot(g0110, g0110), dot(g1010, g1010), dot(g1110, g1110)));
+  g0010 *= norm10.x; g0110 *= norm10.y; g1010 *= norm10.z; g1110 *= norm10.w;
+
+  vec4 norm11 = taylorInvSqrt(vec4(dot(g0011, g0011), dot(g0111, g0111), dot(g1011, g1011), dot(g1111, g1111)));
+  g0011 *= norm11.x; g0111 *= norm11.y; g1011 *= norm11.z; g1111 *= norm11.w;
+
+  float n0000 = dot(g0000, Pf0);
+  float n1000 = dot(g1000, vec4(Pf1.x, Pf0.yzw));
+  float n0100 = dot(g0100, vec4(Pf0.x, Pf1.y, Pf0.zw));
+  float n1100 = dot(g1100, vec4(Pf1.xy, Pf0.zw));
+  float n0010 = dot(g0010, vec4(Pf0.xy, Pf1.z, Pf0.w));
+  float n1010 = dot(g1010, vec4(Pf1.x, Pf0.y, Pf1.z, Pf0.w));
+  float n0110 = dot(g0110, vec4(Pf0.x, Pf1.yz, Pf0.w));
+  float n1110 = dot(g1110, vec4(Pf1.xyz, Pf0.w));
+  float n0001 = dot(g0001, vec4(Pf0.xyz, Pf1.w));
+  float n1001 = dot(g1001, vec4(Pf1.x, Pf0.yz, Pf1.w));
+  float n0101 = dot(g0101, vec4(Pf0.x, Pf1.y, Pf0.z, Pf1.w));
+  float n1101 = dot(g1101, vec4(Pf1.xy, Pf0.z, Pf1.w));
+  float n0011 = dot(g0011, vec4(Pf0.xy, Pf1.zw));
+  float n1011 = dot(g1011, vec4(Pf1.x, Pf0.y, Pf1.zw));
+  float n0111 = dot(g0111, vec4(Pf0.x, Pf1.yzw));
+  float n1111 = dot(g1111, Pf1);
+
+  vec4 fade_xyzw = fade(Pf0);
+  vec4 n_0w = mix(vec4(n0000, n1000, n0100, n1100), vec4(n0001, n1001, n0101, n1101), fade_xyzw.w);
+  vec4 n_1w = mix(vec4(n0010, n1010, n0110, n1110), vec4(n0011, n1011, n0111, n1111), fade_xyzw.w);
+  vec4 n_zw = mix(n_0w, n_1w, fade_xyzw.z);
+  vec2 n_yzw = mix(n_zw.xy, n_zw.zw, fade_xyzw.y);
+  float n_xyzw = mix(n_yzw.x, n_yzw.y, fade_xyzw.x);
+  return 2.2 * n_xyzw;
+}
+`
+);
+var ORGANIC_SPHERE_VERTEX_SHADER = (
+  /* glsl */
+  `
+#define M_PI 3.1415926535897932384626433832795
+
+uniform vec3 uLightAColor;
+uniform vec3 uLightAPosition;
+uniform float uLightAIntensity;
+uniform vec3 uLightBColor;
+uniform vec3 uLightBPosition;
+uniform float uLightBIntensity;
+
+uniform vec2 uSubdivision;
+
+uniform vec3 uOffset;
+
+uniform float uDistortionFrequency;
+uniform float uDistortionStrength;
+uniform float uDisplacementFrequency;
+uniform float uDisplacementStrength;
+
+uniform float uFresnelOffset;
+uniform float uFresnelMultiplier;
+uniform float uFresnelPower;
+
+uniform vec3  uRimColor;
+uniform float uRimThreshold;
+uniform float uRimPower;
+
+uniform float uTime;
+
+varying vec3 vColor;
+
+${PERLIN_4D}
+
+vec3 getDisplacedPosition(vec3 _position)
+{
+  vec3 distoredPosition = _position;
+  distoredPosition += perlin4d(vec4(distoredPosition * uDistortionFrequency + uOffset, uTime)) * uDistortionStrength;
+
+  float perlinStrength = perlin4d(vec4(distoredPosition * uDisplacementFrequency + uOffset, uTime));
+
+  vec3 displacedPosition = _position;
+  displacedPosition += normalize(_position) * perlinStrength * uDisplacementStrength;
+
+  return displacedPosition;
+}
+
+void main()
+{
+  vec3 displacedPosition = getDisplacedPosition(position);
+  vec4 viewPosition = viewMatrix * vec4(displacedPosition, 1.0);
+  gl_Position = projectionMatrix * viewPosition;
+
+  float distanceA = (M_PI * 2.0) / uSubdivision.x;
+  float distanceB = M_PI / uSubdivision.x;
+
+  vec3 biTangent = cross(normal, tangent.xyz);
+
+  vec3 positionA = position + tangent.xyz * distanceA;
+  vec3 displacedPositionA = getDisplacedPosition(positionA);
+
+  vec3 positionB = position + biTangent.xyz * distanceB;
+  vec3 displacedPositionB = getDisplacedPosition(positionB);
+
+  vec3 computedNormal = cross(displacedPositionA - displacedPosition.xyz, displacedPositionB - displacedPosition.xyz);
+  computedNormal = normalize(computedNormal);
+
+  vec3 viewDirection = normalize(displacedPosition.xyz - cameraPosition);
+  float fresnel = uFresnelOffset + (1.0 + dot(viewDirection, computedNormal)) * uFresnelMultiplier;
+  fresnel = pow(max(0.0, fresnel), uFresnelPower);
+
+  float lightAIntensity = max(0.0, - dot(computedNormal.xyz, normalize(- uLightAPosition))) * uLightAIntensity;
+  float lightBIntensity = max(0.0, - dot(computedNormal.xyz, normalize(- uLightBPosition))) * uLightBIntensity;
+
+  // Clamp mix factors to [0, 1] so a high lightIntensity*fresnel (common on
+  // displacement peaks and loud audio) cannot extrapolate past the orange
+  // light color and saturate R, producing yellow-white hotspots.
+  vec3 color = vec3(0.0);
+  color = mix(color, uLightAColor, clamp(lightAIntensity * fresnel, 0.0, 1.0));
+  color = mix(color, uLightBColor, clamp(lightBIntensity * fresnel, 0.0, 1.0));
+  color = mix(color, uRimColor, clamp(pow(max(0.0, fresnel - uRimThreshold), uRimPower), 0.0, 1.0));
+
+  vColor = color;
+}
+`
+);
+var ORGANIC_SPHERE_FRAGMENT_SHADER = (
+  /* glsl */
+  `
+varying vec3 vColor;
+
+void main()
+{
+  gl_FragColor = vec4(vColor, 1.0);
+}
+`
+);
+
+// src/react/sphereConfig.ts
+var DEFAULT_ORGANIC_SPHERE_CONFIG = {
+  // Lighting & rim
+  lightAColor: "#c2410c",
+  lightBColor: "#fb923c",
+  lightAIntensity: 2.13,
+  lightBIntensity: 1.61,
+  rimColor: null,
+  rimThreshold: 0.92,
+  rimPower: 5,
+  // Static shape
+  distortionFrequency: 1.5,
+  displacementFrequency: 2.12,
+  fresnelOffset: -1.609,
+  fresnelPower: 1.793,
+  // Audio reactivity
+  volume: {
+    idle: 0.152,
+    gain: 0.3,
+    floor: 0,
+    attack: 0.03,
+    decay: 2e-3
+  },
+  medium: {
+    idle: 3.587,
+    gain: 2,
+    floor: 3.587,
+    attack: 8e-3,
+    decay: 4e-3
+  },
+  high: {
+    idle: 0.65,
+    gain: 5,
+    floor: 0.5,
+    attack: 0.02,
+    decay: 1e-3
+  },
+  low: {
+    idle: 3e-4,
+    gain: 3e-3,
+    floor: 1e-4,
+    attack: 5e-3,
+    decay: 2e-3
+  },
+  // Camera
+  cameraZ: 3.84,
+  fov: 35,
+  // Determinism
+  seed: 0,
+  // Init-only
+  subdivisions: 512,
+  maxPixelRatio: null,
+  backgroundColor: null
+};
+function resolveOrganicSphereConfig(partial) {
+  const base = DEFAULT_ORGANIC_SPHERE_CONFIG;
+  if (!partial) return { ...base, volume: { ...base.volume }, medium: { ...base.medium }, high: { ...base.high }, low: { ...base.low } };
+  return {
+    ...base,
+    ...partial,
+    volume: { ...base.volume, ...partial.volume ?? {} },
+    medium: { ...base.medium, ...partial.medium ?? {} },
+    high: { ...base.high, ...partial.high ?? {} },
+    low: { ...base.low, ...partial.low ?? {} }
+  };
+}
+
+// src/react/OrganicSphere.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function seededUnit(seed, salt) {
+  const s = Math.sin((seed + salt * 7919) * 12.9898 + salt * 78.233) * 43758.5453;
+  return s - Math.floor(s);
+}
+function OrganicSphere({
+  getFrequencyData,
+  active = true,
+  config: configProp,
+  lightAColor,
+  lightBColor,
+  rimColor,
+  rimThreshold,
+  rimPower,
+  backgroundColor,
+  subdivisions,
+  maxPixelRatio,
+  className,
+  style
+}) {
+  const containerRef = (0, import_react.useRef)(null);
+  const resolvedConfig = (0, import_react.useMemo)(() => {
+    const base = resolveOrganicSphereConfig(configProp);
+    const overrides = {};
+    if (lightAColor !== void 0) overrides.lightAColor = lightAColor;
+    if (lightBColor !== void 0) overrides.lightBColor = lightBColor;
+    if (rimColor !== void 0) overrides.rimColor = rimColor;
+    if (rimThreshold !== void 0) overrides.rimThreshold = rimThreshold;
+    if (rimPower !== void 0) overrides.rimPower = rimPower;
+    if (backgroundColor !== void 0) overrides.backgroundColor = backgroundColor;
+    if (subdivisions !== void 0) overrides.subdivisions = subdivisions;
+    if (maxPixelRatio !== void 0) overrides.maxPixelRatio = maxPixelRatio;
+    return { ...base, ...overrides };
+  }, [
+    configProp,
+    lightAColor,
+    lightBColor,
+    rimColor,
+    rimThreshold,
+    rimPower,
+    backgroundColor,
+    subdivisions,
+    maxPixelRatio
+  ]);
+  const configRef = (0, import_react.useRef)(resolvedConfig);
+  (0, import_react.useEffect)(() => {
+    configRef.current = resolvedConfig;
+  }, [resolvedConfig]);
+  const getFrequencyDataRef = (0, import_react.useRef)(getFrequencyData);
+  const activeRef = (0, import_react.useRef)(active);
+  (0, import_react.useEffect)(() => {
+    getFrequencyDataRef.current = getFrequencyData;
+  }, [getFrequencyData]);
+  (0, import_react.useEffect)(() => {
+    activeRef.current = active;
+  }, [active]);
+  const initSubdivisions = resolvedConfig.subdivisions;
+  const initMaxPixelRatio = resolvedConfig.maxPixelRatio;
+  const initBackgroundColor = resolvedConfig.backgroundColor;
+  (0, import_react.useEffect)(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const cfg0 = configRef.current;
+    const width = container.clientWidth || 1;
+    const height = container.clientHeight || 1;
+    const pixelRatio = Math.min(
+      initMaxPixelRatio ?? (typeof window !== "undefined" ? window.devicePixelRatio : 1),
+      2
+    );
+    const scene = new THREE.Scene();
+    if (initBackgroundColor) scene.background = new THREE.Color(initBackgroundColor);
+    const camera = new THREE.PerspectiveCamera(cfg0.fov, width / height, 0.1, 100);
+    camera.position.set(0, 0, cfg0.cameraZ);
+    scene.add(camera);
+    const renderer = new THREE.WebGLRenderer({
+      antialias: true,
+      alpha: initBackgroundColor === null,
+      powerPreference: "high-performance"
+    });
+    renderer.setSize(width, height, false);
+    renderer.setPixelRatio(pixelRatio);
+    renderer.setClearColor(0, initBackgroundColor === null ? 0 : 1);
+    container.appendChild(renderer.domElement);
+    renderer.domElement.style.display = "block";
+    renderer.domElement.style.width = "100%";
+    renderer.domElement.style.height = "100%";
+    const geometry = new THREE.SphereGeometry(1, initSubdivisions, initSubdivisions);
+    geometry.computeTangents();
+    const lightAPos = new THREE.Vector3().setFromSpherical(
+      new THREE.Spherical(1, 0.615, 2.049)
+    );
+    const lightBPos = new THREE.Vector3().setFromSpherical(
+      new THREE.Spherical(1, 2.561, -1.844)
+    );
+    const lightAColorObj = new THREE.Color(cfg0.lightAColor);
+    const lightBColorObj = new THREE.Color(cfg0.lightBColor);
+    const rimColorObj = new THREE.Color(cfg0.rimColor ?? cfg0.lightBColor);
+    const material = new THREE.ShaderMaterial({
+      uniforms: {
+        uLightAColor: { value: lightAColorObj },
+        uLightAPosition: { value: lightAPos },
+        uLightAIntensity: { value: cfg0.lightAIntensity },
+        uLightBColor: { value: lightBColorObj },
+        uLightBPosition: { value: lightBPos },
+        uLightBIntensity: { value: cfg0.lightBIntensity },
+        uSubdivision: {
+          value: new THREE.Vector2(initSubdivisions, initSubdivisions)
+        },
+        uOffset: { value: new THREE.Vector3() },
+        uDistortionFrequency: { value: cfg0.distortionFrequency },
+        uDistortionStrength: { value: cfg0.high.idle },
+        uDisplacementFrequency: { value: cfg0.displacementFrequency },
+        uDisplacementStrength: { value: cfg0.volume.idle },
+        uFresnelOffset: { value: cfg0.fresnelOffset },
+        uFresnelMultiplier: { value: cfg0.medium.idle },
+        uFresnelPower: { value: cfg0.fresnelPower },
+        uRimColor: { value: rimColorObj },
+        uRimThreshold: { value: cfg0.rimThreshold },
+        uRimPower: { value: cfg0.rimPower },
+        uTime: { value: 0 }
+      },
+      defines: { USE_TANGENT: "" },
+      vertexShader: ORGANIC_SPHERE_VERTEX_SHADER,
+      fragmentShader: ORGANIC_SPHERE_FRAGMENT_SHADER
+    });
+    const mesh = new THREE.Mesh(geometry, material);
+    scene.add(mesh);
+    const seedInitialPhase = (seed) => ({
+      phi: seededUnit(seed, 1) * Math.PI,
+      theta: seededUnit(seed, 2) * Math.PI * 2
+    });
+    const initialPhase = seedInitialPhase(cfg0.seed);
+    const offsetSpherical = new THREE.Spherical(1, initialPhase.phi, initialPhase.theta);
+    const offsetDirection = new THREE.Vector3().setFromSpherical(offsetSpherical);
+    const variations = {
+      volume: { target: 0, current: cfg0.volume.idle },
+      medium: { target: 0, current: cfg0.medium.idle },
+      high: { target: 0, current: cfg0.high.idle },
+      low: { target: 0, current: cfg0.low.idle }
+    };
+    const resetAnimationState = (cfg) => {
+      material.uniforms.uTime.value = 0;
+      material.uniforms.uOffset.value.set(0, 0, 0);
+      const phase = seedInitialPhase(cfg.seed);
+      offsetSpherical.radius = 1;
+      offsetSpherical.phi = phase.phi;
+      offsetSpherical.theta = phase.theta;
+      variations.volume.current = cfg.volume.idle;
+      variations.medium.current = cfg.medium.idle;
+      variations.high.current = cfg.high.idle;
+      variations.low.current = cfg.low.idle;
+      variations.volume.target = cfg.volume.idle;
+      variations.medium.target = cfg.medium.idle;
+      variations.high.target = cfg.high.idle;
+      variations.low.target = cfg.low.idle;
+    };
+    const LEVEL_COUNT = 8;
+    function computeLevels(buf) {
+      const bins = Math.floor(buf.length / LEVEL_COUNT);
+      const levels = new Array(LEVEL_COUNT).fill(0);
+      if (bins <= 0) return levels;
+      for (let i = 0; i < LEVEL_COUNT; i++) {
+        let sum = 0;
+        for (let j = 0; j < bins; j++) sum += buf[i * bins + j];
+        levels[i] = sum / bins / 256;
+      }
+      return levels;
+    }
+    function bandTarget(reactivity, levels, sourceLevel) {
+      if (!levels) return reactivity.idle;
+      return Math.max(reactivity.floor, reactivity.floor + sourceLevel * reactivity.gain);
+    }
+    let rafId = 0;
+    let lastTs = performance.now();
+    let disposed = false;
+    let wasActive = activeRef.current;
+    let lastSeed = cfg0.seed;
+    const render = () => {
+      if (disposed) return;
+      const now = performance.now();
+      const delta = Math.min(now - lastTs, 100);
+      lastTs = now;
+      const cfg = configRef.current;
+      lightAColorObj.set(cfg.lightAColor);
+      lightBColorObj.set(cfg.lightBColor);
+      rimColorObj.set(cfg.rimColor ?? cfg.lightBColor);
+      material.uniforms.uLightAIntensity.value = cfg.lightAIntensity;
+      material.uniforms.uLightBIntensity.value = cfg.lightBIntensity;
+      material.uniforms.uDistortionFrequency.value = cfg.distortionFrequency;
+      material.uniforms.uDisplacementFrequency.value = cfg.displacementFrequency;
+      material.uniforms.uFresnelOffset.value = cfg.fresnelOffset;
+      material.uniforms.uFresnelPower.value = cfg.fresnelPower;
+      material.uniforms.uRimThreshold.value = cfg.rimThreshold;
+      material.uniforms.uRimPower.value = cfg.rimPower;
+      if (camera.position.z !== cfg.cameraZ) camera.position.z = cfg.cameraZ;
+      if (camera.fov !== cfg.fov) {
+        camera.fov = cfg.fov;
+        camera.updateProjectionMatrix();
+      }
+      const isActive = activeRef.current;
+      if (isActive && !wasActive || cfg.seed !== lastSeed) {
+        resetAnimationState(cfg);
+        lastSeed = cfg.seed;
+      }
+      wasActive = isActive;
+      if (isActive) {
+        let levels = null;
+        if (getFrequencyDataRef.current) {
+          try {
+            const buf = getFrequencyDataRef.current();
+            if (buf && buf.length > 0) levels = computeLevels(buf);
+          } catch {
+            levels = null;
+          }
+        }
+        const l0 = levels ? levels[0] || 0 : 0;
+        const l1 = levels ? levels[1] || 0 : 0;
+        const l2 = levels ? levels[2] || 0 : 0;
+        const loudest = Math.max(l0, l1, l2);
+        const update = (variation, reactivity, sourceLevel) => {
+          variation.target = bandTarget(reactivity, levels, sourceLevel);
+          const easing = variation.target > variation.current ? reactivity.attack : reactivity.decay;
+          variation.current += (variation.target - variation.current) * easing * delta;
+        };
+        update(variations.volume, cfg.volume, loudest);
+        update(variations.medium, cfg.medium, l1);
+        update(variations.high, cfg.high, l2);
+        update(variations.low, cfg.low, l0);
+        const timeFrequency = variations.low.current;
+        const elapsed = delta * timeFrequency;
+        material.uniforms.uDisplacementStrength.value = variations.volume.current;
+        material.uniforms.uDistortionStrength.value = variations.high.current;
+        material.uniforms.uFresnelMultiplier.value = variations.medium.current;
+        const offsetTime = (material.uniforms.uTime.value + elapsed) * 0.3;
+        offsetSpherical.phi = (Math.sin(offsetTime * 1e-3) * Math.sin(offsetTime * 321e-5) * 0.5 + 0.5) * Math.PI;
+        offsetSpherical.theta = (Math.sin(offsetTime * 1e-4) * Math.sin(offsetTime * 321e-6) * 0.5 + 0.5) * Math.PI * 2;
+        offsetDirection.setFromSpherical(offsetSpherical);
+        offsetDirection.multiplyScalar(timeFrequency * 2);
+        material.uniforms.uOffset.value.add(offsetDirection);
+        material.uniforms.uTime.value += elapsed;
+      }
+      renderer.render(scene, camera);
+      rafId = requestAnimationFrame(render);
+    };
+    rafId = requestAnimationFrame(render);
+    const resizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(() => {
+      const w = container.clientWidth || 1;
+      const h = container.clientHeight || 1;
+      camera.aspect = w / h;
+      camera.updateProjectionMatrix();
+      renderer.setSize(w, h, false);
+    }) : null;
+    resizeObserver?.observe(container);
+    return () => {
+      disposed = true;
+      cancelAnimationFrame(rafId);
+      resizeObserver?.disconnect();
+      geometry.dispose();
+      material.dispose();
+      renderer.dispose();
+      if (renderer.domElement.parentNode === container) {
+        container.removeChild(renderer.domElement);
+      }
+    };
+  }, [initSubdivisions, initMaxPixelRatio, initBackgroundColor]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: containerRef, className, style });
+}
+
+// src/react/OrganicParticles.tsx
+var import_react2 = require("react");
+var THREE2 = __toESM(require("three"), 1);
+
+// src/react/shaders/organicParticlesShaders.ts
+var ORGANIC_PARTICLES_VERTEX_SHADER = (
+  /* glsl */
+  `
+${PERLIN_4D}
+
+attribute vec3 aBasePosition;
+attribute float aSeed;
+
+uniform float uTime;
+uniform float uNoiseFrequency;
+uniform float uNoiseStrength;
+uniform float uDisplacement;
+uniform float uSwirl;
+uniform float uSwirlTimeRate;
+uniform float uSizeBase;
+uniform float uSizeAudio;
+uniform float uPixelRatio;
+
+varying float vHeat;
+varying float vSeed;
+
+void main() {
+  vec3 pos = aBasePosition;
+
+  // 4D Perlin sampled in particle space. The 4th axis is time so the
+  // cloud evolves over time without tiling.
+  float n = perlin4d(vec4(pos * uNoiseFrequency, uTime));
+
+  // Per-particle phase so the cloud doesn't breathe in lockstep.
+  float phaseShift = (aSeed - 0.5) * 0.5;
+  float breath = sin(uTime * 0.0008 + aSeed * 6.2831) * 0.5 + 0.5;
+
+  // Outward push: noise + audio-driven displacement, scaled by seed so
+  // some particles dart further than others on the same beat.
+  vec3 radial = normalize(pos);
+  float push = n * uNoiseStrength + uDisplacement * (0.6 + aSeed * 0.8) + breath * 0.05;
+  pos += radial * push;
+
+  // Twist around Y. Amount scales with height so the cloud spirals
+  // rather than rigid-rotating. uSwirlTimeRate is 0 by default so the
+  // swirl is driven by audio (uSwirl) alone; crank it for a constant
+  // drift.
+  float swirlAngle = pos.y * uSwirl + uTime * uSwirlTimeRate + phaseShift;
+  float c = cos(swirlAngle);
+  float s = sin(swirlAngle);
+  pos.xz = mat2(c, -s, s, c) * pos.xz;
+
+  vec4 mvPos = modelViewMatrix * vec4(pos, 1.0);
+  gl_Position = projectionMatrix * mvPos;
+
+  // Point size: base + audio boost, gently perspective-attenuated. At
+  // the default camera (z ~= 3.84) a uSizeBase of 1 renders roughly one
+  // device pixel \u2014 intentionally tiny so 40k+ additively-blended points
+  // read as fine dust rather than a solid blob.
+  float size = uSizeBase + uSizeAudio * (0.5 + aSeed);
+  gl_PointSize = max(1.0, size * uPixelRatio * (2.0 / max(0.1, -mvPos.z)));
+
+  // Heat: 0 at core, 1 at fringe. Used by the fragment to lerp color.
+  vHeat = clamp((length(pos) - 0.4) / 1.4, 0.0, 1.0);
+  vSeed = aSeed;
+}
+`
+);
+var ORGANIC_PARTICLES_FRAGMENT_SHADER = (
+  /* glsl */
+  `
+precision mediump float;
+
+uniform vec3 uColorCool;
+uniform vec3 uColorHot;
+uniform float uOpacity;
+uniform float uSoftness;
+
+varying float vHeat;
+varying float vSeed;
+
+void main() {
+  vec2 centered = gl_PointCoord - vec2(0.5);
+  float distSq = dot(centered, centered);
+  if (distSq > 0.25) discard;
+
+  // Soft circular falloff. uSoftness in [0.5, 1] controls how hard the
+  // edge is: 0.5 = sharp disc, 1 = feathered blob.
+  float innerR = 0.25 * (1.0 - uSoftness);
+  float alpha = smoothstep(0.25, innerR, distSq);
+
+  // Warm/cool gradient, with a tiny seed-based tint wobble so the cloud
+  // doesn't look banded.
+  float wobble = (vSeed - 0.5) * 0.15;
+  vec3 color = mix(uColorCool, uColorHot, clamp(vHeat + wobble, 0.0, 1.0));
+
+  gl_FragColor = vec4(color, alpha * uOpacity);
+}
+`
+);
+
+// src/react/particlesConfig.ts
+var DEFAULT_ORGANIC_PARTICLES_CONFIG = {
+  // Cloud shape
+  count: 4e4,
+  innerRadius: 0.6,
+  outerRadius: 1.1,
+  // Motion. Constant rotation / swirl drift default to 0 so the cloud
+  // only spins in response to audio — but `idleNoiseRate` keeps the
+  // Perlin field shimmering slightly so the cloud doesn't look frozen
+  // while paused.
+  noiseFrequency: 1.4,
+  noiseStrength: 0.22,
+  rotationBias: 0,
+  swirlTimeRate: 0,
+  idleNoiseRate: 1e-4,
+  // Rendering. Additive blending stacks contributions, so keep opacity
+  // low (<0.3) or 40k particles will saturate to white. sizeBase ~1
+  // renders as tiny dust; crank it higher for softer plasma look.
+  sizeBase: 1,
+  softness: 0.55,
+  opacity: 0.18,
+  // Color
+  colorCool: "#c2410c",
+  colorHot: "#fb923c",
+  // Audio reactivity
+  volume: {
+    idle: 0.02,
+    gain: 0.4,
+    floor: 0,
+    attack: 0.03,
+    decay: 25e-4
+  },
+  medium: {
+    idle: 0,
+    gain: 4,
+    floor: 0,
+    attack: 0.01,
+    decay: 4e-3
+  },
+  high: {
+    idle: 0.2,
+    gain: 1.2,
+    floor: 0.15,
+    attack: 0.015,
+    decay: 2e-3
+  },
+  low: {
+    idle: 4e-4,
+    gain: 4e-3,
+    floor: 1e-4,
+    attack: 5e-3,
+    decay: 2e-3
+  },
+  // Camera
+  cameraZ: 3.84,
+  fov: 35,
+  // Determinism
+  seed: 0,
+  // Init-only
+  maxPixelRatio: null,
+  backgroundColor: null
+};
+function resolveOrganicParticlesConfig(partial) {
+  const base = DEFAULT_ORGANIC_PARTICLES_CONFIG;
+  if (!partial) {
+    return {
+      ...base,
+      volume: { ...base.volume },
+      medium: { ...base.medium },
+      high: { ...base.high },
+      low: { ...base.low }
+    };
+  }
+  return {
+    ...base,
+    ...partial,
+    volume: { ...base.volume, ...partial.volume ?? {} },
+    medium: { ...base.medium, ...partial.medium ?? {} },
+    high: { ...base.high, ...partial.high ?? {} },
+    low: { ...base.low, ...partial.low ?? {} }
+  };
+}
+
+// src/react/OrganicParticles.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function seededUnit2(seed, salt) {
+  const s = Math.sin((seed + salt * 7919) * 12.9898 + salt * 78.233) * 43758.5453;
+  return s - Math.floor(s);
+}
+function buildParticleAttributes(count, innerRadius, outerRadius, seed) {
+  const positions = new Float32Array(count * 3);
+  const seeds = new Float32Array(count);
+  for (let i = 0; i < count; i++) {
+    const u = seededUnit2(seed, i * 4 + 1);
+    const v = seededUnit2(seed, i * 4 + 2);
+    const w = seededUnit2(seed, i * 4 + 3);
+    const s = seededUnit2(seed, i * 4 + 4);
+    const theta = v * Math.PI * 2;
+    const phi = Math.acos(2 * w - 1);
+    const r = innerRadius + u * Math.max(0, outerRadius - innerRadius);
+    const sinPhi = Math.sin(phi);
+    positions[i * 3 + 0] = r * sinPhi * Math.cos(theta);
+    positions[i * 3 + 1] = r * sinPhi * Math.sin(theta);
+    positions[i * 3 + 2] = r * Math.cos(phi);
+    seeds[i] = s;
+  }
+  return { positions, seeds };
+}
+function OrganicParticles({
+  getFrequencyData,
+  active = true,
+  config: configProp,
+  className,
+  style
+}) {
+  const containerRef = (0, import_react2.useRef)(null);
+  const resolvedConfig = (0, import_react2.useMemo)(
+    () => resolveOrganicParticlesConfig(configProp),
+    [configProp]
+  );
+  const configRef = (0, import_react2.useRef)(resolvedConfig);
+  (0, import_react2.useEffect)(() => {
+    configRef.current = resolvedConfig;
+  }, [resolvedConfig]);
+  const getFrequencyDataRef = (0, import_react2.useRef)(getFrequencyData);
+  const activeRef = (0, import_react2.useRef)(active);
+  (0, import_react2.useEffect)(() => {
+    getFrequencyDataRef.current = getFrequencyData;
+  }, [getFrequencyData]);
+  (0, import_react2.useEffect)(() => {
+    activeRef.current = active;
+  }, [active]);
+  const initCount = resolvedConfig.count;
+  const initInnerRadius = resolvedConfig.innerRadius;
+  const initOuterRadius = resolvedConfig.outerRadius;
+  const initSeed = resolvedConfig.seed;
+  const initMaxPixelRatio = resolvedConfig.maxPixelRatio;
+  const initBackgroundColor = resolvedConfig.backgroundColor;
+  (0, import_react2.useEffect)(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const cfg0 = configRef.current;
+    const width = container.clientWidth || 1;
+    const height = container.clientHeight || 1;
+    const pixelRatio = Math.min(
+      initMaxPixelRatio ?? (typeof window !== "undefined" ? window.devicePixelRatio : 1),
+      2
+    );
+    const scene = new THREE2.Scene();
+    if (initBackgroundColor) scene.background = new THREE2.Color(initBackgroundColor);
+    const camera = new THREE2.PerspectiveCamera(cfg0.fov, width / height, 0.1, 100);
+    camera.position.set(0, 0, cfg0.cameraZ);
+    scene.add(camera);
+    const renderer = new THREE2.WebGLRenderer({
+      antialias: true,
+      alpha: initBackgroundColor === null,
+      powerPreference: "high-performance"
+    });
+    renderer.setSize(width, height, false);
+    renderer.setPixelRatio(pixelRatio);
+    renderer.setClearColor(0, initBackgroundColor === null ? 0 : 1);
+    container.appendChild(renderer.domElement);
+    renderer.domElement.style.display = "block";
+    renderer.domElement.style.width = "100%";
+    renderer.domElement.style.height = "100%";
+    const { positions, seeds } = buildParticleAttributes(
+      initCount,
+      initInnerRadius,
+      initOuterRadius,
+      initSeed
+    );
+    const geometry = new THREE2.BufferGeometry();
+    geometry.setAttribute("aBasePosition", new THREE2.BufferAttribute(positions, 3));
+    geometry.setAttribute("aSeed", new THREE2.BufferAttribute(seeds, 1));
+    geometry.setAttribute("position", new THREE2.BufferAttribute(positions, 3));
+    const colorCoolObj = new THREE2.Color(cfg0.colorCool);
+    const colorHotObj = new THREE2.Color(cfg0.colorHot);
+    const material = new THREE2.ShaderMaterial({
+      uniforms: {
+        uTime: { value: 0 },
+        uNoiseFrequency: { value: cfg0.noiseFrequency },
+        uNoiseStrength: { value: cfg0.noiseStrength },
+        uDisplacement: { value: cfg0.volume.idle },
+        uSwirl: { value: cfg0.high.idle },
+        uSwirlTimeRate: { value: cfg0.swirlTimeRate },
+        uSizeBase: { value: cfg0.sizeBase },
+        uSizeAudio: { value: cfg0.medium.idle },
+        uPixelRatio: { value: pixelRatio },
+        uColorCool: { value: colorCoolObj },
+        uColorHot: { value: colorHotObj },
+        uOpacity: { value: cfg0.opacity },
+        uSoftness: { value: cfg0.softness }
+      },
+      vertexShader: ORGANIC_PARTICLES_VERTEX_SHADER,
+      fragmentShader: ORGANIC_PARTICLES_FRAGMENT_SHADER,
+      transparent: true,
+      depthWrite: false,
+      blending: THREE2.AdditiveBlending
+    });
+    const points = new THREE2.Points(geometry, material);
+    scene.add(points);
+    const variations = {
+      volume: { target: 0, current: cfg0.volume.idle },
+      medium: { target: 0, current: cfg0.medium.idle },
+      high: { target: 0, current: cfg0.high.idle },
+      low: { target: 0, current: cfg0.low.idle }
+    };
+    const LEVEL_COUNT = 8;
+    function computeLevels(buf) {
+      const bins = Math.floor(buf.length / LEVEL_COUNT);
+      const levels = new Array(LEVEL_COUNT).fill(0);
+      if (bins <= 0) return levels;
+      for (let i = 0; i < LEVEL_COUNT; i++) {
+        let sum = 0;
+        for (let j = 0; j < bins; j++) sum += buf[i * bins + j];
+        levels[i] = sum / bins / 256;
+      }
+      return levels;
+    }
+    function bandTarget(reactivity, levels, sourceLevel) {
+      if (!levels) return reactivity.idle;
+      return Math.max(
+        reactivity.floor,
+        reactivity.floor + sourceLevel * reactivity.gain
+      );
+    }
+    const rotationState = { y: 0 };
+    const resetAnimationState = (cfg) => {
+      material.uniforms.uTime.value = 0;
+      rotationState.y = 0;
+      points.rotation.set(0, 0, 0);
+      variations.volume.current = cfg.volume.idle;
+      variations.medium.current = cfg.medium.idle;
+      variations.high.current = cfg.high.idle;
+      variations.low.current = cfg.low.idle;
+      variations.volume.target = cfg.volume.idle;
+      variations.medium.target = cfg.medium.idle;
+      variations.high.target = cfg.high.idle;
+      variations.low.target = cfg.low.idle;
+    };
+    let rafId = 0;
+    let lastTs = performance.now();
+    let disposed = false;
+    let wasActive = activeRef.current;
+    const render = () => {
+      if (disposed) return;
+      const now = performance.now();
+      const delta = Math.min(now - lastTs, 100);
+      lastTs = now;
+      const cfg = configRef.current;
+      colorCoolObj.set(cfg.colorCool);
+      colorHotObj.set(cfg.colorHot);
+      material.uniforms.uNoiseFrequency.value = cfg.noiseFrequency;
+      material.uniforms.uNoiseStrength.value = cfg.noiseStrength;
+      material.uniforms.uSwirlTimeRate.value = cfg.swirlTimeRate;
+      material.uniforms.uSizeBase.value = cfg.sizeBase;
+      material.uniforms.uOpacity.value = cfg.opacity;
+      material.uniforms.uSoftness.value = cfg.softness;
+      if (camera.position.z !== cfg.cameraZ) camera.position.z = cfg.cameraZ;
+      if (camera.fov !== cfg.fov) {
+        camera.fov = cfg.fov;
+        camera.updateProjectionMatrix();
+      }
+      const isActive = activeRef.current;
+      if (isActive && !wasActive) {
+        resetAnimationState(cfg);
+      }
+      wasActive = isActive;
+      if (isActive) {
+        let levels = null;
+        if (getFrequencyDataRef.current) {
+          try {
+            const buf = getFrequencyDataRef.current();
+            if (buf && buf.length > 0) levels = computeLevels(buf);
+          } catch {
+            levels = null;
+          }
+        }
+        const l0 = levels ? levels[0] || 0 : 0;
+        const l1 = levels ? levels[1] || 0 : 0;
+        const l2 = levels ? levels[2] || 0 : 0;
+        const loudest = Math.max(l0, l1, l2);
+        const update = (variation, reactivity, sourceLevel) => {
+          variation.target = bandTarget(reactivity, levels, sourceLevel);
+          const easing = variation.target > variation.current ? reactivity.attack : reactivity.decay;
+          variation.current += (variation.target - variation.current) * easing * delta;
+        };
+        update(variations.volume, cfg.volume, loudest);
+        update(variations.medium, cfg.medium, l1);
+        update(variations.high, cfg.high, l2);
+        update(variations.low, cfg.low, l0);
+        const timeFrequency = variations.low.current;
+        const elapsed = delta * timeFrequency;
+        material.uniforms.uDisplacement.value = variations.volume.current;
+        material.uniforms.uSizeAudio.value = variations.medium.current;
+        material.uniforms.uSwirl.value = variations.high.current;
+        material.uniforms.uTime.value += elapsed;
+        rotationState.y += delta * cfg.rotationBias + variations.high.current * delta * 8e-4;
+        points.rotation.y = rotationState.y;
+      } else {
+        material.uniforms.uTime.value += delta * cfg.idleNoiseRate;
+      }
+      renderer.render(scene, camera);
+      rafId = requestAnimationFrame(render);
+    };
+    rafId = requestAnimationFrame(render);
+    const resizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(() => {
+      const w = container.clientWidth || 1;
+      const h = container.clientHeight || 1;
+      camera.aspect = w / h;
+      camera.updateProjectionMatrix();
+      renderer.setSize(w, h, false);
+    }) : null;
+    resizeObserver?.observe(container);
+    return () => {
+      disposed = true;
+      cancelAnimationFrame(rafId);
+      resizeObserver?.disconnect();
+      geometry.dispose();
+      material.dispose();
+      renderer.dispose();
+      if (renderer.domElement.parentNode === container) {
+        container.removeChild(renderer.domElement);
+      }
+    };
+  }, [
+    initCount,
+    initInnerRadius,
+    initOuterRadius,
+    initSeed,
+    initMaxPixelRatio,
+    initBackgroundColor
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: containerRef, className, style });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  OrganicParticles,
+  OrganicSphere
+});
+//# sourceMappingURL=visuals.cjs.map