{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/eehosYHl7ldgwuq7aCix/f3YhT9S1W8F8ZsCEbe9A/PulsatingDots_2.js"],
  "sourcesContent": ["// Visual component with pulsating dots at every grid intersection, random on/off pattern, color changes only when invisible\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef,useState}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function PulsatingDots(props){const{gridSize=40,dotSize=8,speed=1,randomness=1,color1=\"#0099FF\",color2=\"#FF5588\",enableFade=true,fadeSpeed=1,style={}}=props;const isStatic=useIsStaticRenderer();const width=typeof style.width===\"number\"?style.width:400;const height=typeof style.height===\"number\"?style.height:300;const padding=typeof props.padding===\"number\"?props.padding:0;const innerWidth=width-2*padding;const innerHeight=height-2*padding;const gridCols=Math.max(1,Math.floor(innerWidth/gridSize));const gridRows=Math.max(1,Math.floor(innerHeight/gridSize));// Alignment offset\nlet offsetX=0,offsetY=0;if(props.gridAlign===\"center\"){offsetX=(innerWidth-gridCols*gridSize)/2;offsetY=(innerHeight-gridRows*gridSize)/2;}else if(props.gridAlign===\"bottom\"){offsetY=innerHeight-gridRows*gridSize;}else if(props.gridAlign===\"right\"){offsetX=innerWidth-gridCols*gridSize;}// top/left is default (0)\n// Build dot positions at every grid intersection, with padding and alignment\nconst dots=[];for(let col=0;col<=gridCols;col++){for(let row=0;row<=gridRows;row++){dots.push({id:`${col}-${row}`,x:padding+offsetX+col*gridSize,y:padding+offsetY+row*gridSize});}}// State: for each dot, track visible (boolean) and color (color1/color2)\nconst[dotStates,setDotStates]=useState(()=>dots.map(()=>({visible:Math.random()>.5,color:color1})));const dotStatesRef=useRef(dotStates);dotStatesRef.current=dotStates;// Randomly update dot visibility and color\nuseEffect(()=>{if(isStatic)return;let mounted=true;function updateDots(){setDotStates(prev=>prev.map((state,i)=>{// Randomly decide if this dot should toggle\n    if(Math.random()<.08*randomness){// If currently visible, turn invisible (keep color)\n    if(state.visible){return{...state,visible:false};}else{// If currently invisible, become visible and swap color\n    return{visible:true,color:state.color===color1?color2:color1};}}return state;}));}const interval=setInterval(updateDots,enableFade?60/fadeSpeed:60/speed);return()=>{mounted=false;clearInterval(interval);};},[dots.length,color1,color2,speed,enableFade,fadeSpeed,isStatic]);// Reset all dot colors if color1/color2 changes\nuseEffect(()=>{setDotStates(states=>states.map(state=>({...state,color:color1})));},[color1,dots.length]);if(isStatic){return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",position:\"relative\",overflow:\"hidden\"},children:dots.map((dot,i)=>/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",left:dot.x-dotSize/2,top:dot.y-dotSize/2,width:dotSize,height:dotSize,borderRadius:\"50%\",backgroundColor:color1,opacity:.7}},dot.id))});}return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",position:\"relative\",overflow:\"hidden\"},children:dots.map((dot,i)=>{const state=dotStates[i]||{visible:true,color:color1};return /*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",left:dot.x-dotSize/2,top:dot.y-dotSize/2,width:dotSize,height:dotSize,borderRadius:\"50%\",backgroundColor:state.color,opacity:state.visible?1:0,transition:enableFade?`opacity ${.18/fadeSpeed}s linear`:\"opacity 0s\"}},dot.id);})});}addPropertyControls(PulsatingDots,{gridSize:{type:ControlType.Number,title:\"Grid Size\",defaultValue:40,min:10,max:100,step:2,unit:\"px\"},dotSize:{type:ControlType.Number,title:\"Dot Size\",defaultValue:8,min:2,max:32,step:1,unit:\"px\"},speed:{type:ControlType.Number,title:\"Speed\",defaultValue:1,min:.1,max:3,step:.1},randomness:{type:ControlType.Number,title:\"Randomness\",defaultValue:1,min:.1,max:3,step:.1},color1:{type:ControlType.Color,title:\"Color 1\",defaultValue:\"#0099FF\"},color2:{type:ControlType.Color,title:\"Color 2\",defaultValue:\"#FF5588\"},enableFade:{type:ControlType.Boolean,title:\"Fade In/Out\",defaultValue:true,enabledTitle:\"Fade\",disabledTitle:\"Sharp\"},fadeSpeed:{type:ControlType.Number,title:\"Fade Speed\",defaultValue:1,min:.1,max:3,step:.1,hidden:({enableFade})=>!enableFade},padding:{type:ControlType.Number,title:\"Padding\",defaultValue:0,min:0,max:100,step:1,unit:\"px\"},gridAlign:{type:ControlType.Enum,title:\"Grid Align\",defaultValue:\"center\",options:[\"top\",\"center\",\"bottom\",\"left\",\"right\"],optionTitles:[\"Top\",\"Center\",\"Bottom\",\"Left\",\"Right\"]}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"PulsatingDots\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"fixed\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./PulsatingDots_2.map"],
  "mappings": "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",
  "names": ["PulsatingDots", "props", "gridSize", "dotSize", "speed", "randomness", "color1", "color2", "enableFade", "fadeSpeed", "style", "isStatic", "useIsStaticRenderer", "width", "height", "padding", "innerWidth", "innerHeight", "gridCols", "gridRows", "offsetX", "offsetY", "dots", "col", "row", "dotStates", "setDotStates", "ye", "dotStatesRef", "pe", "ue", "mounted", "updateDots", "prev", "state", "i", "interval", "states", "p", "dot", "addPropertyControls", "ControlType"]
}