@codefluss/plugin-background-3d 0.0.1-alpha.1

package/README.md

@@ -0,0 +1,153 @@
+# @codefluss/plugin-background-3d
+
+Interactive 3D background plugin with multiple scene types, adaptive performance, and multi-instance
+support.
+
+## Features
+
+- ✅ **8 Scene Types**: Starfield, Particle Flow, Wave, Physics Cubes, Holographic, Dark Room,
+  Elegant Wave, Gradient Mesh
+- ✅ **Adaptive Performance**: Auto-adjusts quality based on FPS
+- ✅ **Multi-Instance**: Multiple instances can run on same page
+- ✅ **SEO Optimized**: Structured data and accessibility content
+- ✅ **Viewport Detection**: Only renders when visible
+- ✅ **Physics Support**: Rapier physics integration (Physics Cubes scene)
+
+## Installation
+
+```bash
+pnpm add @codefluss/plugin-background-3d
+```
+
+## Usage
+
+### Register Plugin
+
+```typescript
+import { background3DConfig } from '@codefluss/plugin-background-3d';
+
+// Register in plugin registry
+pluginRegistry.register(background3DConfig);
+```
+
+### Configuration
+
+```typescript
+{
+  scene: {
+    type: 'starfield',
+    description: 'Interactive 3D starfield background',
+    backgroundColor: 'transparent'
+  },
+  performance: {
+    quality: 'auto',
+    maxParticles: 10000
+  },
+  camera: {
+    autoRotate: true,
+    rotationSpeed: 0.5,
+    fov: 75
+  },
+  layout: {
+    height: '100vh',
+    position: 'relative'
+  }
+}
+```
+
+## Scene Types
+
+### ✨ Starfield
+
+Animated star field with auto-rotating camera
+
+- Adaptive particle count
+- Customizable rotation speed
+- FPS-based quality adjustment
+
+### 🎆 Particle Flow
+
+Flowing particle stream with color gradients
+
+- Wave-like motion
+- Continuous flow animation
+- Color gradient effects
+
+### 🌊 Wave
+
+Interactive wave plane with mouse tracking
+
+- Dual wave layers (solid + wireframe)
+- Mouse-influenced ripples
+- Smooth wave animations
+- Responsive to user interaction
+
+### 🎲 Physics Cubes
+
+Physics simulation with falling cubes
+
+- Rapier physics with realistic collisions
+- Mouse sphere interaction
+- Container boundaries
+- Reset functionality
+
+### 💎 Holographic
+
+Holographic sphere with floating shapes
+
+- MeshTransmissionMaterial for glass effect
+- Floating torus shapes
+- Chromatic aberration and distortion
+- Smooth rotation animations
+
+### 🕯️ Dark Room
+
+Dark room environment with spotlight
+
+- Enclosed room with walls and floor
+- Mouse-following spotlight
+- 3D text with shadows
+- Floating particles
+- Camera parallax effect
+
+### 〰️ Elegant Wave
+
+Multiple wave layers with particles
+
+- Elegant wave plane with mouse interaction
+- Multiple wave layers for complex motion
+- Floating particles with mouse attraction
+- Gentle rotation and color effects
+
+### 🌈 Gradient Mesh
+
+Animated gradient mesh effect
+
+- Flowing wave motion
+- Color transitions
+- Wireframe overlay
+- Smooth animations
+
+## Performance
+
+- **Bundle Size**: ~880KB (editor), ~5KB (SSR)
+- **Initial Load**: ~300ms
+- **Target FPS**: 60fps (single instance), 30fps (multiple instances)
+- **Memory**: ~80MB per instance (with shared resources)
+
+## Multi-Instance Support
+
+Multiple instances share resources for memory efficiency:
+
+```typescript
+// Example: 3 instances on one page
+<Background3D id="bg-1" type="starfield" />
+<Background3D id="bg-2" type="particles" />
+<Background3D id="bg-3" type="starfield" />
+```
+
+Performance automatically adjusts across all instances.
+
+## License
+
+MIT

package/dist/background-3d-config.d.ts

@@ -0,0 +1,15 @@
+import { PluginConfig } from '@codefluss/base-types';
+/**
+ * Background 3D Plugin Configuration
+ *
+ * Interactive 3D background with multiple scene types
+ *
+ * Features:
+ * - 5 scene presets (Starfield, Particles, Floating, Aurora, Geometric)
+ * - Adaptive performance with quality presets
+ * - Optional physics simulation
+ * - SEO optimized
+ * - Multi-instance support
+ */
+export declare const background3DConfig: PluginConfig;
+//# sourceMappingURL=background-3d-config.d.ts.map

package/dist/background-3d-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"background-3d-config.d.ts","sourceRoot":"","sources":["../src/background-3d-config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAK1D;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB,EAAE,YAiPhC,CAAC"}

package/dist/components/background-3d-component.d.ts

