{"version":3,"file":"GridBackground.kkNAe-O2.mjs","names":["React.useRef","React.useState","React.useMemo"],"sources":["https:/framerusercontent.com/modules/CboGdmuysRW3F954zzGq/nnttKhlblzosCrBpZsL5/GridBackground.js"],"sourcesContent":["// Simple grid background with customizable spacing and line color\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import*as React from\"react\";/**\n * Simple grid background\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function GridBackground(props){const{horizontalSpacing,verticalSpacing,lineColor,lineWidth,showHorizontal,showVertical,gridStyle,enableAnimation=false,animatedDensity=10,animationSpeed=2,pulseSize=3,pulseIntensity=.8,style}=props;// Use a ref to get actual rendered dimensions\nconst containerRef=React.useRef(null);const[dimensions,setDimensions]=React.useState({width:400,height:400});React.useEffect(()=>{if(containerRef.current){const updateDimensions=()=>{if(containerRef.current){const rect=containerRef.current.getBoundingClientRect();setDimensions({width:rect.width,height:rect.height});}};updateDimensions();// Use ResizeObserver to handle dynamic resizing\nconst resizeObserver=new ResizeObserver(updateDimensions);resizeObserver.observe(containerRef.current);return()=>resizeObserver.disconnect();}},[]);const{width,height}=dimensions;// Generate a stable set of animated positions based on density\nconst animatedPositions=React.useMemo(()=>{if(!enableAnimation||gridStyle!==\"dots\"&&gridStyle!==\"plus\")return new Set;const positions=[];for(let x=horizontalSpacing;x<width;x+=horizontalSpacing){for(let y=verticalSpacing;y<height;y+=verticalSpacing){positions.push(`${x}-${y}`);}}// Randomly select positions based on density percentage\nconst numAnimated=Math.floor(positions.length*(animatedDensity/100));const shuffled=[...positions].sort(()=>Math.random()-.5);return new Set(shuffled.slice(0,numAnimated));},[width,height,horizontalSpacing,verticalSpacing,animatedDensity,enableAnimation,gridStyle]);// Generate SVG grid content\nconst gridContent=[];if(gridStyle===\"dots\"){// Dot grid\nfor(let x=horizontalSpacing;x<width;x+=horizontalSpacing){for(let y=verticalSpacing;y<height;y+=verticalSpacing){const posKey=`${x}-${y}`;const isAnimated=animatedPositions.has(posKey);gridContent.push(/*#__PURE__*/_jsxs(\"g\",{children:[/*#__PURE__*/_jsx(\"circle\",{cx:x,cy:y,r:lineWidth,fill:lineColor}),isAnimated&&/*#__PURE__*/_jsx(\"circle\",{cx:x,cy:y,r:lineWidth*pulseSize,fill:lineColor,opacity:0,style:{animation:`pulse ${animationSpeed}s ease-in-out infinite`,animationDelay:`${Math.random()*animationSpeed}s`}})]},`dot-${x}-${y}`));}}}else if(gridStyle===\"plus\"){// Plus grid\n// Make crosshair 5x5 px, lines are always 1px wide (not lineWidth)\nconst crossSize=5;const crossHalf=(crossSize-1)/2;for(let x=horizontalSpacing;x<width;x+=horizontalSpacing){for(let y=verticalSpacing;y<height;y+=verticalSpacing){const posKey=`${x}-${y}`;const isAnimated=animatedPositions.has(posKey);gridContent.push(/*#__PURE__*/_jsxs(\"g\",{children:[/*#__PURE__*/_jsx(\"line\",{x1:x-crossHalf,y1:y,x2:x+crossHalf,y2:y,stroke:lineColor,strokeWidth:1}),/*#__PURE__*/_jsx(\"line\",{x1:x,y1:y-crossHalf,x2:x,y2:y+crossHalf,stroke:lineColor,strokeWidth:1}),isAnimated&&/*#__PURE__*/_jsx(\"circle\",{cx:x,cy:y,r:crossSize*pulseSize,fill:lineColor,opacity:0,style:{animation:`pulse ${animationSpeed}s ease-in-out infinite`,animationDelay:`${Math.random()*animationSpeed}s`}})]},`plus-${x}-${y}`));}}}else{// Line grid\n// Vertical lines\nif(showVertical){for(let x=horizontalSpacing;x<width;x+=horizontalSpacing){gridContent.push(/*#__PURE__*/_jsx(\"line\",{x1:x,y1:0,x2:x,y2:height,stroke:lineColor,strokeWidth:lineWidth},\"v-\"+x));}}// Horizontal lines\nif(showHorizontal){for(let y=verticalSpacing;y<height;y+=verticalSpacing){gridContent.push(/*#__PURE__*/_jsx(\"line\",{x1:0,y1:y,x2:width,y2:y,stroke:lineColor,strokeWidth:lineWidth},\"h-\"+y));}}}return /*#__PURE__*/_jsxs(\"div\",{ref:containerRef,style:{...style,width:\"100%\",height:\"100%\",position:\"relative\",overflow:\"hidden\",pointerEvents:\"none\"},children:[/*#__PURE__*/_jsx(\"style\",{children:`\n        @keyframes pulse {\n          0% {\n            opacity: 0;\n          }\n          50% {\n            opacity: ${pulseIntensity};\n          }\n          100% {\n            opacity: 0;\n          }\n        }\n      `}),/*#__PURE__*/_jsx(\"svg\",{width:\"100%\",height:\"100%\",preserveAspectRatio:\"none\",style:{display:\"block\",position:\"absolute\",inset:0},children:gridContent})]});}addPropertyControls(GridBackground,{gridStyle:{type:ControlType.Enum,title:\"Style\",options:[\"lines\",\"dots\",\"plus\"],optionTitles:[\"Lines\",\"Dots\",\"+\"],defaultValue:\"lines\",displaySegmentedControl:true},horizontalSpacing:{type:ControlType.Number,title:\"H Spacing\",min:4,max:200,step:1,defaultValue:40},verticalSpacing:{type:ControlType.Number,title:\"V Spacing\",min:4,max:200,step:1,defaultValue:40},lineColor:{type:ControlType.Color,title:\"Line Color\",defaultValue:\"#EEEEEE\"},lineWidth:{type:ControlType.Number,title:\"Line Width\",min:.1,max:8,step:.1,defaultValue:1},showHorizontal:{type:ControlType.Boolean,title:\"Horizontal\",defaultValue:true,enabledTitle:\"Show\",disabledTitle:\"Hide\",hidden:({gridStyle})=>gridStyle===\"dots\"},showVertical:{type:ControlType.Boolean,title:\"Vertical\",defaultValue:true,enabledTitle:\"Show\",disabledTitle:\"Hide\",hidden:({gridStyle})=>gridStyle===\"dots\"},enableAnimation:{type:ControlType.Boolean,title:\"Animate\",defaultValue:false,enabledTitle:\"On\",disabledTitle:\"Off\",hidden:({gridStyle})=>gridStyle===\"lines\"},animatedDensity:{type:ControlType.Number,title:\"Density\",min:0,max:100,step:1,defaultValue:10,unit:\"%\",hidden:({enableAnimation,gridStyle})=>!enableAnimation||gridStyle===\"lines\"},animationSpeed:{type:ControlType.Number,title:\"Speed\",min:.5,max:10,step:.5,defaultValue:2,unit:\"s\",hidden:({enableAnimation,gridStyle})=>!enableAnimation||gridStyle===\"lines\"},pulseSize:{type:ControlType.Number,title:\"Pulse Size\",min:1,max:10,step:.5,defaultValue:3,hidden:({enableAnimation,gridStyle})=>!enableAnimation||gridStyle===\"lines\"},pulseIntensity:{type:ControlType.Number,title:\"Intensity\",min:0,max:1,step:.1,defaultValue:.8,hidden:({enableAnimation,gridStyle})=>!enableAnimation||gridStyle===\"lines\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"GridBackground\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./GridBackground.map"],"mappings":"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"}