{"version":3,"file":"ParticlesBackground.DhtH42e5.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/PAWbWQcDGeUtP6AVxVjd/TJv2QZxVNBTsqNPGcI89/ParticlesBackground.js"],"sourcesContent":["// Animated particles background with customizable particle count, colors, and movement\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef,useState,startTransition}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";/**\n * Animated particles background with floating particles and optional connection lines\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function ParticlesBackground(props){const{particleCount=50,particleSize=2,speed=1,opacity=.8,backgroundColor=\"#000000\",connectionLines=false,connectionDistance=100,connectionOpacity=.3,density=1}=props;const canvasRef=useRef(null);const animationRef=useRef();const particlesRef=useRef([]);const isStatic=useIsStaticRenderer();const[dimensions,setDimensions]=useState({width:800,height:600});// Initialize particles\nconst initializeParticles=(width,height)=>{const particles=[];for(let i=0;i<particleCount;i++){particles.push({x:Math.random()*width,y:Math.random()*height,vx:(Math.random()-.5)*speed,vy:(Math.random()-.5)*speed,size:Math.random()*particleSize+1,opacity:Math.random()*opacity+.1,color:\"#FFFFFF\"});}particlesRef.current=particles;};// Update particle positions\nconst updateParticles=(width,height)=>{particlesRef.current.forEach(particle=>{// Apply real-time speed changes\nconst currentSpeed=speed*density;particle.vx=particle.vx/Math.abs(particle.vx||1)*currentSpeed*(Math.random()*.5+.75);particle.vy=particle.vy/Math.abs(particle.vy||1)*currentSpeed*(Math.random()*.5+.75);particle.x+=particle.vx;particle.y+=particle.vy;// Wrap around edges\nif(particle.x<0)particle.x=width;if(particle.x>width)particle.x=0;if(particle.y<0)particle.y=height;if(particle.y>height)particle.y=0;});};// Draw particles and connections\nconst draw=(ctx,width,height)=>{ctx.clearRect(0,0,width,height);// Draw connection lines\nif(connectionLines){ctx.strokeStyle=`rgba(255, 255, 255, ${connectionOpacity})`;ctx.lineWidth=1;for(let i=0;i<particlesRef.current.length;i++){for(let j=i+1;j<particlesRef.current.length;j++){const dx=particlesRef.current[i].x-particlesRef.current[j].x;const dy=particlesRef.current[i].y-particlesRef.current[j].y;const distance=Math.sqrt(dx*dx+dy*dy);if(distance<connectionDistance){ctx.beginPath();ctx.moveTo(particlesRef.current[i].x,particlesRef.current[i].y);ctx.lineTo(particlesRef.current[j].x,particlesRef.current[j].y);ctx.stroke();}}}}// Draw particles\nparticlesRef.current.forEach(particle=>{ctx.beginPath();ctx.arc(particle.x,particle.y,particle.size,0,Math.PI*2);ctx.fillStyle=`rgba(255, 255, 255, ${particle.opacity})`;ctx.fill();});};// Convert hex to RGB\nconst hexToRgb=hex=>{const result=/^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);return result?`${parseInt(result[1],16)}, ${parseInt(result[2],16)}, ${parseInt(result[3],16)}`:\"255, 255, 255\";};// Animation loop\nconst animate=()=>{if(!canvasRef.current||isStatic)return;const canvas=canvasRef.current;const ctx=canvas.getContext(\"2d\");if(!ctx)return;updateParticles(canvas.width,canvas.height);draw(ctx,canvas.width,canvas.height);animationRef.current=requestAnimationFrame(animate);};// Handle resize\nuseEffect(()=>{if(typeof window===\"undefined\")return;const updateDimensions=()=>{if(canvasRef.current&&canvasRef.current.parentElement){const parent=canvasRef.current.parentElement;const rect=parent.getBoundingClientRect();startTransition(()=>{setDimensions({width:rect.width,height:rect.height});});}};updateDimensions();window.addEventListener(\"resize\",updateDimensions);return()=>{window.removeEventListener(\"resize\",updateDimensions);};},[]);// Initialize and start animation\nuseEffect(()=>{if(isStatic)return;initializeParticles(dimensions.width,dimensions.height);if(canvasRef.current){const canvas=canvasRef.current;canvas.width=dimensions.width;canvas.height=dimensions.height;}animate();return()=>{if(animationRef.current){cancelAnimationFrame(animationRef.current);}};},[dimensions,particleCount,speed,density,opacity,particleSize,connectionLines,connectionDistance,connectionOpacity,isStatic]);if(isStatic){// Static preview with some particles\nreturn /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",backgroundColor,position:\"relative\",overflow:\"hidden\"},children:Array.from({length:Math.min(20,particleCount)}).map((_,i)=>/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",width:particleSize*2,height:particleSize*2,backgroundColor:\"#FFFFFF\",borderRadius:\"50%\",opacity:opacity*.8,left:`${Math.random()*100}%`,top:`${Math.random()*100}%`}},i))});}return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",backgroundColor,position:\"relative\",overflow:\"hidden\"},children:/*#__PURE__*/_jsx(\"canvas\",{ref:canvasRef,style:{position:\"absolute\",top:0,left:0,width:\"100%\",height:\"100%\"},width:dimensions.width,height:dimensions.height})});}addPropertyControls(ParticlesBackground,{particleCount:{type:ControlType.Number,title:\"Particle Count\",defaultValue:50,min:10,max:200,step:1},density:{type:ControlType.Number,title:\"Density\",defaultValue:1,min:.1,max:3,step:.1},particleSize:{type:ControlType.Number,title:\"Particle Size\",defaultValue:2,min:1,max:10,step:.5,unit:\"px\"},speed:{type:ControlType.Number,title:\"Speed\",defaultValue:1,min:.1,max:5,step:.1},opacity:{type:ControlType.Number,title:\"Particle Opacity\",defaultValue:.8,min:.1,max:1,step:.1},backgroundColor:{type:ControlType.Color,title:\"Background Color\",defaultValue:\"#000000\"},connectionLines:{type:ControlType.Boolean,title:\"Connection Lines\",defaultValue:false,enabledTitle:\"Show\",disabledTitle:\"Hide\"},connectionDistance:{type:ControlType.Number,title:\"Connection Distance\",defaultValue:100,min:50,max:200,step:10,unit:\"px\",hidden:({connectionLines})=>!connectionLines},connectionOpacity:{type:ControlType.Number,title:\"Line Opacity\",defaultValue:.3,min:.1,max:1,step:.1,hidden:({connectionLines})=>!connectionLines}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ParticlesBackground\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerSupportedLayoutWidth\":\"fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ParticlesBackground.map"],"mappings":"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"}