@zendir/ui 0.1.0

package/dist/react/3d/ZenSpace3DShaders.js

@@ -0,0 +1,94 @@
+const atmosphereVertexShader = `
+varying vec3 vNormal;
+varying vec3 vPosition;
+varying float vIntensity;
+
+void main() {
+  vNormal = normalize(normalMatrix * normal);
+  vPosition = position;
+  
+  // Calculate intensity based on view angle
+  vec4 worldPosition = modelMatrix * vec4(position, 1.0);
+  vec3 viewDirection = normalize(cameraPosition - worldPosition.xyz);
+  vIntensity = pow(0.65 - dot(vNormal, viewDirection), 2.0);
+  
+  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+}
+`;
+const atmosphereFragmentShader = `
+varying vec3 vNormal;
+varying vec3 vPosition;
+varying float vIntensity;
+
+uniform vec3 glowColor;
+uniform float glowIntensity;
+
+void main() {
+  // Fresnel-based glow
+  float intensity = vIntensity * glowIntensity;
+  
+  // Add subtle color variation
+  vec3 color = glowColor * intensity;
+  
+  // Fade at edges for smoother blending
+  float alpha = intensity * 0.8;
+  
+  gl_FragColor = vec4(color, alpha);
+}
+`;
+const starsVertexShader = `
+attribute float opacity;
+attribute float size;
+attribute vec3 customColor;
+
+varying float vOpacity;
+varying vec3 vColor;
+
+uniform float time;
+uniform float pointSize;
+
+void main() {
+  vOpacity = opacity;
+  vColor = customColor;
+  
+  // Twinkle effect
+  float twinkle = sin(time * (0.5 + opacity * 2.0) + opacity * 100.0) * 0.5 + 0.5;
+  vOpacity = opacity * (0.6 + twinkle * 0.4);
+  
+  vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
+  
+  // Size attenuation
+  float sizeMultiplier = size > 0.0 ? size : 1.0;
+  gl_PointSize = pointSize * sizeMultiplier * (300.0 / -mvPosition.z);
+  gl_PointSize = clamp(gl_PointSize, 0.5, 8.0);
+  
+  gl_Position = projectionMatrix * mvPosition;
+}
+`;
+const starsFragmentShader = `
+varying float vOpacity;
+varying vec3 vColor;
+
+void main() {
+  // Circular point with soft edge
+  vec2 center = gl_PointCoord - vec2(0.5);
+  float dist = length(center);
+  
+  if (dist > 0.5) discard;
+  
+  // Soft glow falloff
+  float alpha = smoothstep(0.5, 0.0, dist) * vOpacity;
+  
+  // Apply color
+  vec3 color = vColor.r > 0.0 ? vColor : vec3(1.0, 1.0, 1.0);
+  
+  gl_FragColor = vec4(color, alpha);
+}
+`;
+export {
+  atmosphereFragmentShader,
+  atmosphereVertexShader,
+  starsFragmentShader,
+  starsVertexShader
+};
+//# sourceMappingURL=ZenSpace3DShaders.js.map

