{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/euJyqok3j59rSaCbYY7j/ImuP6DbbDF13b25thiHW/Dots.js"],
  "sourcesContent": ["/**\n * IMPORTANT NOTICE\n *\n * This code is provided by Stylokit INC for use exclusively in your own projects.\n * Redistribution of this code as a standalone product or for a fee is strictly prohibited.\n * You may only profit from your own projects that incorporate this code, and you may not disassemble,\n * modify, and sell the code in isolation from your project.\n *\n * By using this code, you agree to abide by these terms and conditions.\n */import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useRef,useEffect}from\"react\";import{Frame,addPropertyControls,ControlType}from\"framer\";/**\n * Made by Stylokit\n *\n * @framerDisableUnlink\n */export function BackgroundDotsPattern(props){const canvasRef=useRef(null);const tileCanvasRef=useRef(null);const dotSize=1// Fixed dot size\n;const{gapSize}=props;const drawTile=()=>{const tileCanvas=tileCanvasRef.current;const context=tileCanvas.getContext(\"2d\");const tileSize=dotSize+gapSize;// Set tile canvas size\ntileCanvas.width=tileSize;tileCanvas.height=tileSize;// Draw a single dot in the tile\ncontext.clearRect(0,0,tileSize,tileSize);context.fillStyle=props.color;context.beginPath();context.arc(dotSize/2,dotSize/2,dotSize/2,0,Math.PI*2);context.fill();};const applyPattern=()=>{const canvas=canvasRef.current;const context=canvas.getContext(\"2d\");const tileCanvas=tileCanvasRef.current;// Set main canvas dimensions\nconst width=canvas.offsetWidth;const height=canvas.offsetHeight;canvas.width=width;canvas.height=height;// Create a pattern using the tile\nconst pattern=context.createPattern(tileCanvas,\"repeat\");// Fill the main canvas with the pattern\ncontext.clearRect(0,0,width,height);context.fillStyle=pattern;context.fillRect(0,0,width,height);};useEffect(()=>{const canvas=canvasRef.current;const resizeObserver=new ResizeObserver(()=>{applyPattern()// Redraw pattern when canvas size changes\n;});resizeObserver.observe(canvas);// Initial draw\ndrawTile();applyPattern();return()=>resizeObserver.disconnect();},[gapSize,props.color]);return /*#__PURE__*/_jsxs(Frame,{size:\"100%\",background:\"transparent\",overflow:\"hidden\",style:{pointerEvents:\"auto\"},children:[/*#__PURE__*/_jsx(\"canvas\",{ref:tileCanvasRef,style:{display:\"none\"}}),/*#__PURE__*/_jsx(\"canvas\",{ref:canvasRef,style:{width:\"100%\",height:\"100%\",display:\"block\"}})]});}addPropertyControls(BackgroundDotsPattern,{color:{type:ControlType.Color,title:\"Color\",defaultValue:\"#FFFFFF\"},gapSize:{type:ControlType.Number,title:\"Gap Size\",defaultValue:16,min:4}});\nexport const __FramerMetadata__ = {\"exports\":{\"BackgroundDotsPattern\":{\"type\":\"reactComponent\",\"name\":\"BackgroundDotsPattern\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerDisableUnlink\":\"\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Dots.map"],
  "mappings": "8JAAAA,IAaU,SAASC,EAAsBC,EAAM,CAAC,IAAMC,EAAUC,EAAO,IAAI,EAAQC,EAAcD,EAAO,IAAI,EAAQE,EAAQ,EACtH,CAAC,QAAAC,CAAO,EAAEL,EAAYM,EAAS,IAAI,CAAC,IAAMC,EAAWJ,EAAc,QAAcK,EAAQD,EAAW,WAAW,IAAI,EAAQE,EAASL,EAAQC,EAClJE,EAAW,MAAME,EAASF,EAAW,OAAOE,EAC5CD,EAAQ,UAAU,EAAE,EAAEC,EAASA,CAAQ,EAAED,EAAQ,UAAUR,EAAM,MAAMQ,EAAQ,UAAU,EAAEA,EAAQ,IAAIJ,EAAQ,EAAEA,EAAQ,EAAEA,EAAQ,EAAE,EAAE,KAAK,GAAG,CAAC,EAAEI,EAAQ,KAAK,CAAE,EAAQE,EAAa,IAAI,CAAC,IAAMC,EAAOV,EAAU,QAAcO,EAAQG,EAAO,WAAW,IAAI,EAAQJ,EAAWJ,EAAc,QACzRS,EAAMD,EAAO,YAAkBE,EAAOF,EAAO,aAAaA,EAAO,MAAMC,EAAMD,EAAO,OAAOE,EACjG,IAAMC,EAAQN,EAAQ,cAAcD,EAAW,QAAQ,EACvDC,EAAQ,UAAU,EAAE,EAAEI,EAAMC,CAAM,EAAEL,EAAQ,UAAUM,EAAQN,EAAQ,SAAS,EAAE,EAAEI,EAAMC,CAAM,CAAE,EAAE,OAAAE,EAAU,IAAI,CAAC,IAAMJ,EAAOV,EAAU,QAAce,EAAe,IAAI,eAAe,IAAI,CAACN,EAAa,CAC1M,CAAC,EAAE,OAAAM,EAAe,QAAQL,CAAM,EACjCL,EAAS,EAAEI,EAAa,EAAQ,IAAIM,EAAe,WAAW,CAAE,EAAE,CAACX,EAAQL,EAAM,KAAK,CAAC,EAAsBiB,EAAMC,EAAM,CAAC,KAAK,OAAO,WAAW,cAAc,SAAS,SAAS,MAAM,CAAC,cAAc,MAAM,EAAE,SAAS,CAAcC,EAAK,SAAS,CAAC,IAAIhB,EAAc,MAAM,CAAC,QAAQ,MAAM,CAAC,CAAC,EAAegB,EAAK,SAAS,CAAC,IAAIlB,EAAU,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,QAAQ,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,CAACmB,EAAoBrB,EAAsB,CAAC,MAAM,CAAC,KAAKsB,EAAY,MAAM,MAAM,QAAQ,aAAa,SAAS,EAAE,QAAQ,CAAC,KAAKA,EAAY,OAAO,MAAM,WAAW,aAAa,GAAG,IAAI,CAAC,CAAC,CAAC",
  "names": ["init_ssg_sandbox_shims", "BackgroundDotsPattern", "props", "canvasRef", "pe", "tileCanvasRef", "dotSize", "gapSize", "drawTile", "tileCanvas", "context", "tileSize", "applyPattern", "canvas", "width", "height", "pattern", "ue", "resizeObserver", "u", "Frame", "p", "addPropertyControls", "ControlType"]
}