{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/DUVzJQodDTCwiiMKuNbI/yIUzxSTOcFABnWxIoms1/ShimmerDot_Prod.js"],
  "sourcesContent": ["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useRef,useMemo,useState}from\"react\";import{motion}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";const extractRGBColorFromString=str=>{const rgbRegex=/(rgba|rgb)\\(.*?\\)/g;const match=str.match(rgbRegex);return match?match[0]:\"rgb(255,255,255)\";};// Perlin noise implementation\nfunction noise(x,y){const X=Math.floor(x)&255;const Y=Math.floor(y)&255;x-=Math.floor(x);y-=Math.floor(y);const u=fade(x);const v=fade(y);const A=p[X]+Y,B=p[X+1]+Y;return lerp(v,lerp(u,grad(p[A],x,y),grad(p[B],x-1,y)),lerp(u,grad(p[A+1],x,y-1),grad(p[B+1],x-1,y-1)));}function fade(t){return t*t*t*(t*(t*6-15)+10);}function lerp(t,a,b){return a+t*(b-a);}function grad(hash,x,y){const h=hash&15;const u=h<8?x:y;const v=h<4?y:h===12||h===14?x:0;return((h&1)===0?u:-u)+((h&2)===0?v:-v);}const p=new Array(512);for(let i=0;i<256;i++)p[i]=p[i+256]=Math.floor(Math.random()*256);function generatePerlinNoise(width,height,cellSize){const canvas=document.createElement(\"canvas\");canvas.width=width;canvas.height=height;const ctx=canvas.getContext(\"2d\");const imageData=ctx.createImageData(width,height);const data=imageData.data;for(let y=0;y<height;y++){for(let x=0;x<width;x++){const value=(noise(x/cellSize,y/cellSize)+1)/2*255;const cell=(x+y*width)*4;data[cell]=data[cell+1]=data[cell+2]=value;data[cell+3]=255;}}ctx.putImageData(imageData,0,0);return canvas;}function createSeamlessPerlinNoise(width,height,cellSize){const singleNoise=generatePerlinNoise(width,height,cellSize);const canvas=document.createElement(\"canvas\");canvas.width=width*3;canvas.height=height;const ctx=canvas.getContext(\"2d\");// Draw the first noise pattern\nctx.drawImage(singleNoise,0,0);// Draw the flipped middle pattern\nctx.save();ctx.translate(width*2,0);ctx.scale(-1,1);ctx.drawImage(singleNoise,0,0);ctx.restore();// Draw the third noise pattern\nctx.drawImage(singleNoise,width*2,0);return canvas.toDataURL();}/*\n * @framerDisableUnlink\n *\n * @framerIntrinsicWidth 500\n * @framerIntrinsicHeight 500\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function PerlinWall(props){const{shapeType,size,gap,colors,contrast,speed,radius}=props;const containerRef=useRef(null);const canvasRef=useRef(null);const[isClient,setIsClient]=useState(false);useEffect(()=>{setIsClient(true);},[]);const perlinNoiseDataUrl=useMemo(()=>{if(!isClient)return\"\";const noiseWidth=1e3;const noiseHeight=1e3;const cellSize=Math.max(25,size*2);return createSeamlessPerlinNoise(noiseWidth,noiseHeight,cellSize);},[size,isClient]);// Calculate animation duration\nconst animationDuration=useMemo(()=>{const baseDuration=6e4// 60 seconds to complete one full cycle at speed 50 and size 10\n;const sizeAdjustment=size/10// Adjust for size\n;return baseDuration*sizeAdjustment/(speed/50);},[speed,size]);useEffect(()=>{if(!isClient)return;const container=containerRef.current;const canvas=canvasRef.current;if(!container||!canvas)return;const ctx=canvas.getContext(\"2d\");const resizeCanvas=()=>{canvas.width=container.offsetWidth;canvas.height=container.offsetHeight;drawShapes();};const drawShapes=()=>{ctx.clearRect(0,0,canvas.width,canvas.height);const colorBatch=colors.length>0?colors.map(extractRGBColorFromString):[\"rgb(128,128,128)\"];for(let y=0;y<canvas.height;y+=size+gap){for(let x=0;x<canvas.width;x+=size+gap){const color=colorBatch[Math.floor(Math.random()*colorBatch.length)];const opacity=getRandomOpacity();ctx.fillStyle=color.replace(\")\",`,${opacity})`);if(shapeType===\"Square\"){ctx.fillRect(x,y,size,size);}else{ctx.beginPath();ctx.arc(x+size/2,y+size/2,size/2,0,2*Math.PI);ctx.fill();}}}};const getRandomOpacity=()=>{let opacity=Math.random();if(contrast>0){opacity=Math.pow(opacity,1+contrast/5);}else if(contrast<0){opacity=1-Math.pow(1-opacity,1-contrast/5);}return opacity;};resizeCanvas();const resizeObserver=new ResizeObserver(resizeCanvas);resizeObserver.observe(container);return()=>{resizeObserver.disconnect();};},[shapeType,size,gap,colors,contrast,isClient]);if(!isClient){return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\"}});}return /*#__PURE__*/_jsxs(motion.div,{ref:containerRef,style:{width:\"100%\",height:\"100%\",borderRadius:radius,overflow:\"hidden\"},children:[/*#__PURE__*/_jsx(\"canvas\",{ref:canvasRef,style:{width:\"100%\",height:\"100%\",mask:`url(${perlinNoiseDataUrl}) luminance`,WebkitMask:`url(${perlinNoiseDataUrl}) luminance`,maskSize:\"300% 100%\",WebkitMaskSize:\"300% 100%\",maskRepeat:\"repeat-x\",WebkitMaskRepeat:\"repeat-x\",animation:`moveMask ${animationDuration}ms linear infinite`,willChange:\"mask-position\"}}),/*#__PURE__*/_jsx(\"style\",{children:`\n    @keyframes moveMask {\n        0% { \n            mask-position: 0% 0%;\n            -webkit-mask-position: 0% 0%;\n        }\n        100% { \n            mask-position: -${300*(size/10)}% 0%;\n            -webkit-mask-position: -${300*(size/10)}% 0%;\n        }\n    }\n    `})]});}PerlinWall.displayName=\"Shimmer Dot\";PerlinWall.defaultProps={shapeType:\"Square\",size:3,gap:8,colors:[],contrast:0,speed:15,radius:0};addPropertyControls(PerlinWall,{shapeType:{type:ControlType.Enum,options:[\"Square\",\"Circle\"],defaultValue:PerlinWall.defaultProps.shapeType,displaySegmentedControl:true,segmentedControlDirection:\"vertical\"},size:{type:ControlType.Number,defaultValue:PerlinWall.defaultProps.size,min:1,max:20,step:1},gap:{type:ControlType.Number,defaultValue:PerlinWall.defaultProps.gap,min:0,max:20,step:1},colors:{type:ControlType.Array,control:{type:ControlType.Color},defaultValue:PerlinWall.defaultProps.colors},contrast:{type:ControlType.Number,defaultValue:PerlinWall.defaultProps.contrast,min:-10,max:10,step:1,displayStepper:true},speed:{type:ControlType.Number,defaultValue:PerlinWall.defaultProps.speed,min:1,max:100,step:1},radius:{type:ControlType.Number,defaultValue:PerlinWall.defaultProps.radius,min:0,max:1e3,step:1,description:\"More components at [Framer University](https://framer.university?utm_source=component).\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"PerlinWall\",\"slots\":[],\"annotations\":{\"framerIntrinsicWidth\":\"500\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerDisableUnlink\":\"*\",\"framerIntrinsicHeight\":\"500\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ShimmerDot_Prod.map"],
  "mappings": "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",
  "names": ["extractRGBColorFromString", "str", "rgbRegex", "match", "noise", "x", "y", "X", "Y", "u", "fade", "v", "A", "p", "B", "lerp", "grad", "t", "b", "hash", "h", "i", "generatePerlinNoise", "width", "height", "cellSize", "canvas", "ctx", "imageData", "data", "value", "cell", "createSeamlessPerlinNoise", "singleNoise", "PerlinWall", "props", "shapeType", "size", "gap", "colors", "contrast", "speed", "radius", "containerRef", "pe", "canvasRef", "isClient", "setIsClient", "ye", "ue", "perlinNoiseDataUrl", "se", "noiseWidth", "noiseHeight", "animationDuration", "container", "resizeCanvas", "drawShapes", "colorBatch", "color", "opacity", "getRandomOpacity", "resizeObserver", "motion", "addPropertyControls", "ControlType"]
}