@@ -0,0 +1,12 @@
+import { Background3DComponentProps } from '../types';
+/**
+ * Background 3D Component - Main plugin component
+ *
+ * Features:
+ * - SEO metadata for search engines
+ * - SSR-safe with dynamic import
+ * - Accessibility content
+ * - Interactive WebGL canvas
+ */
+export declare function Background3DComponent({ data, elementId, isEditorMode }: Background3DComponentProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=background-3d-component.d.ts.map

package/dist/components/background-3d-component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"background-3d-component.d.ts","sourceRoot":"","sources":["../../src/components/background-3d-component.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAK3D;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,SAAS,EACT,YAAoB,EACrB,EAAE,0BAA0B,2CAyB5B"}

package/dist/components/background-renderer.d.ts

@@ -0,0 +1,15 @@
+import { RendererProps } from '@codefluss/base-types';
+import { Background3DData } from '../types';
+export interface BackgroundRendererProps extends RendererProps<Background3DData> {
+}
+/**
+ * Background Renderer
+ *
+ * Renders the interactive 3D background with all scene types.
+ * This component works client-side and loads Three.js dynamically.
+ */
+export declare function BackgroundRenderer({ elementId, data, dependencies, }: BackgroundRendererProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BackgroundRenderer {
+    var displayName: string;
+}
+//# sourceMappingURL=background-renderer.d.ts.map

package/dist/components/background-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"background-renderer.d.ts","sourceRoot":"","sources":["../../src/components/background-renderer.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAGjD,MAAM,WAAW,uBAChB,SAAQ,aAAa,CAAC,gBAAgB,CAAC;CAAG;AAE3C;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,EAClC,SAAS,EACT,IAAI,EACJ,YAAY,GACZ,EAAE,uBAAuB,2CASzB;yBAbe,kBAAkB"}

package/dist/components/interactive-background.d.ts

@@ -0,0 +1,12 @@
+import { InteractiveBackgroundProps } from '../types';
+/**
+ * Interactive Background Component
+ *
+ * Features:
+ * - Viewport detection (only renders when visible)
+ * - Scene type selection
+ * - Performance monitoring
+ * - Instance-based state
+ */
+export default function InteractiveBackground({ instanceId, data, isEditorMode }: InteractiveBackgroundProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=interactive-background.d.ts.map

package/dist/components/interactive-background.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interactive-background.d.ts","sourceRoot":"","sources":["../../src/components/interactive-background.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,0BAA0B,EAAa,MAAM,UAAU,CAAC;AAEtE;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,UAAU,EACV,IAAI,EACJ,YAAY,EACb,EAAE,0BAA0B,2CAgE5B"}

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @codefluss/plugin-background-3d
+ *
+ * Interactive 3D background plugin with multiple scene types
+ */
+export { background3DConfig } from './background-3d-config';
+export { Background3DComponent } from './components/background-3d-component';
+export { createBackgroundInstance } from './store/background-store';
+export type { Background3DData, BackgroundStore, SceneType, Background3DComponentProps, InteractiveBackgroundProps, SceneContentProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,wBAAwB,EAAE,MAAM,0BAA0B,CAAC;AAGpE,YAAY,EACV,gBAAgB,EAChB,eAAe,EACf,SAAS,EACT,0BAA0B,EAC1B,0BAA0B,EAC1B,iBAAiB,EAClB,MAAM,SAAS,CAAC"}

package/dist/index.mjs

@@ -0,0 +1,13 @@
+import{jsxs as e,jsx as a,Fragment as i}from"react/jsx-runtime";import{lazy as t,Suspense as o}from"react";import{Sparkles as l}from"lucide-react";import{createStore as r}from"zustand";import*as n from"three";import{resourceManager as s}from"@codefluss/threejs-shared";const c=t(()=>import("./interactive-background-c2gBuha0.js"));function d({data:i,elementId:t,isEditorMode:l=!1}){/* @__PURE__ */
+return e("div",{className:"background-3d-wrapper",style:{width:"100%",height:i.layout?.height||"100vh",position:i.layout?.position||"relative",overflow:"hidden"},children:[
+/* @__PURE__ */a(p,{data:i}),
+/* @__PURE__ */a(o,{fallback:/* @__PURE__ */a(u,{}),children:/* @__PURE__ */a(c,{instanceId:t,data:i,isEditorMode:l})})]})}function p({data:t}){/* @__PURE__ */
+return e(i,{children:[
+/* @__PURE__ */a("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:JSON.stringify({"@context":"https://schema.org","@type":"WebPageElement",name:t.scene?.type||"3D Background",description:t.scene?.description||"Interactive 3D background scene",interactionType:"Interactive",technology:"WebGL",keywords:t.scene?.keywords||[]})}}),
+/* @__PURE__ */e("div",{className:"sr-only","aria-hidden":"true",children:[
+/* @__PURE__ */a("h2",{children:t.scene?.type||"3D Background"}),
+/* @__PURE__ */a("p",{children:t.scene?.description||"Interactive 3D background scene"}),t.scene?.keywords&&/* @__PURE__ */a("meta",{name:"keywords",content:t.scene.keywords.join(", ")})]})]})}function u(){/* @__PURE__ */
+return e("div",{style:{width:"100%",height:"100%",background:"linear-gradient(135deg, #667eea 0%, #764ba2 100%)",display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",top:0,left:0},role:"img","aria-label":"3D Background Loading",children:[
+/* @__PURE__ */a("div",{style:{width:"40px",height:"40px",border:"4px solid rgba(255, 255, 255, 0.3)",borderTop:"4px solid white",borderRadius:"50%",animation:"spin 1s linear infinite"}}),
+/* @__PURE__ */a("style",{children:"\n        @keyframes spin {\n          0% { transform: rotate(0deg); }\n          100% { transform: rotate(360deg); }\n        }\n      "})]})}const m={id:"background-3d",name:"Background 3D",version:"0.0.2",category:"advanced",icon:l,component:d,capabilities:{supportsChildren:!1,isRootComponent:!1,requiresParent:!0,childrenType:null,allowedChildPlugins:[],maxChildren:null,minChildren:0},ssr:!0,responsive:!0,properties:[{key:"scene.type",type:"select",label:"Scene Type",category:"content",default:"starfield",required:!0,ui:{control:"select",select:{options:[{value:"starfield",label:"✨ Starfield"},{value:"particles",label:"🎆 Particle Flow"},{value:"wave",label:"🌊 Wave Plane"},{value:"physics-cubes",label:"🎲 Physics Cubes"},{value:"holographic",label:"💎 Holographic"},{value:"dark-room",label:"🕯️ Dark Room"},{value:"elegant-wave",label:"〰️ Elegant Wave"},{value:"gradient-mesh",label:"🌈 Gradient Mesh"}]}}},{key:"scene.description",type:"text",label:"Description (SEO)",category:"advanced",default:"",ui:{control:"textarea",textarea:{rows:3,placeholder:"Description for search engines and accessibility"}}},{key:"performance.quality",type:"select",label:"Quality Preset",category:"advanced",default:"auto",ui:{control:"select",select:{options:[{value:"auto",label:"🎯 Auto (Adaptive)"},{value:"high",label:"⭐ High Quality"},{value:"medium",label:"✅ Medium Quality"},{value:"low",label:"⚡ Low Quality (Fast)"}]}}},{key:"performance.maxParticles",type:"range",label:"Max Particles",category:"advanced",default:1e4,ui:{control:"slider",slider:{min:1e3,max:5e4,step:1e3,showValue:!0}}},{key:"camera.autoRotate",type:"toggle",label:"Auto Rotate Camera",category:"advanced",default:!0,ui:{control:"toggle"}},{key:"camera.rotationSpeed",type:"range",label:"Rotation Speed",category:"advanced",default:.5,ui:{control:"slider",slider:{min:.1,max:5,step:.1,showValue:!0}}},{key:"camera.fov",type:"range",label:"Field of View",category:"advanced",default:75,ui:{control:"slider",slider:{min:30,max:120,step:1,showValue:!0}}},{key:"physics.enabled",type:"toggle",label:"Enable Physics",category:"advanced",default:!1,ui:{control:"toggle"}},{key:"layout.height",type:"text",label:"Container Height",category:"layout",default:"100vh",ui:{control:"input",input:{placeholder:"100vh, 600px, 50%"}}},{key:"layout.position",type:"select",label:"Position Type",category:"layout",default:"relative",ui:{control:"select",select:{options:[{value:"relative",label:"Relative"},{value:"absolute",label:"Absolute"},{value:"fixed",label:"Fixed"},{value:"sticky",label:"Sticky"}]}}},{key:"scene.backgroundColor",type:"color",label:"Background Color",category:"style",default:"transparent",ui:{control:"color-picker",colorPicker:{format:"hex",alpha:!0}}}],defaults:{scene:{type:"starfield",description:"Interactive 3D starfield background",keywords:["3d","background","animation","webgl"],backgroundColor:"transparent"},physics:{enabled:!1},performance:{quality:"auto",maxParticles:1e4},camera:{fov:75,autoRotate:!0,rotationSpeed:.5,position:[0,0,5]},layout:{height:"100vh",position:"relative"}},locales:{en:{plugin:{name:"Background 3D",description:"Interactive 3D background with physics and particles"},properties:{"scene.type":{label:"Scene Type",description:"Choose the 3D scene type"},"scene.description":{label:"Description (SEO)",placeholder:"Description for search engines and accessibility",description:"SEO-optimized scene description"},"scene.backgroundColor":{label:"Background Color",description:"Scene background color"},"performance.quality":{label:"Quality Preset",description:"Graphics quality of the scene"},"performance.maxParticles":{label:"Max Particles",description:"Maximum number of particles"},"camera.autoRotate":{label:"Auto Rotate Camera",description:"Enable automatic camera rotation"},"camera.rotationSpeed":{label:"Rotation Speed",description:"Speed of camera rotation"},"camera.fov":{label:"Field of View",description:"Camera field of view"},"physics.enabled":{label:"Enable Physics",description:"Enable physics simulation"},"layout.height":{label:"Container Height",placeholder:"100vh, 600px, 50%",description:"Height of the 3D container"},"layout.position":{label:"Position Type",description:"CSS positioning of the container"}},sceneTypes:{starfield:"✨ Starfield",particles:"🎆 Particle Flow",wave:"🌊 Wave Plane","physics-cubes":"🎲 Physics Cubes",holographic:"💎 Holographic","dark-room":"🕯️ Dark Room","elegant-wave":"〰️ Elegant Wave","gradient-mesh":"🌈 Gradient Mesh"},qualityPresets:{auto:"🎯 Auto (Adaptive)",high:"⭐ High Quality",medium:"✅ Medium Quality",low:"⚡ Low Quality (Fast)"},positionTypes:{relative:"Relative",absolute:"Absolute",fixed:"Fixed",sticky:"Sticky"},categories:{content:"Content",style:"Style",layout:"Layout",advanced:"Advanced"}},de:{plugin:{name:"Hintergrund 3D",description:"Interaktiver 3D-Hintergrund mit Physik und Partikeln"},properties:{"scene.type":{label:"Szenentyp",description:"Wählen Sie den 3D-Szenentyp"},"scene.description":{label:"Beschreibung (SEO)",placeholder:"Beschreibung für Suchmaschinen und Barrierefreiheit",description:"SEO-optimierte Beschreibung der Szene"},"scene.backgroundColor":{label:"Hintergrundfarbe",description:"Farbe des Szenen-Hintergrunds"},"performance.quality":{label:"Qualitäts-Preset",description:"Grafik-Qualität der Szene"},"performance.maxParticles":{label:"Max. Partikel",description:"Maximale Anzahl der Partikel"},"camera.autoRotate":{label:"Kamera Auto-Rotation",description:"Automatische Kamera-Rotation aktivieren"},"camera.rotationSpeed":{label:"Rotationsgeschwindigkeit",description:"Geschwindigkeit der Kamera-Rotation"},"camera.fov":{label:"Sichtfeld",description:"Kamera-Sichtfeld (Field of View)"},"physics.enabled":{label:"Physik aktivieren",description:"Physik-Simulation aktivieren"},"layout.height":{label:"Container-Höhe",placeholder:"100vh, 600px, 50%",description:"Höhe des 3D-Containers"},"layout.position":{label:"Positionstyp",description:"CSS-Positionierung des Containers"}},sceneTypes:{starfield:"✨ Sternenfeld",particles:"🎆 Partikelfluss",wave:"🌊 Wellen-Ebene","physics-cubes":"🎲 Physik-Würfel",holographic:"💎 Holographisch","dark-room":"🕯️ Dunkler Raum","elegant-wave":"〰️ Elegante Welle","gradient-mesh":"🌈 Farbverlauf-Netz"},qualityPresets:{auto:"🎯 Auto (Adaptiv)",high:"⭐ Hohe Qualität",medium:"✅ Mittlere Qualität",low:"⚡ Niedrige Qualität (Schnell)"},positionTypes:{relative:"Relativ",absolute:"Absolut",fixed:"Fixiert",sticky:"Klebend"},categories:{content:"Inhalt",style:"Stil",layout:"Layout",advanced:"Erweitert"}},fr:{plugin:{name:"Fond 3D",description:"Fond 3D interactif avec physique et particules"},properties:{"scene.type":{label:"Type de Scène",description:"Choisissez le type de scène 3D"},"scene.description":{label:"Description (SEO)",placeholder:"Description pour les moteurs de recherche et l'accessibilité",description:"Description optimisée pour le SEO"},"scene.backgroundColor":{label:"Couleur de Fond",description:"Couleur de fond de la scène"},"performance.quality":{label:"Préréglage de Qualité",description:"Qualité graphique de la scène"},"performance.maxParticles":{label:"Particules Max.",description:"Nombre maximum de particules"},"camera.autoRotate":{label:"Rotation Auto. Caméra",description:"Activer la rotation automatique de la caméra"},"camera.rotationSpeed":{label:"Vitesse de Rotation",description:"Vitesse de rotation de la caméra"},"camera.fov":{label:"Champ de Vision",description:"Champ de vision de la caméra"},"physics.enabled":{label:"Activer la Physique",description:"Activer la simulation physique"},"layout.height":{label:"Hauteur du Conteneur",placeholder:"100vh, 600px, 50%",description:"Hauteur du conteneur 3D"},"layout.position":{label:"Type de Position",description:"Positionnement CSS du conteneur"}},sceneTypes:{starfield:"✨ Champ d'Étoiles",particles:"🎆 Flux de Particules",wave:"🌊 Plan d'Onde","physics-cubes":"🎲 Cubes Physiques",holographic:"💎 Holographique","dark-room":"🕯️ Salle Sombre","elegant-wave":"〰️ Vague Élégante","gradient-mesh":"🌈 Maillage Dégradé"},qualityPresets:{auto:"🎯 Auto (Adaptatif)",high:"⭐ Haute Qualité",medium:"✅ Qualité Moyenne",low:"⚡ Basse Qualité (Rapide)"},positionTypes:{relative:"Relatif",absolute:"Absolu",fixed:"Fixe",sticky:"Collant"},categories:{content:"Contenu",style:"Style",layout:"Disposition",advanced:"Avancé"}},es:{plugin:{name:"Fondo 3D",description:"Fondo 3D interactivo con física y partículas"},properties:{"scene.type":{label:"Tipo de Escena",description:"Elija el tipo de escena 3D"},"scene.description":{label:"Descripción (SEO)",placeholder:"Descripción para motores de búsqueda y accesibilidad",description:"Descripción optimizada para SEO"},"scene.backgroundColor":{label:"Color de Fondo",description:"Color de fondo de la escena"},"performance.quality":{label:"Preset de Calidad",description:"Calidad gráfica de la escena"},"performance.maxParticles":{label:"Partículas Máx.",description:"Número máximo de partículas"},"camera.autoRotate":{label:"Rotación Auto. de Cámara",description:"Activar rotación automática de cámara"},"camera.rotationSpeed":{label:"Velocidad de Rotación",description:"Velocidad de rotación de la cámara"},"camera.fov":{label:"Campo de Visión",description:"Campo de visión de la cámara"},"physics.enabled":{label:"Activar Física",description:"Activar simulación física"},"layout.height":{label:"Altura del Contenedor",placeholder:"100vh, 600px, 50%",description:"Altura del contenedor 3D"},"layout.position":{label:"Tipo de Posición",description:"Posicionamiento CSS del contenedor"}},sceneTypes:{starfield:"✨ Campo Estelar",particles:"🎆 Flujo de Partículas",wave:"🌊 Plano de Onda","physics-cubes":"🎲 Cubos Físicos",holographic:"💎 Holográfico","dark-room":"🕯️ Habitación Oscura","elegant-wave":"〰️ Onda Elegante","gradient-mesh":"🌈 Malla de Gradiente"},qualityPresets:{auto:"🎯 Auto (Adaptativo)",high:"⭐ Alta Calidad",medium:"✅ Calidad Media",low:"⚡ Baja Calidad (Rápido)"},positionTypes:{relative:"Relativo",absolute:"Absoluto",fixed:"Fijo",sticky:"Adhesivo"},categories:{content:"Contenido",style:"Estilo",layout:"Diseño",advanced:"Avanzado"}},it:{plugin:{name:"Sfondo 3D",description:"Sfondo 3D interattivo con fisica e particelle"},properties:{"scene.type":{label:"Tipo di Scena",description:"Scegli il tipo di scena 3D"},"scene.description":{label:"Descrizione (SEO)",placeholder:"Descrizione per motori di ricerca e accessibilità",description:"Descrizione ottimizzata per SEO"},"scene.backgroundColor":{label:"Colore di Sfondo",description:"Colore dello sfondo della scena"},"performance.quality":{label:"Preset di Qualità",description:"Qualità grafica della scena"},"performance.maxParticles":{label:"Particelle Max.",description:"Numero massimo di particelle"},"camera.autoRotate":{label:"Rotazione Auto. Fotocamera",description:"Attiva rotazione automatica della fotocamera"},"camera.rotationSpeed":{label:"Velocità di Rotazione",description:"Velocità di rotazione della fotocamera"},"camera.fov":{label:"Campo Visivo",description:"Campo visivo della fotocamera"},"physics.enabled":{label:"Attiva Fisica",description:"Attiva simulazione fisica"},"layout.height":{label:"Altezza Contenitore",placeholder:"100vh, 600px, 50%",description:"Altezza del contenitore 3D"},"layout.position":{label:"Tipo di Posizione",description:"Posizionamento CSS del contenitore"}},sceneTypes:{starfield:"✨ Campo Stellare",particles:"🎆 Flusso di Particelle",wave:"🌊 Piano d'Onda","physics-cubes":"🎲 Cubi Fisici",holographic:"💎 Olografico","dark-room":"🕯️ Stanza Buia","elegant-wave":"〰️ Onda Elegante","gradient-mesh":"🌈 Maglia Gradiente"},qualityPresets:{auto:"🎯 Auto (Adattivo)",high:"⭐ Alta Qualità",medium:"✅ Qualità Media",low:"⚡ Bassa Qualità (Veloce)"},positionTypes:{relative:"Relativo",absolute:"Assoluto",fixed:"Fisso",sticky:"Appiccicoso"},categories:{content:"Contenuto",style:"Stile",layout:"Layout",advanced:"Avanzato"}}},meta:{description:"Interactive 3D background with particle effects, physics, and multiple scene presets",tags:["3d","background","webgl","interactive"]}};function h(e){return r()((a,i)=>({instanceId:e,scene:null,camera:null,renderer:null,isReady:!1,quality:"high",init:i=>{s.registerInstance(e);const t=new n.Scene,o=new n.PerspectiveCamera(75,i.clientWidth/i.clientHeight,.1,1e3);o.position.set(0,0,5);const l=new n.WebGLRenderer({canvas:i,antialias:!0,alpha:!0});return l.setSize(i.clientWidth,i.clientHeight),l.setPixelRatio(Math.min(window.devicePixelRatio,2)),l.__instanceId=e,a({scene:t,camera:o,renderer:l,isReady:!0}),console.log(`[Background3D:${e}] Initialized`),l},setQuality:i=>{a({quality:i}),console.log(`[Background3D:${e}] Quality set to: ${i}`)},dispose:()=>{const{scene:t,renderer:o}=i();t&&t.traverse(e=>{e instanceof n.Mesh&&(e.geometry?.dispose(),Array.isArray(e.material)?e.material.forEach(e=>e.dispose()):e.material?.dispose())}),o&&o.dispose(),s.unregisterInstance(e),a({scene:null,camera:null,renderer:null,isReady:!1}),console.log(`[Background3D:${e}] Disposed`)}}))}export{d as Background3DComponent,m as background3DConfig,h as createBackgroundInstance};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../src/components/background-3d-component.tsx","../src/background-3d-config.ts","../src/locales/index.ts","../src/store/background-store.ts"],"sourcesContent":["\"use client\";\n\nimport { Suspense, lazy } from 'react';\nimport type { Background3DComponentProps } from '../types';\n\n// Dynamic import - only load client-side\nconst InteractiveBackground = lazy(() => import('./interactive-background'));\n\n/**\n * Background 3D Component - Main plugin component\n *\n * Features:\n * - SEO metadata for search engines\n * - SSR-safe with dynamic import\n * - Accessibility content\n * - Interactive WebGL canvas\n */\nexport function Background3DComponent({\n  data,\n  elementId,\n  isEditorMode = false\n}: Background3DComponentProps) {\n\n  return (\n    <div\n      className=\"background-3d-wrapper\"\n      style={{\n        width: '100%',\n        height: data.layout?.height || '100vh',\n        position: data.layout?.position || 'relative',\n        overflow: 'hidden'\n      }}\n    >\n      {/* SEO Content - read by crawlers */}\n      <BackgroundMetadata data={data} />\n\n      {/* Interactive 3D Canvas - client-side only */}\n      <Suspense fallback={<BackgroundPlaceholder />}>\n        <InteractiveBackground\n          instanceId={elementId}\n          data={data}\n          isEditorMode={isEditorMode}\n        />\n      </Suspense>\n    </div>\n  );\n}\n\n/**\n * SEO Metadata Component\n * Provides structured data for search engines\n */\nfunction BackgroundMetadata({ data }: { data: Background3DComponentProps['data'] }) {\n  return (\n    <>\n      {/* Structured Data for Search Engines */}\n      <script\n        type=\"application/ld+json\"\n        dangerouslySetInnerHTML={{\n          __html: JSON.stringify({\n            '@context': 'https://schema.org',\n            '@type': 'WebPageElement',\n            name: data.scene?.type || '3D Background',\n            description: data.scene?.description || 'Interactive 3D background scene',\n            interactionType: 'Interactive',\n            technology: 'WebGL',\n            keywords: data.scene?.keywords || []\n          })\n        }}\n      />\n\n      {/* Hidden content for Accessibility & SEO */}\n      <div className=\"sr-only\" aria-hidden=\"true\">\n        <h2>{data.scene?.type || '3D Background'}</h2>\n        <p>{data.scene?.description || 'Interactive 3D background scene'}</p>\n        {data.scene?.keywords && (\n          <meta name=\"keywords\" content={data.scene.keywords.join(', ')} />\n        )}\n      </div>\n    </>\n  );\n}\n\n/**\n * SSR Placeholder - shown during hydration\n */\nfunction BackgroundPlaceholder() {\n  return (\n    <div\n      style={{\n        width: '100%',\n        height: '100%',\n        background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        position: 'absolute',\n        top: 0,\n        left: 0\n      }}\n      role=\"img\"\n      aria-label=\"3D Background Loading\"\n    >\n      <div\n        style={{\n          width: '40px',\n          height: '40px',\n          border: '4px solid rgba(255, 255, 255, 0.3)',\n          borderTop: '4px solid white',\n          borderRadius: '50%',\n          animation: 'spin 1s linear infinite'\n        }}\n      />\n      <style>{`\n        @keyframes spin {\n          0% { transform: rotate(0deg); }\n          100% { transform: rotate(360deg); }\n        }\n      `}</style>\n    </div>\n  );\n}\n","import type { PluginConfig } from '@codefluss/base-types';\nimport { Background3DComponent } from './components/background-3d-component';\nimport { Sparkles } from 'lucide-react';\nimport background3DLocales from './locales';\n\n/**\n * Background 3D Plugin Configuration\n *\n * Interactive 3D background with multiple scene types\n *\n * Features:\n * - 5 scene presets (Starfield, Particles, Floating, Aurora, Geometric)\n * - Adaptive performance with quality presets\n * - Optional physics simulation\n * - SEO optimized\n * - Multi-instance support\n */\nexport const background3DConfig: PluginConfig = {\n  id: 'background-3d',\n  name: 'Background 3D',\n  version: '0.0.2',\n  category: 'advanced',\n  icon: Sparkles,\n  component: Background3DComponent,\n\n  // Multi-instance support\n  capabilities: {\n    supportsChildren: false,\n    isRootComponent: false,\n    requiresParent: true,\n    childrenType: null,\n    allowedChildPlugins: [],\n    maxChildren: null,\n    minChildren: 0\n  },\n\n  // SSR support\n  ssr: true,\n\n  // Responsive behavior\n  responsive: true,\n\n  // Properties for Context Panel\n  properties: [\n    // Scene Configuration\n    {\n      key: 'scene.type',\n      type: 'select',\n      label: 'Scene Type',\n      category: 'content',\n      default: 'starfield',\n      required: true,\n      ui: {\n        control: 'select',\n        select: {\n          options: [\n            { value: 'starfield', label: '✨ Starfield' },\n            { value: 'particles', label: '🎆 Particle Flow' },\n            { value: 'wave', label: '🌊 Wave Plane' },\n            { value: 'physics-cubes', label: '🎲 Physics Cubes' },\n            { value: 'holographic', label: '💎 Holographic' },\n            { value: 'dark-room', label: '🕯️ Dark Room' },\n            { value: 'elegant-wave', label: '〰️ Elegant Wave' },\n            { value: 'gradient-mesh', label: '🌈 Gradient Mesh' }\n          ]\n        }\n      }\n    },\n    {\n      key: 'scene.description',\n      type: 'text',\n      label: 'Description (SEO)',\n      category: 'advanced',\n      default: '',\n      ui: {\n        control: 'textarea',\n        textarea: {\n          rows: 3,\n          placeholder: 'Description for search engines and accessibility'\n        }\n      }\n    },\n\n    // Performance\n    {\n      key: 'performance.quality',\n      type: 'select',\n      label: 'Quality Preset',\n      category: 'advanced',\n      default: 'auto',\n      ui: {\n        control: 'select',\n        select: {\n          options: [\n            { value: 'auto', label: '🎯 Auto (Adaptive)' },\n            { value: 'high', label: '⭐ High Quality' },\n            { value: 'medium', label: '✅ Medium Quality' },\n            { value: 'low', label: '⚡ Low Quality (Fast)' }\n          ]\n        }\n      }\n    },\n    {\n      key: 'performance.maxParticles',\n      type: 'range',\n      label: 'Max Particles',\n      category: 'advanced',\n      default: 10000,\n      ui: {\n        control: 'slider',\n        slider: {\n          min: 1000,\n          max: 50000,\n          step: 1000,\n          showValue: true\n        }\n      }\n    },\n\n    // Camera\n    {\n      key: 'camera.autoRotate',\n      type: 'toggle',\n      label: 'Auto Rotate Camera',\n      category: 'advanced',\n      default: true,\n      ui: {\n        control: 'toggle'\n      }\n    },\n    {\n      key: 'camera.rotationSpeed',\n      type: 'range',\n      label: 'Rotation Speed',\n      category: 'advanced',\n      default: 0.5,\n      ui: {\n        control: 'slider',\n        slider: {\n          min: 0.1,\n          max: 5.0,\n          step: 0.1,\n          showValue: true\n        }\n      }\n    },\n    {\n      key: 'camera.fov',\n      type: 'range',\n      label: 'Field of View',\n      category: 'advanced',\n      default: 75,\n      ui: {\n        control: 'slider',\n        slider: {\n          min: 30,\n          max: 120,\n          step: 1,\n          showValue: true\n        }\n      }\n    },\n\n    // Physics (optional)\n    {\n      key: 'physics.enabled',\n      type: 'toggle',\n      label: 'Enable Physics',\n      category: 'advanced',\n      default: false,\n      ui: {\n        control: 'toggle'\n      }\n    },\n\n    // Layout\n    {\n      key: 'layout.height',\n      type: 'text',\n      label: 'Container Height',\n      category: 'layout',\n      default: '100vh',\n      ui: {\n        control: 'input',\n        input: {\n          placeholder: '100vh, 600px, 50%'\n        }\n      }\n    },\n    {\n      key: 'layout.position',\n      type: 'select',\n      label: 'Position Type',\n      category: 'layout',\n      default: 'relative',\n      ui: {\n        control: 'select',\n        select: {\n          options: [\n            { value: 'relative', label: 'Relative' },\n            { value: 'absolute', label: 'Absolute' },\n            { value: 'fixed', label: 'Fixed' },\n            { value: 'sticky', label: 'Sticky' }\n          ]\n        }\n      }\n    },\n    {\n      key: 'scene.backgroundColor',\n      type: 'color',\n      label: 'Background Color',\n      category: 'style',\n      default: 'transparent',\n      ui: {\n        control: 'color-picker',\n        colorPicker: {\n          format: 'hex',\n          alpha: true\n        }\n      }\n    }\n  ],\n\n  // Default values\n  defaults: {\n    scene: {\n      type: 'starfield',\n      description: 'Interactive 3D starfield background',\n      keywords: ['3d', 'background', 'animation', 'webgl'],\n      backgroundColor: 'transparent'\n    },\n    physics: {\n      enabled: false\n    },\n    performance: {\n      quality: 'auto',\n      maxParticles: 10000\n    },\n    camera: {\n      fov: 75,\n      autoRotate: true,\n      rotationSpeed: 0.5,\n      position: [0, 0, 5]\n    },\n    layout: {\n      height: '100vh',\n      position: 'relative'\n    }\n  },\n\n  // Locales\n  locales: background3DLocales,\n\n  // Metadata\n  meta: {\n    description: 'Interactive 3D background with particle effects, physics, and multiple scene presets',\n    tags: ['3d', 'background', 'webgl', 'interactive']\n  }\n};\n","import en from './en.json';\nimport de from './de.json';\nimport fr from './fr.json';\nimport es from './es.json';\nimport it from './it.json';\n\nexport default {\n  en,\n  de,\n  fr,\n  es,\n  it,\n};\n","import { createStore } from 'zustand';\nimport * as THREE from 'three';\nimport { resourceManager } from '@codefluss/threejs-shared';\nimport type { QualityLevel } from '@codefluss/threejs-shared';\nimport type { BackgroundStore } from '../types';\n\n/**\n * Create Background Instance Store\n *\n * Factory function for creating instance-based stores for Background-3D\n * Each plugin instance gets its own isolated store\n *\n * @param instanceId - Unique instance identifier (from elementId)\n * @returns Zustand store for this instance\n */\nexport function createBackgroundInstance(instanceId: string) {\n  return createStore<BackgroundStore>()((set, get) => ({\n    instanceId,\n    scene: null,\n    camera: null,\n    renderer: null,\n    isReady: false,\n    quality: 'high',\n\n    /**\n     * Initialize ThreeJS scene\n     */\n    init: (canvasElement: HTMLCanvasElement) => {\n      // Register with ResourceManager\n      resourceManager.registerInstance(instanceId);\n\n      // Create scene\n      const scene = new THREE.Scene();\n\n      // Create camera\n      const camera = new THREE.PerspectiveCamera(\n        75,\n        canvasElement.clientWidth / canvasElement.clientHeight,\n        0.1,\n        1000\n      );\n      camera.position.set(0, 0, 5);\n\n      // Create renderer\n      const renderer = new THREE.WebGLRenderer({\n        canvas: canvasElement,\n        antialias: true,\n        alpha: true\n      });\n\n      renderer.setSize(canvasElement.clientWidth, canvasElement.clientHeight);\n      renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));\n\n      // Instance identifier for debugging\n      (renderer as any).__instanceId = instanceId;\n\n      set({\n        scene,\n        camera,\n        renderer,\n        isReady: true\n      });\n\n      console.log(`[Background3D:${instanceId}] Initialized`);\n\n      return renderer;\n    },\n\n    /**\n     * Set quality level\n     */\n    setQuality: (quality: QualityLevel) => {\n      set({ quality });\n      console.log(`[Background3D:${instanceId}] Quality set to: ${quality}`);\n    },\n\n    /**\n     * Dispose and cleanup\n     */\n    dispose: () => {\n      const { scene, renderer } = get();\n\n      if (scene) {\n        // Dispose all geometries and materials\n        scene.traverse((obj) => {\n          if (obj instanceof THREE.Mesh) {\n            obj.geometry?.dispose();\n\n            if (Array.isArray(obj.material)) {\n              obj.material.forEach(m => m.dispose());\n            } else {\n              obj.material?.dispose();\n            }\n          }\n        });\n      }\n\n      if (renderer) {\n        renderer.dispose();\n      }\n\n      // Unregister from ResourceManager\n      resourceManager.unregisterInstance(instanceId);\n\n      set({\n        scene: null,\n        camera: null,\n        renderer: null,\n        isReady: false\n      });\n\n      console.log(`[Background3D:${instanceId}] Disposed`);\n    }\n  }));\n}\n"],"names":["InteractiveBackground","lazy","import","Background3DComponent","data","elementId","isEditorMode","jsxs","className","style","width","height","layout","position","overflow","children","jsx","BackgroundMetadata","Suspense","fallback","BackgroundPlaceholder","instanceId","Fragment","type","dangerouslySetInnerHTML","__html","JSON","stringify","name","scene","description","interactionType","technology","keywords","content","join","background","display","alignItems","justifyContent","top","left","role","border","borderTop","borderRadius","animation","background3DConfig","id","version","category","icon","Sparkles","component","capabilities","supportsChildren","isRootComponent","requiresParent","childrenType","allowedChildPlugins","maxChildren","minChildren","ssr","responsive","properties","key","label","default","required","ui","control","select","options","value","textarea","rows","placeholder","slider","min","max","step","showValue","input","colorPicker","format","alpha","defaults","backgroundColor","physics","enabled","performance","quality","maxParticles","camera","fov","autoRotate","rotationSpeed","locales","en","de","fr","es","it","meta","tags","createBackgroundInstance","createStore","set","get","renderer","isReady","init","canvasElement","resourceManager","registerInstance","THREE","Scene","PerspectiveCamera","clientWidth","clientHeight","WebGLRenderer","canvas","antialias","setSize","setPixelRatio","Math","window","devicePixelRatio","__instanceId","console","log","setQuality","dispose","traverse","obj","Mesh","geometry","Array","isArray","material","forEach","m","unregisterInstance"],"mappings":"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"}

package/dist/interactive-background-c2gBuha0.js

@@ -0,0 +1,103 @@
+import{jsxs as t,Fragment as e,jsx as r}from"react/jsx-runtime";import{useState as n,useRef as o,useEffect as a,useMemo as i}from"react";import{useFrame as s,useThree as c,Canvas as l}from"@react-three/fiber";import{useInstance as h,globalPerfMonitor as u,InstanceProvider as m}from"@codefluss/threejs-shared";import{createBackgroundInstance as d}from"./index.mjs";import*as f from"three";import{MeshTransmissionMaterial as p,OrbitControls as g}from"@react-three/drei";function y({data:c}){const l=h(),[m,d]=n("high"),[p,g]=n(1e4),y=o(null);a(()=>{const t=c.performance?.maxParticles||1e4,e=c.performance?.quality||"auto";if("auto"!==e)switch(e){case"high":g(t),d("high");break;case"medium":g(Math.floor(.5*t)),d("medium");break;case"low":g(Math.floor(.2*t)),d("low")}else g(t),d("high")},[c.performance]),a(()=>{if("auto"!==c.performance?.quality)return;const t=l.getState().instanceId;u.registerCanvas(t);const e=e=>{const r=e;if(r.detail.instanceId===t){const t=r.detail.quality;d(t);const e=c.performance?.maxParticles||1e4;switch(t){case"high":g(e);break;case"medium":g(Math.floor(.5*e));break;case"low":g(Math.floor(.2*e))}}};return window.addEventListener("performance:quality-change",e),()=>{window.removeEventListener("performance:quality-change",e),u.unregisterCanvas(t)}},[l,c.performance]);const M=i(()=>{const t=new Float32Array(3*p);for(let e=0;e<p;e++){const r=3*e,n=50*Math.random()+10,o=Math.random()*Math.PI*2,a=Math.acos(2*Math.random()-1);t[r]=n*Math.sin(a)*Math.cos(o),t[r+1]=n*Math.sin(a)*Math.sin(o),t[r+2]=n*Math.cos(a)}return t},[p]);s((t,e)=>{if("auto"===c.performance?.quality){const t=1/e,r=l.getState().instanceId;u.updateMetrics(r,t)}if(c.camera?.autoRotate){const e=c.camera?.rotationSpeed||.5;t.camera.position.x=5*Math.sin(t.clock.elapsedTime*e*.1),t.camera.position.z=5*Math.cos(t.clock.elapsedTime*e*.1),t.camera.lookAt(0,0,0)}y.current&&(y.current.rotation.y+=.05*e)});const b="high"===m?2:"medium"===m?1.5:1;/* @__PURE__ */
+return t(e,{children:[
+/* @__PURE__ */r("ambientLight",{intensity:.1}),
+/* @__PURE__ */t("points",{ref:y,children:[
+/* @__PURE__ */r("bufferGeometry",{children:/* @__PURE__ */r("bufferAttribute",{attach:"attributes-position",args:[M,3]})}),
+/* @__PURE__ */r("pointsMaterial",{size:b,sizeAttenuation:!0,transparent:!0,opacity:.8,color:"#ffffff",blending:f.AdditiveBlending,depthWrite:!1})]})]})}function M({data:n}){const a=o(null),c=n.performance?.maxParticles||5e3,[l,h]=i(()=>{const t=new Float32Array(3*c),e=new Float32Array(3*c),r=new f.Color("#667eea"),n=new f.Color("#764ba2");for(let o=0;o<c;o++){const a=3*o;t[a]=20*(Math.random()-.5),t[a+1]=20*(Math.random()-.5),t[a+2]=40*Math.random()-20;const i=Math.random(),s=r.clone().lerp(n,i);e[a]=s.r,e[a+1]=s.g,e[a+2]=s.b}return[t,e]},[c]);return s(t=>{if(!a.current)return;const e=a.current.geometry.attributes.position.array;for(let r=0;r<c;r++){const n=3*r;e[n+2]+=.1;const o=t.clock.elapsedTime;e[n]+=.01*Math.sin(o+.1*r),e[n+1]+=.01*Math.cos(o+.1*r),e[n+2]>20&&(e[n+2]=-20)}a.current.geometry.attributes.position.needsUpdate=!0,a.current.rotation.y=.05*t.clock.elapsedTime}),/* @__PURE__ */t(e,{children:[
+/* @__PURE__ */r("ambientLight",{intensity:.2}),
+/* @__PURE__ */t("points",{ref:a,children:[
+/* @__PURE__ */t("bufferGeometry",{children:[
+/* @__PURE__ */r("bufferAttribute",{attach:"attributes-position",args:[l,3]}),
+/* @__PURE__ */r("bufferAttribute",{attach:"attributes-color",args:[h,3]})]}),
+/* @__PURE__ */r("pointsMaterial",{size:1.5,sizeAttenuation:!0,transparent:!0,opacity:.8,vertexColors:!0,blending:f.AdditiveBlending,depthWrite:!1})]})]})}function b(){const e=o(null),n=o(null),a=o({x:0,y:0}),c=i(()=>new f.PlaneGeometry(20,20,100,100),[]);return s(t=>{if(!e.current||!n.current)return;const r=t.clock.getElapsedTime(),o=e.current.geometry.attributes.position,i=a.current.x,s=a.current.y;for(let e=0;e<o.count;e++){const t=o.getX(e),n=o.getY(e),a=Math.sqrt(Math.pow(t-i,2)+Math.pow(n-s,2)),c=Math.max(0,1-a/5)*Math.sin(2*a-5*r)*.5,l=.3*Math.sin(.5*t+2*r)+.4*Math.cos(.3*n+1.5*r)+.2*Math.sin(.2*(t+n)+1.8*r)+c;o.setZ(e,l)}o.needsUpdate=!0,e.current.geometry.computeVertexNormals(),n.current.geometry!==e.current.geometry&&(n.current.geometry=e.current.geometry)}),/* @__PURE__ */t("group",{rotation:[-Math.PI/3,0,0],onPointerMove:t=>{t.point&&(a.current.x=t.point.x,a.current.y=t.point.z)},children:[
+/* @__PURE__ */r("mesh",{ref:e,geometry:c,children:/* @__PURE__ */r("meshStandardMaterial",{color:"#1a1a2e",side:f.DoubleSide,metalness:.6,roughness:.4})}),
+/* @__PURE__ */r("mesh",{ref:n,geometry:c,position:[0,.1,0],children:/* @__PURE__ */r("meshBasicMaterial",{color:"#4a90e2",wireframe:!0,transparent:!0,opacity:.3})})]})}function w({data:n}){/* @__PURE__ */
+return t(e,{children:[
+/* @__PURE__ */r("ambientLight",{intensity:.5}),
+/* @__PURE__ */r("pointLight",{position:[10,10,10],intensity:1,color:"#ffffff"}),
+/* @__PURE__ */r("pointLight",{position:[-10,-10,-10],intensity:.5,color:"#4a90e2"}),
+/* @__PURE__ */r(b,{})]})}function S({data:n}){const a=o(null),c=i(()=>{const t=[];for(let e=0;e<20;e++)t.push([8*(Math.random()-.5),5*Math.random()+2,8*(Math.random()-.5)]);return t},[]);return s(t=>{if(!a.current)return;const e=t.clock.getElapsedTime();a.current.children.forEach((t,r)=>{if(r>=c.length)return;const n=c[r][1];t.position.y=n+1.5*Math.sin(e+.5*r),t.rotation.x=.3*e+r,t.rotation.y=.2*e+r})}),/* @__PURE__ */t(e,{children:[
+/* @__PURE__ */r("color",{attach:"background",args:["#0a0a0f"]}),
+/* @__PURE__ */r("fog",{attach:"fog",args:["#0a0a0f",5,20]}),
+/* @__PURE__ */r("ambientLight",{intensity:.3}),
+/* @__PURE__ */r("pointLight",{position:[10,10,10],intensity:1,castShadow:!0}),
+/* @__PURE__ */r("spotLight",{position:[0,10,0],angle:.6,penumbra:1,intensity:1.5,castShadow:!0,"shadow-mapSize":[2048,2048]}),
+/* @__PURE__ */t("group",{ref:a,children:[
+/* @__PURE__ */t("mesh",{position:[0,-3,0],receiveShadow:!0,children:[
+/* @__PURE__ */r("boxGeometry",{args:[10,.5,10]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#1a1a1a"})]}),c.map((e,n)=>/* @__PURE__ */t("mesh",{position:e,castShadow:!0,receiveShadow:!0,children:[
+/* @__PURE__ */r("boxGeometry",{args:[.5,.5,.5]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#60a5fa",metalness:.6,roughness:.4})]},n))]})]})}function v(){const e=o(null);return s(t=>{if(!e.current)return;const r=t.clock.getElapsedTime();e.current.rotation.x=.2*r,e.current.rotation.y=.3*r}),/* @__PURE__ */t("mesh",{ref:e,children:[
+/* @__PURE__ */r("icosahedronGeometry",{args:[2,4]}),
+/* @__PURE__ */r(p,{backside:!0,samples:16,resolution:512,transmission:1,roughness:.1,thickness:1.5,chromaticAberration:.5,distortion:.3,color:"#a78bfa"})]})}function x(){const e=o(null);return s(t=>{if(!e.current)return;const r=t.clock.getElapsedTime();e.current.rotation.y=.1*r,e.current.children.forEach((t,e)=>{t.position.y=.5*Math.sin(r+e),t.rotation.x=r*(.5+.1*e),t.rotation.z=r*(.3+.1*e)})}),/* @__PURE__ */t("group",{ref:e,children:[
+/* @__PURE__ */t("mesh",{position:[3,0,0],children:[
+/* @__PURE__ */r("torusGeometry",{args:[.5,.2,16,32]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#60a5fa",emissive:"#60a5fa",emissiveIntensity:.5,metalness:.8,roughness:.2})]}),
+/* @__PURE__ */t("mesh",{position:[-3,0,0],children:[
+/* @__PURE__ */r("torusGeometry",{args:[.5,.2,16,32]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#f472b6",emissive:"#f472b6",emissiveIntensity:.5,metalness:.8,roughness:.2})]}),
+/* @__PURE__ */t("mesh",{position:[0,3,0],children:[
+/* @__PURE__ */r("torusGeometry",{args:[.5,.2,16,32]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#34d399",emissive:"#34d399",emissiveIntensity:.5,metalness:.8,roughness:.2})]})]})}function k({data:n}){/* @__PURE__ */
+return t(e,{children:[
+/* @__PURE__ */r("color",{attach:"background",args:["#0a0a0f"]}),
+/* @__PURE__ */r("ambientLight",{intensity:.5}),
+/* @__PURE__ */r("pointLight",{position:[10,10,10],intensity:2,color:"#a78bfa"}),
+/* @__PURE__ */r("pointLight",{position:[-10,-10,-10],intensity:1.5,color:"#60a5fa"}),
+/* @__PURE__ */r("spotLight",{position:[0,10,0],angle:.6,penumbra:1,intensity:2,color:"#ffffff"}),
+/* @__PURE__ */r(v,{}),
+/* @__PURE__ */r(x,{})]})}function L(){/* @__PURE__ */
+return t("group",{children:[
+/* @__PURE__ */t("mesh",{rotation:[-Math.PI/2,0,0],position:[0,-3,0],receiveShadow:!0,children:[
+/* @__PURE__ */r("planeGeometry",{args:[20,20]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#0a0a0a",roughness:.8,metalness:.2})]}),
+/* @__PURE__ */t("mesh",{position:[0,0,-10],receiveShadow:!0,children:[
+/* @__PURE__ */r("planeGeometry",{args:[20,10]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#0f0f0f",roughness:.9})]}),
+/* @__PURE__ */t("mesh",{position:[-10,0,0],rotation:[0,Math.PI/2,0],receiveShadow:!0,children:[
+/* @__PURE__ */r("planeGeometry",{args:[20,10]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#0f0f0f",roughness:.9})]}),
+/* @__PURE__ */t("mesh",{position:[10,0,0],rotation:[0,-Math.PI/2,0],receiveShadow:!0,children:[
+/* @__PURE__ */r("planeGeometry",{args:[20,10]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#0f0f0f",roughness:.9})]}),
+/* @__PURE__ */t("mesh",{rotation:[Math.PI/2,0,0],position:[0,5,0],receiveShadow:!0,children:[
+/* @__PURE__ */r("planeGeometry",{args:[20,20]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#0a0a0a",roughness:.8})]})]})}function A(){const e=o(null);return s(t=>{if(!e.current)return;const r=t.clock.getElapsedTime();e.current.rotation.y=.5*r,e.current.position.y=.3*Math.sin(r)}),/* @__PURE__ */t("mesh",{ref:e,position:[0,0,-5],castShadow:!0,receiveShadow:!0,children:[
+/* @__PURE__ */r("boxGeometry",{args:[2,2,2]}),
+/* @__PURE__ */r("meshStandardMaterial",{color:"#1a1a1a",roughness:.3,metalness:.7})]})}function I(){const n=o(null),a=o(null),{viewport:i,camera:l}=c();return s(t=>{if(!n.current||!a.current)return;const e=t.pointer.x*i.width/2;n.current.position.set(2*e,3,5),a.current.position.set(2*e,0,-5),l.position.x=.5*t.pointer.x,l.position.y=2+.3*t.pointer.y}),/* @__PURE__ */t(e,{children:[
+/* @__PURE__ */r("object3D",{ref:a}),
+/* @__PURE__ */r("spotLight",{ref:n,intensity:50,angle:.4,penumbra:.5,color:"#ffffff",castShadow:!0,"shadow-mapSize":[2048,2048],target:a.current||void 0})]})}function P(){const e=o(null),n=i(()=>{const t=new Float32Array(1500);for(let e=0;e<500;e++)t[3*e]=18*(Math.random()-.5),t[3*e+1]=8*Math.random()-3,t[3*e+2]=18*(Math.random()-.5)-5;return t},[]);return s(t=>{if(!e.current)return;const r=t.clock.getElapsedTime(),n=e.current.geometry.attributes.position.array;for(let e=0;e<n.length;e+=3)n[e+1]+=.001*Math.sin(r+n[e]);e.current.geometry.attributes.position.needsUpdate=!0}),/* @__PURE__ */t("points",{ref:e,children:[
+/* @__PURE__ */r("bufferGeometry",{children:/* @__PURE__ */r("bufferAttribute",{attach:"attributes-position",args:[n,3]})}),
+/* @__PURE__ */r("pointsMaterial",{size:.02,color:"#333333",transparent:!0,opacity:.3})]})}function G({data:n}){/* @__PURE__ */
+return t(e,{children:[
+/* @__PURE__ */r("color",{attach:"background",args:["#000000"]}),
+/* @__PURE__ */r("fog",{attach:"fog",args:["#000000",5,20]}),
+/* @__PURE__ */r("ambientLight",{intensity:.05,color:"#ffffff"}),
+/* @__PURE__ */r(L,{}),
+/* @__PURE__ */r(A,{}),
+/* @__PURE__ */r(I,{}),
+/* @__PURE__ */r(P,{})]})}function z(){const t=o(null),e=o({x:0,y:0}),n=i(()=>new f.PlaneGeometry(20,20,100,100),[]);return s(r=>{if(!t.current)return;const n=r.clock.getElapsedTime(),o=t.current.geometry.attributes.position;for(let t=0;t<o.count;t++){const r=o.getX(t),a=o.getY(t),i=Math.sqrt(Math.pow(r-e.current.x,2)+Math.pow(a-e.current.y,2)),s=.3*Math.sin(.5*r+.5*n)+.4*Math.sin(.3*a+.3*n)+.2*Math.sin(.2*(r+a)+.4*n)+Math.sin(2*i-3*n)*Math.exp(.3*-i)*.8;o.setZ(t,s)}o.needsUpdate=!0,t.current.geometry.computeVertexNormals(),t.current.rotation.z=.05*Math.sin(.1*n)}),/* @__PURE__ */r("mesh",{ref:t,geometry:n,rotation:[-Math.PI/2.5,0,0],onPointerMove:t=>{t.point&&(e.current.x=t.point.x,e.current.y=t.point.z)},children:/* @__PURE__ */r("meshStandardMaterial",{color:"#1a1a2e",side:f.DoubleSide,metalness:.8,roughness:.2,emissive:"#0f3460",emissiveIntensity:.3})})}function E(){const e=o(null),n=o({x:0,y:0}),[a,c]=i(()=>{const t=2e3,e=new Float32Array(6e3),r=new Float32Array(6e3);for(let n=0;n<t;n++){e[3*n]=30*(Math.random()-.5),e[3*n+1]=30*(Math.random()-.5),e[3*n+2]=15*(Math.random()-.5);const t=new f.Color;t.setHSL(.6+.1*Math.random(),.8,.6),r[3*n]=t.r,r[3*n+1]=t.g,r[3*n+2]=t.b}return[e,r]},[]);return s(t=>{if(!e.current)return;const r=t.clock.getElapsedTime(),o=e.current.geometry.attributes.position.array;for(let e=0;e<o.length;e+=3){const t=o[e],a=o[e+1];o[e+2]+=.002*Math.sin(r+.5*t+.3*a);const i=10*n.current.x-t,s=10*n.current.y-a;Math.sqrt(i*i+s*s)<5&&(o[e]+=.001*i,o[e+1]+=.001*s)}e.current.geometry.attributes.position.needsUpdate=!0}),/* @__PURE__ */t("points",{ref:e,children:[
+/* @__PURE__ */t("bufferGeometry",{children:[
+/* @__PURE__ */r("bufferAttribute",{attach:"attributes-position",args:[a,3]}),
+/* @__PURE__ */r("bufferAttribute",{attach:"attributes-color",args:[c,3]})]}),
+/* @__PURE__ */r("pointsMaterial",{size:.05,vertexColors:!0,transparent:!0,opacity:.6,sizeAttenuation:!0})]})}function T({data:n}){/* @__PURE__ */
+return t(e,{children:[
+/* @__PURE__ */r("color",{attach:"background",args:["#0a0a0f"]}),
+/* @__PURE__ */r("ambientLight",{intensity:.3,color:"#ffffff"}),
+/* @__PURE__ */r("pointLight",{position:[10,10,10],intensity:1,color:"#4a90e2"}),
+/* @__PURE__ */r("pointLight",{position:[-10,-10,-10],intensity:.5,color:"#e94560"}),
+/* @__PURE__ */r("spotLight",{position:[0,15,0],angle:.3,penumbra:1,intensity:1,color:"#ffffff",castShadow:!0}),
+/* @__PURE__ */r(z,{}),
+/* @__PURE__ */r(E,{}),
+/* @__PURE__ */r(g,{enableZoom:!1,enablePan:!1,maxPolarAngle:Math.PI/2,minPolarAngle:Math.PI/3})]})}function q(){const e=o(null),n=o(null),a=i(()=>new f.PlaneGeometry(20,20,100,100),[]);return s(t=>{if(!e.current)return;const r=t.clock.getElapsedTime(),o=e.current.geometry.attributes.position,a=e.current.geometry.attributes.color;if(!a){const t=new Float32Array(3*o.count);e.current.geometry.setAttribute("color",new f.BufferAttribute(t,3))}for(let e=0;e<o.count;e++){const t=o.getX(e),n=o.getY(e),i=1.5*Math.sin(.3*t+.5*r)+1.5*Math.cos(.3*n+.3*r)+1*Math.sin(.2*(t+n)+.4*r);o.setZ(e,i);const s=(t+10)/20,c=(n+10)/20,l=(i+4)/8,h=.5*Math.sin(s*Math.PI+.2*r)+.5,u=.5*Math.sin(c*Math.PI+.3*r)+.5,m=.5*Math.sin(l*Math.PI+.4*r)+.5;a&&a.setXYZ(e,h,u,m)}o.needsUpdate=!0,a&&(a.needsUpdate=!0),e.current.geometry.computeVertexNormals(),n.current&&n.current.geometry!==e.current.geometry&&(n.current.geometry=e.current.geometry),e.current.rotation.x=.1*Math.sin(.1*r),e.current.rotation.y=.1*Math.cos(.15*r)}),/* @__PURE__ */t("group",{children:[
+/* @__PURE__ */r("mesh",{ref:e,geometry:a,children:/* @__PURE__ */r("meshStandardMaterial",{vertexColors:!0,side:f.DoubleSide,metalness:.5,roughness:.3})}),
+/* @__PURE__ */r("mesh",{ref:n,geometry:a,position:[0,.1,0],children:/* @__PURE__ */r("meshBasicMaterial",{color:"#ffffff",wireframe:!0,transparent:!0,opacity:.1})})]})}function C({data:n}){/* @__PURE__ */
+return t(e,{children:[
+/* @__PURE__ */r("color",{attach:"background",args:["#000000"]}),
+/* @__PURE__ */r("ambientLight",{intensity:.5}),
+/* @__PURE__ */r("pointLight",{position:[10,10,10],intensity:2,color:"#8b5cf6"}),
+/* @__PURE__ */r("pointLight",{position:[-10,-10,-10],intensity:1.5,color:"#4c1d95"}),
+/* @__PURE__ */r("spotLight",{position:[0,15,0],angle:.6,penumbra:1,intensity:2,color:"#ffffff"}),
+/* @__PURE__ */r(q,{})]})}function F({instanceId:t,data:e,isEditorMode:i}){const s=o(null),[c,h]=n(i);a(()=>{if(i)return;const t=s.current;if(!t)return;const e=new IntersectionObserver(([t])=>{h(t.isIntersecting)},{threshold:.1,rootMargin:"100px"});return e.observe(t),()=>e.disconnect()},[i]);const u=function(t){switch(t){case"starfield":default:return y;case"particles":return M;case"wave":return w;case"physics-cubes":return S;case"holographic":return k;case"dark-room":return G;case"elegant-wave":return T;case"gradient-mesh":return C}}(e.scene?.type);/* @__PURE__ */
+return r("div",{ref:s,style:{width:"100%",height:"100%",position:"absolute",top:0,left:0},children:c&&/* @__PURE__ */r(m,{instanceId:t,createStore:d,children:/* @__PURE__ */r(l,{camera:{position:e.camera?.position||[0,0,5],fov:e.camera?.fov||75},dpr:[1,2],performance:{min:.5},style:{background:e.scene?.backgroundColor||"transparent"},children:/* @__PURE__ */r(u,{data:e})})})})}export{F as default};
+//# sourceMappingURL=interactive-background-c2gBuha0.js.map

package/dist/interactive-background-c2gBuha0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interactive-background-c2gBuha0.js","sources":["../src/scenes/starfield-scene.tsx","../src/scenes/particle-flow-scene.tsx","../src/scenes/wave-scene.tsx","../src/scenes/physics-cubes-scene.tsx","../src/scenes/holographic-scene.tsx","../src/scenes/dark-room-scene.tsx","../src/scenes/elegant-wave-scene.tsx","../src/scenes/gradient-mesh-scene.tsx","../src/components/interactive-background.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState, useMemo, useRef } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport { useInstance, globalPerfMonitor, type QualityLevel } from '@codefluss/threejs-shared';\nimport * as THREE from 'three';\nimport type { SceneContentProps, BackgroundStore } from '../types';\n\n/**\n * Starfield Scene - Animated star field background\n *\n * Features:\n * - Adaptive particle count based on performance\n * - Auto-rotating camera (optional)\n * - FPS tracking for performance monitoring\n */\nexport function StarfieldScene({ data }: SceneContentProps) {\n  const instance = useInstance<BackgroundStore>();\n  const [quality, setQuality] = useState<QualityLevel>('high');\n  const [particleCount, setParticleCount] = useState(10000);\n  const pointsRef = useRef<THREE.Points>(null);\n\n  // Determine initial particle count\n  useEffect(() => {\n    const baseCount = data.performance?.maxParticles || 10000;\n    const qualitySetting = data.performance?.quality || 'auto';\n\n    if (qualitySetting !== 'auto') {\n      // Manual quality setting\n      switch (qualitySetting) {\n        case 'high':\n          setParticleCount(baseCount);\n          setQuality('high');\n          break;\n        case 'medium':\n          setParticleCount(Math.floor(baseCount * 0.5));\n          setQuality('medium');\n          break;\n        case 'low':\n          setParticleCount(Math.floor(baseCount * 0.2));\n          setQuality('low');\n          break;\n      }\n    } else {\n      // Auto mode - start with high\n      setParticleCount(baseCount);\n      setQuality('high');\n    }\n  }, [data.performance]);\n\n  // Listen to global performance changes (auto mode only)\n  useEffect(() => {\n    if (data.performance?.quality !== 'auto') return;\n\n    const instanceId = instance.getState().instanceId;\n    globalPerfMonitor.registerCanvas(instanceId);\n\n    const handleQualityChange = (e: Event) => {\n      const customEvent = e as CustomEvent;\n      if (customEvent.detail.instanceId === instanceId) {\n        const newQuality = customEvent.detail.quality as QualityLevel;\n        setQuality(newQuality);\n\n        const baseCount = data.performance?.maxParticles || 10000;\n        switch (newQuality) {\n          case 'high':\n            setParticleCount(baseCount);\n            break;\n          case 'medium':\n            setParticleCount(Math.floor(baseCount * 0.5));\n            break;\n          case 'low':\n            setParticleCount(Math.floor(baseCount * 0.2));\n            break;\n        }\n      }\n    };\n\n    window.addEventListener('performance:quality-change', handleQualityChange);\n\n    return () => {\n      window.removeEventListener('performance:quality-change', handleQualityChange);\n      globalPerfMonitor.unregisterCanvas(instanceId);\n    };\n  }, [instance, data.performance]);\n\n  // Generate star positions\n  const positions = useMemo(() => {\n    const positions = new Float32Array(particleCount * 3);\n\n    for (let i = 0; i < particleCount; i++) {\n      const i3 = i * 3;\n\n      // Random position in sphere\n      const radius = Math.random() * 50 + 10;\n      const theta = Math.random() * Math.PI * 2;\n      const phi = Math.acos(Math.random() * 2 - 1);\n\n      positions[i3] = radius * Math.sin(phi) * Math.cos(theta);\n      positions[i3 + 1] = radius * Math.sin(phi) * Math.sin(theta);\n      positions[i3 + 2] = radius * Math.cos(phi);\n    }\n\n    return positions;\n  }, [particleCount]);\n\n  // Animation and FPS tracking\n  useFrame((state, delta) => {\n    // Track FPS for auto quality\n    if (data.performance?.quality === 'auto') {\n      const fps = 1 / delta;\n      const instanceId = instance.getState().instanceId;\n      globalPerfMonitor.updateMetrics(instanceId, fps);\n    }\n\n    // Auto-rotate camera\n    if (data.camera?.autoRotate) {\n      const speed = data.camera?.rotationSpeed || 0.5;\n      state.camera.position.x = Math.sin(state.clock.elapsedTime * speed * 0.1) * 5;\n      state.camera.position.z = Math.cos(state.clock.elapsedTime * speed * 0.1) * 5;\n      state.camera.lookAt(0, 0, 0);\n    }\n\n    // Rotate stars slowly\n    if (pointsRef.current) {\n      pointsRef.current.rotation.y += delta * 0.05;\n    }\n  });\n\n  // Point size based on quality\n  const pointSize = quality === 'high' ? 2 : quality === 'medium' ? 1.5 : 1;\n\n  return (\n    <>\n      {/* Ambient light */}\n      <ambientLight intensity={0.1} />\n\n      {/* Stars */}\n      <points ref={pointsRef}>\n        <bufferGeometry>\n          <bufferAttribute\n            attach=\"attributes-position\"\n            args={[positions, 3]}\n          />\n        </bufferGeometry>\n        <pointsMaterial\n          size={pointSize}\n          sizeAttenuation\n          transparent\n          opacity={0.8}\n          color=\"#ffffff\"\n          blending={THREE.AdditiveBlending}\n          depthWrite={false}\n        />\n      </points>\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef, useMemo } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * Particle Flow Scene - Flowing particle stream background\n *\n * Features:\n * - Continuous particle flow animation\n * - Color gradients\n * - Wave-like motion\n */\nexport function ParticleFlowScene({ data }: SceneContentProps) {\n  const particlesRef = useRef<THREE.Points>(null);\n  const particleCount = data.performance?.maxParticles || 5000;\n\n  // Generate initial particle positions\n  const [positions, colors] = useMemo(() => {\n    const positions = new Float32Array(particleCount * 3);\n    const colors = new Float32Array(particleCount * 3);\n\n    const colorStart = new THREE.Color('#667eea');\n    const colorEnd = new THREE.Color('#764ba2');\n\n    for (let i = 0; i < particleCount; i++) {\n      const i3 = i * 3;\n\n      // Position in flow path\n      positions[i3] = (Math.random() - 0.5) * 20;\n      positions[i3 + 1] = (Math.random() - 0.5) * 20;\n      positions[i3 + 2] = Math.random() * 40 - 20;\n\n      // Color gradient\n      const mixRatio = Math.random();\n      const color = colorStart.clone().lerp(colorEnd, mixRatio);\n\n      colors[i3] = color.r;\n      colors[i3 + 1] = color.g;\n      colors[i3 + 2] = color.b;\n    }\n\n    return [positions, colors];\n  }, [particleCount]);\n\n  // Animation\n  useFrame((state) => {\n    if (!particlesRef.current) return;\n\n    const positions = particlesRef.current.geometry.attributes.position.array as Float32Array;\n\n    // Update particle positions\n    for (let i = 0; i < particleCount; i++) {\n      const i3 = i * 3;\n\n      // Move particles forward\n      positions[i3 + 2] += 0.1;\n\n      // Add wave motion\n      const time = state.clock.elapsedTime;\n      positions[i3] += Math.sin(time + i * 0.1) * 0.01;\n      positions[i3 + 1] += Math.cos(time + i * 0.1) * 0.01;\n\n      // Reset particles that moved too far\n      if (positions[i3 + 2] > 20) {\n        positions[i3 + 2] = -20;\n      }\n    }\n\n    particlesRef.current.geometry.attributes.position.needsUpdate = true;\n\n    // Rotate slowly\n    particlesRef.current.rotation.y = state.clock.elapsedTime * 0.05;\n  });\n\n  return (\n    <>\n      {/* Ambient light */}\n      <ambientLight intensity={0.2} />\n\n      {/* Particles */}\n      <points ref={particlesRef}>\n        <bufferGeometry>\n          <bufferAttribute\n            attach=\"attributes-position\"\n            args={[positions, 3]}\n          />\n          <bufferAttribute\n            attach=\"attributes-color\"\n            args={[colors, 3]}\n          />\n        </bufferGeometry>\n        <pointsMaterial\n          size={1.5}\n          sizeAttenuation\n          transparent\n          opacity={0.8}\n          vertexColors\n          blending={THREE.AdditiveBlending}\n          depthWrite={false}\n        />\n      </points>\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef, useMemo } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * WaveScene - Interactive wave plane with mouse tracking\n *\n * Features:\n * - Dual wave layers (solid + wireframe)\n * - Mouse-influenced ripples\n * - Smooth wave animations\n * - Responsive to user interaction\n */\n\nfunction WavePlane() {\n  const meshRef = useRef<THREE.Mesh>(null);\n  const wireframeMeshRef = useRef<THREE.Mesh>(null);\n  const mousePosition = useRef({ x: 0, y: 0 });\n\n  const geometry = useMemo(() => new THREE.PlaneGeometry(20, 20, 100, 100), []);\n\n  const handlePointerMove = (event: { point?: THREE.Vector3 }) => {\n    if (event.point) {\n      // Direct mapping without inversion or scaling\n      mousePosition.current.x = event.point.x;\n      mousePosition.current.y = event.point.z;\n    }\n  };\n\n  useFrame((state) => {\n    if (!meshRef.current || !wireframeMeshRef.current) return;\n\n    const time = state.clock.getElapsedTime();\n    const positions = meshRef.current.geometry.attributes.position;\n    const mouseX = mousePosition.current.x;\n    const mouseY = mousePosition.current.y;\n\n    // Animate wave vertices\n    for (let i = 0; i < positions.count; i++) {\n      const x = positions.getX(i);\n      const y = positions.getY(i);\n\n      // Distance from mouse (no additional scaling needed)\n      const distanceToMouse = Math.sqrt(\n        Math.pow(x - mouseX, 2) + Math.pow(y - mouseY, 2)\n      );\n\n      // Mouse influence ripple\n      const mouseInfluence =\n        Math.max(0, 1 - distanceToMouse / 5) *\n        Math.sin(distanceToMouse * 2 - time * 5) *\n        0.5;\n\n      // Wave layers\n      const wave1 = Math.sin(x * 0.5 + time * 2) * 0.3;\n      const wave2 = Math.cos(y * 0.3 + time * 1.5) * 0.4;\n      const wave3 = Math.sin((x + y) * 0.2 + time * 1.8) * 0.2;\n\n      const z = wave1 + wave2 + wave3 + mouseInfluence;\n      positions.setZ(i, z);\n    }\n\n    positions.needsUpdate = true;\n    meshRef.current.geometry.computeVertexNormals();\n\n    // Sync wireframe geometry\n    if (wireframeMeshRef.current.geometry !== meshRef.current.geometry) {\n      wireframeMeshRef.current.geometry = meshRef.current.geometry;\n    }\n  });\n\n  return (\n    <group rotation={[-Math.PI / 3, 0, 0]} onPointerMove={handlePointerMove}>\n      {/* Solid wave layer */}\n      <mesh ref={meshRef} geometry={geometry}>\n        <meshStandardMaterial\n          color=\"#1a1a2e\"\n          side={THREE.DoubleSide}\n          metalness={0.6}\n          roughness={0.4}\n        />\n      </mesh>\n\n      {/* Wireframe layer */}\n      <mesh ref={wireframeMeshRef} geometry={geometry} position={[0, 0.1, 0]}>\n        <meshBasicMaterial\n          color=\"#4a90e2\"\n          wireframe\n          transparent\n          opacity={0.3}\n        />\n      </mesh>\n    </group>\n  );\n}\n\nexport function WaveScene({ data: _ }: SceneContentProps) {\n  return (\n    <>\n      <ambientLight intensity={0.5} />\n      <pointLight position={[10, 10, 10]} intensity={1} color=\"#ffffff\" />\n      <pointLight position={[-10, -10, -10]} intensity={0.5} color=\"#4a90e2\" />\n\n      <WavePlane />\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef, useMemo } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * PhysicsCubesScene - Animated falling cubes\n *\n * Note: Physics simulation (Rapier) is disabled for Storybook compatibility.\n * Uses simplified animation instead.\n *\n * Features:\n * - Animated cubes with rotation\n * - Floating animation\n * - Visual floor and scene\n */\n\nexport function PhysicsCubesScene({ data: _ }: SceneContentProps) {\n  const cubeCount = 20;\n  const cubesRef = useRef<THREE.Group>(null);\n\n  const cubePositions = useMemo(() => {\n    const positions: [number, number, number][] = [];\n    for (let i = 0; i < cubeCount; i++) {\n      positions.push([\n        (Math.random() - 0.5) * 8,\n        Math.random() * 5 + 2,\n        (Math.random() - 0.5) * 8\n      ]);\n    }\n    return positions;\n  }, []);\n\n  useFrame((state) => {\n    if (!cubesRef.current) return;\n    const time = state.clock.getElapsedTime();\n\n    cubesRef.current.children.forEach((cube, i) => {\n      if (i >= cubePositions.length) return; // Floor mesh\n\n      const baseY = cubePositions[i][1];\n      cube.position.y = baseY + Math.sin(time + i * 0.5) * 1.5;\n      cube.rotation.x = time * 0.3 + i;\n      cube.rotation.y = time * 0.2 + i;\n    });\n  });\n\n  return (\n    <>\n      <color attach=\"background\" args={['#0a0a0f']} />\n      <fog attach=\"fog\" args={['#0a0a0f', 5, 20]} />\n\n      <ambientLight intensity={0.3} />\n      <pointLight position={[10, 10, 10]} intensity={1} castShadow />\n      <spotLight\n        position={[0, 10, 0]}\n        angle={0.6}\n        penumbra={1}\n        intensity={1.5}\n        castShadow\n        shadow-mapSize={[2048, 2048]}\n      />\n\n      <group ref={cubesRef}>\n        {/* Floor */}\n        <mesh position={[0, -3, 0]} receiveShadow>\n          <boxGeometry args={[10, 0.5, 10]} />\n          <meshStandardMaterial color=\"#1a1a1a\" />\n        </mesh>\n\n        {/* Animated Cubes */}\n        {cubePositions.map((pos, i) => (\n          <mesh key={i} position={pos} castShadow receiveShadow>\n            <boxGeometry args={[0.5, 0.5, 0.5]} />\n            <meshStandardMaterial\n              color=\"#60a5fa\"\n              metalness={0.6}\n              roughness={0.4}\n            />\n          </mesh>\n        ))}\n      </group>\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport { MeshTransmissionMaterial } from '@react-three/drei';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * HolographicScene - Holographic sphere with floating shapes\n *\n * Features:\n * - MeshTransmissionMaterial for glass/holographic effect\n * - Floating torus shapes\n * - Chromatic aberration and distortion\n * - Smooth rotation animations\n */\n\nfunction HolographicSphere() {\n  const meshRef = useRef<THREE.Mesh>(null);\n\n  useFrame((state) => {\n    if (!meshRef.current) return;\n    const time = state.clock.getElapsedTime();\n\n    meshRef.current.rotation.x = time * 0.2;\n    meshRef.current.rotation.y = time * 0.3;\n  });\n\n  return (\n    <mesh ref={meshRef}>\n      <icosahedronGeometry args={[2, 4]} />\n      <MeshTransmissionMaterial\n        backside\n        samples={16}\n        resolution={512}\n        transmission={1}\n        roughness={0.1}\n        thickness={1.5}\n        chromaticAberration={0.5}\n        distortion={0.3}\n        color=\"#a78bfa\"\n      />\n    </mesh>\n  );\n}\n\nfunction FloatingShapes() {\n  const group = useRef<THREE.Group>(null);\n\n  useFrame((state) => {\n    if (!group.current) return;\n    const time = state.clock.getElapsedTime();\n\n    group.current.rotation.y = time * 0.1;\n\n    group.current.children.forEach((child, i) => {\n      child.position.y = Math.sin(time + i) * 0.5;\n      child.rotation.x = time * (0.5 + i * 0.1);\n      child.rotation.z = time * (0.3 + i * 0.1);\n    });\n  });\n\n  return (\n    <group ref={group}>\n      <mesh position={[3, 0, 0]}>\n        <torusGeometry args={[0.5, 0.2, 16, 32]} />\n        <meshStandardMaterial\n          color=\"#60a5fa\"\n          emissive=\"#60a5fa\"\n          emissiveIntensity={0.5}\n          metalness={0.8}\n          roughness={0.2}\n        />\n      </mesh>\n\n      <mesh position={[-3, 0, 0]}>\n        <torusGeometry args={[0.5, 0.2, 16, 32]} />\n        <meshStandardMaterial\n          color=\"#f472b6\"\n          emissive=\"#f472b6\"\n          emissiveIntensity={0.5}\n          metalness={0.8}\n          roughness={0.2}\n        />\n      </mesh>\n\n      <mesh position={[0, 3, 0]}>\n        <torusGeometry args={[0.5, 0.2, 16, 32]} />\n        <meshStandardMaterial\n          color=\"#34d399\"\n          emissive=\"#34d399\"\n          emissiveIntensity={0.5}\n          metalness={0.8}\n          roughness={0.2}\n        />\n      </mesh>\n    </group>\n  );\n}\n\nexport function HolographicScene({ data: _ }: SceneContentProps) {\n  return (\n    <>\n      <color attach=\"background\" args={['#0a0a0f']} />\n\n      <ambientLight intensity={0.5} />\n      <pointLight position={[10, 10, 10]} intensity={2} color=\"#a78bfa\" />\n      <pointLight position={[-10, -10, -10]} intensity={1.5} color=\"#60a5fa\" />\n      <spotLight\n        position={[0, 10, 0]}\n        angle={0.6}\n        penumbra={1}\n        intensity={2}\n        color=\"#ffffff\"\n      />\n\n      <HolographicSphere />\n      <FloatingShapes />\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef, useMemo } from 'react';\nimport { useFrame, useThree } from '@react-three/fiber';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * DarkRoomScene - Dark room with spotlight\n *\n * Features:\n * - Enclosed room environment\n * - Mouse-following spotlight\n * - Floating particles\n * - Camera parallax effect\n */\n\nfunction DarkRoom() {\n  return (\n    <group>\n      {/* Floor */}\n      <mesh rotation={[-Math.PI / 2, 0, 0]} position={[0, -3, 0]} receiveShadow>\n        <planeGeometry args={[20, 20]} />\n        <meshStandardMaterial color=\"#0a0a0a\" roughness={0.8} metalness={0.2} />\n      </mesh>\n\n      {/* Walls */}\n      <mesh position={[0, 0, -10]} receiveShadow>\n        <planeGeometry args={[20, 10]} />\n        <meshStandardMaterial color=\"#0f0f0f\" roughness={0.9} />\n      </mesh>\n\n      <mesh position={[-10, 0, 0]} rotation={[0, Math.PI / 2, 0]} receiveShadow>\n        <planeGeometry args={[20, 10]} />\n        <meshStandardMaterial color=\"#0f0f0f\" roughness={0.9} />\n      </mesh>\n\n      <mesh position={[10, 0, 0]} rotation={[0, -Math.PI / 2, 0]} receiveShadow>\n        <planeGeometry args={[20, 10]} />\n        <meshStandardMaterial color=\"#0f0f0f\" roughness={0.9} />\n      </mesh>\n\n      {/* Ceiling */}\n      <mesh rotation={[Math.PI / 2, 0, 0]} position={[0, 5, 0]} receiveShadow>\n        <planeGeometry args={[20, 20]} />\n        <meshStandardMaterial color=\"#0a0a0a\" roughness={0.8} />\n      </mesh>\n    </group>\n  );\n}\n\nfunction CenterObject() {\n  const meshRef = useRef<THREE.Mesh>(null);\n\n  useFrame((state) => {\n    if (!meshRef.current) return;\n    const time = state.clock.getElapsedTime();\n    meshRef.current.rotation.y = time * 0.5;\n    meshRef.current.position.y = Math.sin(time) * 0.3;\n  });\n\n  return (\n    <mesh ref={meshRef} position={[0, 0, -5]} castShadow receiveShadow>\n      <boxGeometry args={[2, 2, 2]} />\n      <meshStandardMaterial\n        color=\"#1a1a1a\"\n        roughness={0.3}\n        metalness={0.7}\n      />\n    </mesh>\n  );\n}\n\nfunction Spotlight() {\n  const lightRef = useRef<THREE.SpotLight>(null);\n  const targetRef = useRef<THREE.Object3D>(null);\n  const { viewport, camera } = useThree();\n\n  useFrame((state) => {\n    if (!lightRef.current || !targetRef.current) return;\n\n    const x = (state.pointer.x * viewport.width) / 2;\n\n    lightRef.current.position.set(x * 2, 3, 5);\n    targetRef.current.position.set(x * 2, 0, -5);\n\n    // Parallax effect\n    camera.position.x = state.pointer.x * 0.5;\n    camera.position.y = 2 + state.pointer.y * 0.3;\n  });\n\n  return (\n    <>\n      <object3D ref={targetRef} />\n      <spotLight\n        ref={lightRef}\n        intensity={50}\n        angle={0.4}\n        penumbra={0.5}\n        color=\"#ffffff\"\n        castShadow\n        shadow-mapSize={[2048, 2048]}\n        target={targetRef.current || undefined}\n      />\n    </>\n  );\n}\n\nfunction FloatingParticles() {\n  const particlesRef = useRef<THREE.Points>(null);\n\n  const positions = useMemo(() => {\n    const count = 500;\n    const pos = new Float32Array(count * 3);\n\n    for (let i = 0; i < count; i++) {\n      pos[i * 3] = (Math.random() - 0.5) * 18;\n      pos[i * 3 + 1] = Math.random() * 8 - 3;\n      pos[i * 3 + 2] = (Math.random() - 0.5) * 18 - 5;\n    }\n\n    return pos;\n  }, []);\n\n  useFrame((state) => {\n    if (!particlesRef.current) return;\n\n    const time = state.clock.getElapsedTime();\n    const positions = particlesRef.current.geometry.attributes.position\n      .array as Float32Array;\n\n    for (let i = 0; i < positions.length; i += 3) {\n      positions[i + 1] += Math.sin(time + positions[i]) * 0.001;\n    }\n\n    particlesRef.current.geometry.attributes.position.needsUpdate = true;\n  });\n\n  return (\n    <points ref={particlesRef}>\n      <bufferGeometry>\n        <bufferAttribute\n          attach=\"attributes-position\"\n          args={[positions, 3]}\n        />\n      </bufferGeometry>\n      <pointsMaterial size={0.02} color=\"#333333\" transparent opacity={0.3} />\n    </points>\n  );\n}\n\nexport function DarkRoomScene({ data: _ }: SceneContentProps) {\n  return (\n    <>\n      <color attach=\"background\" args={['#000000']} />\n      <fog attach=\"fog\" args={['#000000', 5, 20]} />\n\n      <ambientLight intensity={0.05} color=\"#ffffff\" />\n\n      <DarkRoom />\n      <CenterObject />\n      <Spotlight />\n      <FloatingParticles />\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef, useMemo } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport { OrbitControls } from '@react-three/drei';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * ElegantWaveScene - Multiple wave layers with particle attraction\n *\n * Features:\n * - Elegant wave plane with mouse interaction\n * - Multiple wave layers for complex motion\n * - Floating particles with mouse attraction\n * - Gentle rotation and color effects\n */\n\nfunction ElegantWaves() {\n  const meshRef = useRef<THREE.Mesh>(null);\n  const mouseRef = useRef({ x: 0, y: 0 });\n\n  const geometry = useMemo(() => {\n    return new THREE.PlaneGeometry(20, 20, 100, 100);\n  }, []);\n\n  const handlePointerMove = (event: { point?: THREE.Vector3 }) => {\n    if (event.point) {\n      // Direct mapping without scaling\n      mouseRef.current.x = event.point.x;\n      mouseRef.current.y = event.point.z;\n    }\n  };\n\n  useFrame((state) => {\n    if (!meshRef.current) return;\n\n    const time = state.clock.getElapsedTime();\n    const positions = meshRef.current.geometry.attributes.position;\n\n    for (let i = 0; i < positions.count; i++) {\n      const x = positions.getX(i);\n      const y = positions.getY(i);\n\n      // Distance from mouse (no additional scaling)\n      const distanceFromMouse = Math.sqrt(\n        Math.pow(x - mouseRef.current.x, 2) +\n          Math.pow(y - mouseRef.current.y, 2)\n      );\n\n      // Multiple wave layers\n      const wave1 = Math.sin(x * 0.5 + time * 0.5) * 0.3;\n      const wave2 = Math.sin(y * 0.3 + time * 0.3) * 0.4;\n      const wave3 = Math.sin((x + y) * 0.2 + time * 0.4) * 0.2;\n\n      // Mouse interaction ripple\n      const mouseInfluence =\n        Math.sin(distanceFromMouse * 2 - time * 3) *\n        Math.exp(-distanceFromMouse * 0.3) *\n        0.8;\n\n      const z = wave1 + wave2 + wave3 + mouseInfluence;\n      positions.setZ(i, z);\n    }\n\n    positions.needsUpdate = true;\n    meshRef.current.geometry.computeVertexNormals();\n\n    // Gentle rotation\n    meshRef.current.rotation.z = Math.sin(time * 0.1) * 0.05;\n  });\n\n  return (\n    <mesh\n      ref={meshRef}\n      geometry={geometry}\n      rotation={[-Math.PI / 2.5, 0, 0]}\n      onPointerMove={handlePointerMove}\n    >\n      <meshStandardMaterial\n        color=\"#1a1a2e\"\n        side={THREE.DoubleSide}\n        metalness={0.8}\n        roughness={0.2}\n        emissive=\"#0f3460\"\n        emissiveIntensity={0.3}\n      />\n    </mesh>\n  );\n}\n\nfunction Particles() {\n  const particlesRef = useRef<THREE.Points>(null);\n  const mouseRef = useRef({ x: 0, y: 0 });\n\n  const [positions, colors] = useMemo(() => {\n    const count = 2000;\n    const pos = new Float32Array(count * 3);\n    const col = new Float32Array(count * 3);\n\n    for (let i = 0; i < count; i++) {\n      pos[i * 3] = (Math.random() - 0.5) * 30;\n      pos[i * 3 + 1] = (Math.random() - 0.5) * 30;\n      pos[i * 3 + 2] = (Math.random() - 0.5) * 15;\n\n      const color = new THREE.Color();\n      color.setHSL(0.6 + Math.random() * 0.1, 0.8, 0.6);\n      col[i * 3] = color.r;\n      col[i * 3 + 1] = color.g;\n      col[i * 3 + 2] = color.b;\n    }\n\n    return [pos, col];\n  }, []);\n\n  useFrame((state) => {\n    if (!particlesRef.current) return;\n\n    const time = state.clock.getElapsedTime();\n    const positions = particlesRef.current.geometry.attributes.position\n      .array as Float32Array;\n\n    for (let i = 0; i < positions.length; i += 3) {\n      const x = positions[i];\n      const y = positions[i + 1];\n\n      // Floating animation\n      positions[i + 2] += Math.sin(time + x * 0.5 + y * 0.3) * 0.002;\n\n      // Mouse attraction\n      const dx = mouseRef.current.x * 10 - x;\n      const dy = mouseRef.current.y * 10 - y;\n      const distance = Math.sqrt(dx * dx + dy * dy);\n\n      if (distance < 5) {\n        positions[i] += dx * 0.001;\n        positions[i + 1] += dy * 0.001;\n      }\n    }\n\n    particlesRef.current.geometry.attributes.position.needsUpdate = true;\n  });\n\n  return (\n    <points ref={particlesRef}>\n      <bufferGeometry>\n        <bufferAttribute\n          attach=\"attributes-position\"\n          args={[positions, 3]}\n        />\n        <bufferAttribute\n          attach=\"attributes-color\"\n          args={[colors, 3]}\n        />\n      </bufferGeometry>\n      <pointsMaterial size={0.05} vertexColors transparent opacity={0.6} sizeAttenuation />\n    </points>\n  );\n}\n\nexport function ElegantWaveScene({ data: _ }: SceneContentProps) {\n  return (\n    <>\n      <color attach=\"background\" args={['#0a0a0f']} />\n\n      <ambientLight intensity={0.3} color=\"#ffffff\" />\n      <pointLight position={[10, 10, 10]} intensity={1} color=\"#4a90e2\" />\n      <pointLight position={[-10, -10, -10]} intensity={0.5} color=\"#e94560\" />\n      <spotLight\n        position={[0, 15, 0]}\n        angle={0.3}\n        penumbra={1}\n        intensity={1}\n        color=\"#ffffff\"\n        castShadow\n      />\n\n      <ElegantWaves />\n      <Particles />\n\n      <OrbitControls\n        enableZoom={false}\n        enablePan={false}\n        maxPolarAngle={Math.PI / 2}\n        minPolarAngle={Math.PI / 3}\n      />\n    </>\n  );\n}\n","\"use client\";\n\nimport { useRef, useMemo } from 'react';\nimport { useFrame } from '@react-three/fiber';\nimport * as THREE from 'three';\nimport type { SceneContentProps } from '../types';\n\n/**\n * GradientMeshScene - Animated gradient mesh effect\n *\n * Features:\n * - Animated mesh with gradient colors\n * - Flowing wave motion\n * - Color transitions\n * - Wireframe overlay option\n *\n * Note: Simplified version of shader-based gradient mesh\n */\n\nfunction GradientMesh() {\n  const meshRef = useRef<THREE.Mesh>(null);\n  const wireframeRef = useRef<THREE.Mesh>(null);\n\n  const geometry = useMemo(() => {\n    return new THREE.PlaneGeometry(20, 20, 100, 100);\n  }, []);\n\n  useFrame((state) => {\n    if (!meshRef.current) return;\n\n    const time = state.clock.getElapsedTime();\n    const positions = meshRef.current.geometry.attributes.position;\n    const colors = meshRef.current.geometry.attributes.color as THREE.BufferAttribute;\n\n    if (!colors) {\n      // Initialize colors\n      const colorArray = new Float32Array(positions.count * 3);\n      meshRef.current.geometry.setAttribute(\n        'color',\n        new THREE.BufferAttribute(colorArray, 3)\n      );\n    }\n\n    for (let i = 0; i < positions.count; i++) {\n      const x = positions.getX(i);\n      const y = positions.getY(i);\n\n      // Wave animation\n      const wave1 = Math.sin(x * 0.3 + time * 0.5) * 1.5;\n      const wave2 = Math.cos(y * 0.3 + time * 0.3) * 1.5;\n      const wave3 = Math.sin((x + y) * 0.2 + time * 0.4) * 1.0;\n\n      const z = wave1 + wave2 + wave3;\n      positions.setZ(i, z);\n\n      // Color gradient based on position and time\n      const normalizedX = (x + 10) / 20;\n      const normalizedY = (y + 10) / 20;\n      const normalizedZ = (z + 4) / 8;\n\n      const r = Math.sin(normalizedX * Math.PI + time * 0.2) * 0.5 + 0.5;\n      const g = Math.sin(normalizedY * Math.PI + time * 0.3) * 0.5 + 0.5;\n      const b = Math.sin(normalizedZ * Math.PI + time * 0.4) * 0.5 + 0.5;\n\n      if (colors) {\n        colors.setXYZ(i, r, g, b);\n      }\n    }\n\n    positions.needsUpdate = true;\n    if (colors) colors.needsUpdate = true;\n    meshRef.current.geometry.computeVertexNormals();\n\n    // Sync wireframe if exists\n    if (wireframeRef.current && wireframeRef.current.geometry !== meshRef.current.geometry) {\n      wireframeRef.current.geometry = meshRef.current.geometry;\n    }\n\n    // Gentle rotation\n    meshRef.current.rotation.x = Math.sin(time * 0.1) * 0.1;\n    meshRef.current.rotation.y = Math.cos(time * 0.15) * 0.1;\n  });\n\n  return (\n    <group>\n      {/* Main gradient mesh */}\n      <mesh ref={meshRef} geometry={geometry}>\n        <meshStandardMaterial\n          vertexColors\n          side={THREE.DoubleSide}\n          metalness={0.5}\n          roughness={0.3}\n        />\n      </mesh>\n\n      {/* Wireframe overlay */}\n      <mesh ref={wireframeRef} geometry={geometry} position={[0, 0.1, 0]}>\n        <meshBasicMaterial\n          color=\"#ffffff\"\n          wireframe\n          transparent\n          opacity={0.1}\n        />\n      </mesh>\n    </group>\n  );\n}\n\nexport function GradientMeshScene({ data: _ }: SceneContentProps) {\n  return (\n    <>\n      <color attach=\"background\" args={['#000000']} />\n\n      <ambientLight intensity={0.5} />\n      <pointLight position={[10, 10, 10]} intensity={2} color=\"#8b5cf6\" />\n      <pointLight position={[-10, -10, -10]} intensity={1.5} color=\"#4c1d95\" />\n      <spotLight\n        position={[0, 15, 0]}\n        angle={0.6}\n        penumbra={1}\n        intensity={2}\n        color=\"#ffffff\"\n      />\n\n      <GradientMesh />\n    </>\n  );\n}\n","\"use client\";\n\nimport { useEffect, useRef, useState } from 'react';\nimport { Canvas } from '@react-three/fiber';\nimport { InstanceProvider } from '@codefluss/threejs-shared';\nimport { createBackgroundInstance } from '../store/background-store';\nimport { StarfieldScene } from '../scenes/starfield-scene';\nimport { ParticleFlowScene } from '../scenes/particle-flow-scene';\nimport { WaveScene } from '../scenes/wave-scene';\nimport { PhysicsCubesScene } from '../scenes/physics-cubes-scene';\nimport { HolographicScene } from '../scenes/holographic-scene';\nimport { DarkRoomScene } from '../scenes/dark-room-scene';\nimport { ElegantWaveScene } from '../scenes/elegant-wave-scene';\nimport { GradientMeshScene } from '../scenes/gradient-mesh-scene';\nimport type { InteractiveBackgroundProps, SceneType } from '../types';\n\n/**\n * Interactive Background Component\n *\n * Features:\n * - Viewport detection (only renders when visible)\n * - Scene type selection\n * - Performance monitoring\n * - Instance-based state\n */\nexport default function InteractiveBackground({\n  instanceId,\n  data,\n  isEditorMode\n}: InteractiveBackgroundProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [isInViewport, setIsInViewport] = useState(isEditorMode);\n\n  // IntersectionObserver - only render when visible\n  useEffect(() => {\n    // In editor mode, always render\n    if (isEditorMode) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        setIsInViewport(entry.isIntersecting);\n      },\n      {\n        threshold: 0.1, // 10% visible = activate\n        rootMargin: '100px' // Preload 100px before visibility\n      }\n    );\n\n    observer.observe(container);\n\n    return () => observer.disconnect();\n  }, [isEditorMode]);\n\n  // Get scene component based on type\n  const SceneComponent = getSceneComponent(data.scene?.type);\n\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        width: '100%',\n        height: '100%',\n        position: 'absolute',\n        top: 0,\n        left: 0\n      }}\n    >\n      {/* Only render when in viewport or editor mode */}\n      {isInViewport && (\n        <InstanceProvider\n          instanceId={instanceId}\n          createStore={createBackgroundInstance}\n        >\n          <Canvas\n            camera={{\n              position: data.camera?.position || [0, 0, 5],\n              fov: data.camera?.fov || 75\n            }}\n            dpr={[1, 2]} // Adaptive DPR\n            performance={{ min: 0.5 }} // Minimum 50% performance\n            style={{\n              background: data.scene?.backgroundColor || 'transparent'\n            }}\n          >\n            <SceneComponent data={data} />\n          </Canvas>\n        </InstanceProvider>\n      )}\n    </div>\n  );\n}\n\n/**\n * Get scene component based on type\n */\nfunction getSceneComponent(type?: SceneType) {\n  switch (type) {\n    case 'starfield':\n      return StarfieldScene;\n    case 'particles':\n      return ParticleFlowScene;\n    case 'wave':\n      return WaveScene;\n    case 'physics-cubes':\n      return PhysicsCubesScene;\n    case 'holographic':\n      return HolographicScene;\n    case 'dark-room':\n      return DarkRoomScene;\n    case 'elegant-wave':\n      return ElegantWaveScene;\n    case 'gradient-mesh':\n      return GradientMeshScene;\n    default:\n      return StarfieldScene;\n  }\n}\n"],"names":["StarfieldScene","data","instance","useInstance","quality","setQuality","useState","particleCount","setParticleCount","pointsRef","useRef","useEffect","baseCount","performance","maxParticles","qualitySetting","Math","floor","instanceId","getState","globalPerfMonitor","registerCanvas","handleQualityChange","e","customEvent","detail","newQuality","window","addEventListener","removeEventListener","unregisterCanvas","positions","useMemo","Float32Array","i","i3","radius","random","theta","PI","phi","acos","sin","cos","useFrame","state","delta","fps","updateMetrics","camera","autoRotate","speed","rotationSpeed","position","x","clock","elapsedTime","z","lookAt","current","rotation","y","pointSize","jsxs","Fragment","children","jsx","intensity","ref","attach","args","size","sizeAttenuation","transparent","opacity","color","blending","THREE","AdditiveBlending","depthWrite","ParticleFlowScene","particlesRef","colors","colorStart","Color","colorEnd","mixRatio","clone","lerp","r","g","b","geometry","attributes","array","time","needsUpdate","vertexColors","WavePlane","meshRef","wireframeMeshRef","mousePosition","PlaneGeometry","getElapsedTime","mouseX","mouseY","count","getX","getY","distanceToMouse","sqrt","pow","mouseInfluence","max","setZ","computeVertexNormals","onPointerMove","event","point","side","DoubleSide","metalness","roughness","wireframe","WaveScene","_","PhysicsCubesScene","cubesRef","cubePositions","push","forEach","cube","length","baseY","castShadow","angle","penumbra","receiveShadow","map","pos","HolographicSphere","MeshTransmissionMaterial","backside","samples","resolution","transmission","thickness","chromaticAberration","distortion","FloatingShapes","group","child","emissive","emissiveIntensity","HolographicScene","DarkRoom","CenterObject","Spotlight","lightRef","targetRef","viewport","useThree","pointer","width","set","target","FloatingParticles","DarkRoomScene","ElegantWaves","mouseRef","distanceFromMouse","exp","Particles","col","setHSL","dx","dy","ElegantWaveScene","OrbitControls","enableZoom","enablePan","maxPolarAngle","minPolarAngle","GradientMesh","wireframeRef","colorArray","setAttribute","BufferAttribute","normalizedX","normalizedY","normalizedZ","setXYZ","GradientMeshScene","InteractiveBackground","isEditorMode","containerRef","isInViewport","setIsInViewport","container","observer","IntersectionObserver","entry","isIntersecting","threshold","rootMargin","observe","disconnect","SceneComponent","type","getSceneComponent","scene","style","height","top","left","InstanceProvider","createStore","createBackgroundInstance","Canvas","fov","dpr","min","background","backgroundColor"],"mappings":"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"}