package/dist/react/3d/ZenSpace3DShaders.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ZenSpace3DShaders.js","sources":["../../../src/react/3d/ZenSpace3DShaders.ts"],"sourcesContent":["/**\r\n * @zendir/ui - ZenSpace3D Shaders\r\n * \r\n * Advanced GLSL shaders for atmosphere, glow effects, coverage visualization,\r\n * and other space rendering effects.\r\n */\r\n\r\n// =============================================================================\r\n// Atmosphere Shader (Enhanced from original)\r\n// =============================================================================\r\n\r\nexport const atmosphereVertexShader = `\r\nvarying vec3 vNormal;\r\nvarying vec3 vPosition;\r\nvarying float vIntensity;\r\n\r\nvoid main() {\r\n  vNormal = normalize(normalMatrix * normal);\r\n  vPosition = position;\r\n  \r\n  // Calculate intensity based on view angle\r\n  vec4 worldPosition = modelMatrix * vec4(position, 1.0);\r\n  vec3 viewDirection = normalize(cameraPosition - worldPosition.xyz);\r\n  vIntensity = pow(0.65 - dot(vNormal, viewDirection), 2.0);\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const atmosphereFragmentShader = `\r\nvarying vec3 vNormal;\r\nvarying vec3 vPosition;\r\nvarying float vIntensity;\r\n\r\nuniform vec3 glowColor;\r\nuniform float glowIntensity;\r\n\r\nvoid main() {\r\n  // Fresnel-based glow\r\n  float intensity = vIntensity * glowIntensity;\r\n  \r\n  // Add subtle color variation\r\n  vec3 color = glowColor * intensity;\r\n  \r\n  // Fade at edges for smoother blending\r\n  float alpha = intensity * 0.8;\r\n  \r\n  gl_FragColor = vec4(color, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Enhanced Stars Shader (Twinkling with nebula)\r\n// =============================================================================\r\n\r\nexport const starsVertexShader = `\r\nattribute float opacity;\r\nattribute float size;\r\nattribute vec3 customColor;\r\n\r\nvarying float vOpacity;\r\nvarying vec3 vColor;\r\n\r\nuniform float time;\r\nuniform float pointSize;\r\n\r\nvoid main() {\r\n  vOpacity = opacity;\r\n  vColor = customColor;\r\n  \r\n  // Twinkle effect\r\n  float twinkle = sin(time * (0.5 + opacity * 2.0) + opacity * 100.0) * 0.5 + 0.5;\r\n  vOpacity = opacity * (0.6 + twinkle * 0.4);\r\n  \r\n  vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);\r\n  \r\n  // Size attenuation\r\n  float sizeMultiplier = size > 0.0 ? size : 1.0;\r\n  gl_PointSize = pointSize * sizeMultiplier * (300.0 / -mvPosition.z);\r\n  gl_PointSize = clamp(gl_PointSize, 0.5, 8.0);\r\n  \r\n  gl_Position = projectionMatrix * mvPosition;\r\n}\r\n`;\r\n\r\nexport const starsFragmentShader = `\r\nvarying float vOpacity;\r\nvarying vec3 vColor;\r\n\r\nvoid main() {\r\n  // Circular point with soft edge\r\n  vec2 center = gl_PointCoord - vec2(0.5);\r\n  float dist = length(center);\r\n  \r\n  if (dist > 0.5) discard;\r\n  \r\n  // Soft glow falloff\r\n  float alpha = smoothstep(0.5, 0.0, dist) * vOpacity;\r\n  \r\n  // Apply color\r\n  vec3 color = vColor.r > 0.0 ? vColor : vec3(1.0, 1.0, 1.0);\r\n  \r\n  gl_FragColor = vec4(color, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Coverage Heatmap Shader\r\n// =============================================================================\r\n\r\nexport const coverageVertexShader = `\r\nvarying vec2 vUv;\r\nvarying vec3 vNormal;\r\nvarying vec3 vPosition;\r\n\r\nvoid main() {\r\n  vUv = uv;\r\n  vNormal = normalize(normalMatrix * normal);\r\n  vPosition = (modelMatrix * vec4(position, 1.0)).xyz;\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const coverageFragmentShader = `\r\nuniform sampler2D coverageMap;\r\nuniform vec3 lowColor;\r\nuniform vec3 highColor;\r\nuniform float opacity;\r\nuniform float time;\r\n\r\nvarying vec2 vUv;\r\nvarying vec3 vNormal;\r\nvarying vec3 vPosition;\r\n\r\nvoid main() {\r\n  // Sample coverage value\r\n  float coverage = texture2D(coverageMap, vUv).r;\r\n  \r\n  // Animated pulse for active areas\r\n  float pulse = sin(time * 2.0) * 0.1 + 0.9;\r\n  coverage *= coverage > 0.5 ? pulse : 1.0;\r\n  \r\n  // Color gradient\r\n  vec3 color = mix(lowColor, highColor, coverage);\r\n  \r\n  // Fresnel edge highlight\r\n  vec3 viewDir = normalize(cameraPosition - vPosition);\r\n  float fresnel = pow(1.0 - dot(vNormal, viewDir), 2.0);\r\n  color += vec3(0.1, 0.3, 0.5) * fresnel * coverage;\r\n  \r\n  // Hexagon pattern overlay (subtle)\r\n  float hexPattern = fract(vUv.x * 20.0 + vUv.y * 10.0);\r\n  color *= 0.95 + hexPattern * 0.05;\r\n  \r\n  gl_FragColor = vec4(color, coverage * opacity);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Visibility Cone Shader\r\n// =============================================================================\r\n\r\nexport const visibilityConeVertexShader = `\r\nvarying vec3 vPosition;\r\nvarying vec3 vNormal;\r\nvarying float vDistFromApex;\r\n\r\nuniform vec3 apexPosition;\r\n\r\nvoid main() {\r\n  vPosition = (modelMatrix * vec4(position, 1.0)).xyz;\r\n  vNormal = normalize(normalMatrix * normal);\r\n  vDistFromApex = distance(position, apexPosition);\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const visibilityConeFragmentShader = `\r\nuniform vec3 coneColor;\r\nuniform float coneOpacity;\r\nuniform float time;\r\n\r\nvarying vec3 vPosition;\r\nvarying vec3 vNormal;\r\nvarying float vDistFromApex;\r\n\r\nvoid main() {\r\n  // Fresnel effect for edge visibility\r\n  vec3 viewDir = normalize(cameraPosition - vPosition);\r\n  float fresnel = pow(1.0 - abs(dot(vNormal, viewDir)), 2.0);\r\n  \r\n  // Animated scan line effect\r\n  float scan = fract(vDistFromApex * 0.001 - time * 0.5);\r\n  scan = smoothstep(0.0, 0.1, scan) * smoothstep(0.2, 0.1, scan);\r\n  \r\n  // Distance-based opacity (fade towards apex)\r\n  float distFade = smoothstep(0.0, 500.0, vDistFromApex);\r\n  \r\n  // Combine effects\r\n  float alpha = (fresnel * 0.3 + 0.1 + scan * 0.2) * coneOpacity * distFade;\r\n  \r\n  gl_FragColor = vec4(coneColor, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Orbit Line Shader\r\n// =============================================================================\r\n\r\nexport const orbitLineVertexShader = `\r\nattribute float lineDistance;\r\nvarying float vLineDistance;\r\nvarying float vOpacity;\r\n\r\nuniform float totalLength;\r\nuniform float time;\r\nuniform float dashScale;\r\n\r\nvoid main() {\r\n  vLineDistance = lineDistance;\r\n  \r\n  // Animated dash effect\r\n  float animOffset = mod(time * 0.5, 1.0) * totalLength;\r\n  float dashPos = mod(lineDistance + animOffset, dashScale);\r\n  vOpacity = smoothstep(0.0, dashScale * 0.3, dashPos) * \r\n             smoothstep(dashScale, dashScale * 0.7, dashPos);\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const orbitLineFragmentShader = `\r\nuniform vec3 lineColor;\r\nuniform float lineOpacity;\r\n\r\nvarying float vLineDistance;\r\nvarying float vOpacity;\r\n\r\nvoid main() {\r\n  gl_FragColor = vec4(lineColor, lineOpacity * vOpacity);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Satellite/Object Glow Shader\r\n// =============================================================================\r\n\r\nexport const objectGlowVertexShader = `\r\nvarying vec3 vNormal;\r\nvarying vec3 vViewPosition;\r\n\r\nvoid main() {\r\n  vNormal = normalize(normalMatrix * normal);\r\n  vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);\r\n  vViewPosition = -mvPosition.xyz;\r\n  \r\n  gl_Position = projectionMatrix * mvPosition;\r\n}\r\n`;\r\n\r\nexport const objectGlowFragmentShader = `\r\nuniform vec3 glowColor;\r\nuniform float glowIntensity;\r\nuniform float glowPower;\r\n\r\nvarying vec3 vNormal;\r\nvarying vec3 vViewPosition;\r\n\r\nvoid main() {\r\n  vec3 viewDir = normalize(vViewPosition);\r\n  float fresnel = pow(1.0 - abs(dot(vNormal, viewDir)), glowPower);\r\n  \r\n  vec3 color = glowColor * glowIntensity * fresnel;\r\n  float alpha = fresnel * glowIntensity;\r\n  \r\n  gl_FragColor = vec4(color, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Selection Ring Shader\r\n// =============================================================================\r\n\r\nexport const selectionRingVertexShader = `\r\nvarying vec2 vUv;\r\n\r\nvoid main() {\r\n  vUv = uv;\r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const selectionRingFragmentShader = `\r\nuniform vec3 ringColor;\r\nuniform float time;\r\nuniform float ringWidth;\r\nuniform float ringRadius;\r\n\r\nvarying vec2 vUv;\r\n\r\nvoid main() {\r\n  vec2 center = vUv - vec2(0.5);\r\n  float dist = length(center);\r\n  \r\n  // Ring shape\r\n  float ring = smoothstep(ringRadius - ringWidth, ringRadius, dist) *\r\n               smoothstep(ringRadius + ringWidth, ringRadius, dist);\r\n  \r\n  // Animated rotation\r\n  float angle = atan(center.y, center.x);\r\n  float rotatingDash = sin(angle * 8.0 - time * 3.0) * 0.5 + 0.5;\r\n  \r\n  // Pulse effect\r\n  float pulse = sin(time * 2.0) * 0.2 + 0.8;\r\n  \r\n  float alpha = ring * rotatingDash * pulse;\r\n  \r\n  gl_FragColor = vec4(ringColor, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Terminator (Day/Night) Shader\r\n// =============================================================================\r\n\r\nexport const terminatorVertexShader = `\r\nvarying vec3 vWorldPosition;\r\nvarying vec3 vNormal;\r\n\r\nvoid main() {\r\n  vWorldPosition = (modelMatrix * vec4(position, 1.0)).xyz;\r\n  vNormal = normalize(normalMatrix * normal);\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const terminatorFragmentShader = `\r\nuniform vec3 sunDirection;\r\nuniform sampler2D dayTexture;\r\nuniform sampler2D nightTexture;\r\n\r\nvarying vec3 vWorldPosition;\r\nvarying vec3 vNormal;\r\n\r\nvoid main() {\r\n  // Calculate sun illumination\r\n  float sunDot = dot(vNormal, sunDirection);\r\n  \r\n  // Smooth transition at terminator\r\n  float dayFactor = smoothstep(-0.1, 0.2, sunDot);\r\n  \r\n  // Sample textures (simplified - using world position for UV)\r\n  vec2 uv = vec2(\r\n    atan(vWorldPosition.z, vWorldPosition.x) / (2.0 * 3.14159) + 0.5,\r\n    asin(vWorldPosition.y / length(vWorldPosition)) / 3.14159 + 0.5\r\n  );\r\n  \r\n  vec4 dayColor = texture2D(dayTexture, uv);\r\n  vec4 nightColor = texture2D(nightTexture, uv);\r\n  \r\n  // Blend day and night\r\n  vec4 color = mix(nightColor, dayColor, dayFactor);\r\n  \r\n  // Add city lights glow on night side\r\n  float nightGlow = (1.0 - dayFactor) * nightColor.r * 0.5;\r\n  color.rgb += vec3(1.0, 0.9, 0.7) * nightGlow;\r\n  \r\n  gl_FragColor = color;\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Grid Shader (Lat/Lon lines)\r\n// =============================================================================\r\n\r\nexport const gridVertexShader = `\r\nvarying vec3 vPosition;\r\n\r\nvoid main() {\r\n  vPosition = position;\r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const gridFragmentShader = `\r\nuniform vec3 gridColor;\r\nuniform float gridOpacity;\r\nuniform float gridSpacing;\r\nuniform float lineWidth;\r\n\r\nvarying vec3 vPosition;\r\n\r\nvoid main() {\r\n  // Convert position to lat/lon\r\n  float lat = asin(vPosition.y / length(vPosition)) * 57.2958; // rad to deg\r\n  float lon = atan(vPosition.z, vPosition.x) * 57.2958;\r\n  \r\n  // Create grid lines\r\n  float latLine = abs(mod(lat + 90.0, gridSpacing) - gridSpacing * 0.5);\r\n  float lonLine = abs(mod(lon + 180.0, gridSpacing) - gridSpacing * 0.5);\r\n  \r\n  float line = min(latLine, lonLine);\r\n  float alpha = smoothstep(lineWidth, 0.0, line) * gridOpacity;\r\n  \r\n  // Highlight equator and prime meridian\r\n  float equator = smoothstep(1.0, 0.0, abs(lat));\r\n  float primeMeridian = smoothstep(1.0, 0.0, abs(lon));\r\n  alpha += (equator + primeMeridian) * 0.3;\r\n  \r\n  gl_FragColor = vec4(gridColor, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Planet Ring Shader (Saturn-like)\r\n// =============================================================================\r\n\r\nexport const planetRingVertexShader = `\r\nvarying vec2 vUv;\r\nvarying vec3 vWorldPosition;\r\n\r\nvoid main() {\r\n  vUv = uv;\r\n  vWorldPosition = (modelMatrix * vec4(position, 1.0)).xyz;\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\r\n}\r\n`;\r\n\r\nexport const planetRingFragmentShader = `\r\nuniform vec3 ringColor;\r\nuniform float innerRadius;\r\nuniform float outerRadius;\r\nuniform float ringOpacity;\r\nuniform vec3 sunDirection;\r\n\r\nvarying vec2 vUv;\r\nvarying vec3 vWorldPosition;\r\n\r\nvoid main() {\r\n  vec2 center = vUv - vec2(0.5);\r\n  float dist = length(center) * 2.0;\r\n  \r\n  // Ring bands\r\n  float normalizedDist = (dist - innerRadius) / (outerRadius - innerRadius);\r\n  \r\n  if (normalizedDist < 0.0 || normalizedDist > 1.0) discard;\r\n  \r\n  // Create ring bands pattern\r\n  float bands = sin(normalizedDist * 50.0) * 0.3 + 0.7;\r\n  float gaps = step(0.3, fract(normalizedDist * 5.0));\r\n  \r\n  // Simple shadow from planet\r\n  float shadow = smoothstep(0.3, 0.5, dist);\r\n  \r\n  float alpha = bands * gaps * ringOpacity * shadow;\r\n  \r\n  gl_FragColor = vec4(ringColor, alpha);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Debris Field Shader (for instanced rendering)\r\n// =============================================================================\r\n\r\nexport const debrisVertexShader = `\r\nattribute vec3 instancePosition;\r\nattribute float instanceSize;\r\nattribute vec3 instanceColor;\r\n\r\nvarying vec3 vColor;\r\nvarying float vSize;\r\n\r\nuniform float time;\r\n\r\nvoid main() {\r\n  vColor = instanceColor;\r\n  vSize = instanceSize;\r\n  \r\n  // Apply instance transform\r\n  vec3 transformed = position * instanceSize + instancePosition;\r\n  \r\n  // Slight rotation animation\r\n  float angle = time * 0.5 + instancePosition.x * 0.01;\r\n  mat2 rot = mat2(cos(angle), -sin(angle), sin(angle), cos(angle));\r\n  transformed.xz = rot * transformed.xz;\r\n  \r\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\r\n}\r\n`;\r\n\r\nexport const debrisFragmentShader = `\r\nvarying vec3 vColor;\r\nvarying float vSize;\r\n\r\nvoid main() {\r\n  gl_FragColor = vec4(vColor, 1.0);\r\n}\r\n`;\r\n\r\n// =============================================================================\r\n// Shader Uniforms Helpers\r\n// =============================================================================\r\n\r\nexport interface AtmosphereUniforms {\r\n  glowColor: { value: [number, number, number] };\r\n  glowIntensity: { value: number };\r\n}\r\n\r\nexport interface StarsUniforms {\r\n  time: { value: number };\r\n  pointSize: { value: number };\r\n}\r\n\r\nexport interface CoverageUniforms {\r\n  coverageMap: { value: unknown };\r\n  lowColor: { value: [number, number, number] };\r\n  highColor: { value: [number, number, number] };\r\n  opacity: { value: number };\r\n  time: { value: number };\r\n}\r\n\r\nexport interface VisibilityConeUniforms {\r\n  coneColor: { value: [number, number, number] };\r\n  coneOpacity: { value: number };\r\n  time: { value: number };\r\n  apexPosition: { value: [number, number, number] };\r\n}\r\n\r\nexport function createAtmosphereUniforms(\r\n  color: [number, number, number] = [0.3, 0.6, 1.0],\r\n  intensity: number = 1.5\r\n): AtmosphereUniforms {\r\n  return {\r\n    glowColor: { value: color },\r\n    glowIntensity: { value: intensity },\r\n  };\r\n}\r\n\r\nexport function createStarsUniforms(pointSize: number = 2.0): StarsUniforms {\r\n  return {\r\n    time: { value: 0 },\r\n    pointSize: { value: pointSize },\r\n  };\r\n}\r\n\r\nexport function createVisibilityConeUniforms(\r\n  color: [number, number, number] = [0.2, 0.8, 0.9],\r\n  opacity: number = 0.3\r\n): VisibilityConeUniforms {\r\n  return {\r\n    coneColor: { value: color },\r\n    coneOpacity: { value: opacity },\r\n    time: { value: 0 },\r\n    apexPosition: { value: [0, 0, 0] },\r\n  };\r\n}\r\n"],"names":[],"mappings":"AAWO,MAAM,yBAAyB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkB/B,MAAM,2BAA2B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BjC,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8B1B,MAAM,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}