{"version":3,"file":"InfiniteGrid.CCGDkb-F.mjs","names":["useRef"],"sources":["https:/framerusercontent.com/modules/UWOxVMRXq0tBqr4zysUl/3CfQToHelN0ZIrSQPsPP/InfiniteGrid.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useRef}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import{motion,useMotionValue,useMotionTemplate,useAnimationFrame}from\"framer-motion\";/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function Infinite_GridX(props){const{backgroundColor,gridColor,gridOpacity,revealOpacity,revealRadius,speedX,speedY,direction,showGradients,gradient1Color,gradient2Color,gradient3Color}=props;const containerRef=useRef(null);const mouseX=useMotionValue(0);const mouseY=useMotionValue(0);const handleMouseMove=e=>{if(!containerRef.current)return;const{left,top}=containerRef.current.getBoundingClientRect();mouseX.set(e.clientX-left);mouseY.set(e.clientY-top);};const gridOffsetX=useMotionValue(0);const gridOffsetY=useMotionValue(0);useAnimationFrame(()=>{const currentX=gridOffsetX.get();const currentY=gridOffsetY.get();let deltaX=0;let deltaY=0;switch(direction){case\"right\":deltaX=speedX;break;case\"left\":deltaX=-speedX;break;case\"down\":deltaY=speedY;break;case\"up\":deltaY=-speedY;break;case\"down-right\":deltaX=speedX;deltaY=speedY;break;case\"down-left\":deltaX=-speedX;deltaY=speedY;break;case\"up-right\":deltaX=speedX;deltaY=-speedY;break;case\"up-left\":deltaX=-speedX;deltaY=-speedY;break;}gridOffsetX.set((currentX+deltaX)%40);gridOffsetY.set((currentY+deltaY)%40);});const maskImage=useMotionTemplate`radial-gradient(${revealRadius}px circle at ${mouseX}px ${mouseY}px, black, transparent)`;return /*#__PURE__*/_jsxs(\"div\",{ref:containerRef,onMouseMove:handleMouseMove,style:{position:\"relative\",width:\"100%\",height:\"100%\",display:\"flex\",flexDirection:\"column\",alignItems:\"center\",justifyContent:\"center\",overflow:\"hidden\",backgroundColor},children:[/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",inset:0,zIndex:0,opacity:gridOpacity},children:/*#__PURE__*/_jsx(GridPattern,{offsetX:gridOffsetX,offsetY:gridOffsetY,color:gridColor})}),/*#__PURE__*/_jsx(motion.div,{style:{position:\"absolute\",inset:0,zIndex:0,opacity:revealOpacity,maskImage,WebkitMaskImage:maskImage},children:/*#__PURE__*/_jsx(GridPattern,{offsetX:gridOffsetX,offsetY:gridOffsetY,color:gridColor})}),showGradients&&/*#__PURE__*/_jsxs(\"div\",{style:{position:\"absolute\",inset:0,pointerEvents:\"none\",zIndex:0},children:[/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",right:\"-20%\",top:\"-20%\",width:\"40%\",height:\"40%\",borderRadius:\"50%\",background:gradient1Color,filter:\"blur(120px)\"}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",right:\"10%\",top:\"-10%\",width:\"20%\",height:\"20%\",borderRadius:\"50%\",background:gradient2Color,filter:\"blur(100px)\"}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",left:\"-10%\",bottom:\"-20%\",width:\"40%\",height:\"40%\",borderRadius:\"50%\",background:gradient3Color,filter:\"blur(120px)\"}})]})]});}const GridPattern=({offsetX,offsetY,color})=>{return /*#__PURE__*/_jsxs(\"svg\",{style:{width:\"100%\",height:\"100%\"},children:[/*#__PURE__*/_jsx(\"defs\",{children:/*#__PURE__*/_jsx(motion.pattern,{id:\"grid-pattern\",width:\"40\",height:\"40\",patternUnits:\"userSpaceOnUse\",x:offsetX,y:offsetY,children:/*#__PURE__*/_jsx(\"path\",{d:\"M 40 0 L 0 0 0 40\",fill:\"none\",stroke:color,strokeWidth:\"1\"})})}),/*#__PURE__*/_jsx(\"rect\",{width:\"100%\",height:\"100%\",fill:\"url(#grid-pattern)\"})]});};addPropertyControls(Infinite_GridX,{backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#FFFFFF\"},gridColor:{type:ControlType.Color,title:\"Grid Color\",defaultValue:\"#CCCCCC\"},gridOpacity:{type:ControlType.Number,title:\"Grid Opacity\",defaultValue:.5,min:0,max:1,step:.01},revealOpacity:{type:ControlType.Number,title:\"Reveal Opacity\",defaultValue:.9,min:0,max:1,step:.01},revealRadius:{type:ControlType.Number,title:\"Reveal Radius\",defaultValue:300,min:100,max:800,step:10,unit:\"px\"},direction:{type:ControlType.Enum,title:\"Direction\",options:[\"right\",\"left\",\"down\",\"up\",\"down-right\",\"down-left\",\"up-right\",\"up-left\"],optionTitles:[\"Right\",\"Left\",\"Down\",\"Up\",\"Down-Right\",\"Down-Left\",\"Up-Right\",\"Up-Left\"],defaultValue:\"down-right\"},speedX:{type:ControlType.Number,title:\"Speed X\",defaultValue:.5,min:-5,max:5,step:.1},speedY:{type:ControlType.Number,title:\"Speed Y\",defaultValue:.5,min:-5,max:5,step:.1},showGradients:{type:ControlType.Boolean,title:\"Show Gradients\",defaultValue:true,enabledTitle:\"Show\",disabledTitle:\"Hide\"},gradient1Color:{type:ControlType.Color,title:\"Gradient 1\",defaultValue:\"rgba(249, 115, 22, 0.8)\",hidden:({showGradients})=>!showGradients},gradient2Color:{type:ControlType.Color,title:\"Gradient 2\",defaultValue:\"rgba(0, 0, 0, 0.8)\",hidden:({showGradients})=>!showGradients},gradient3Color:{type:ControlType.Color,description:\"More components at [Hamim Reza @hreza](https://hreza.lemonsqueezy.com)\",title:\"Gradient 3\",defaultValue:\"rgba(59, 130, 246, 0.8)\",hidden:({showGradients})=>!showGradients}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"Infinite_GridX\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerSupportedLayoutHeight\":\"fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./InfiniteGrid.map"],"mappings":"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"}