{"version":3,"file":"CubicalGridBackground.BU5DBSrO.mjs","names":["useRef","useState","useMemo","useCallback"],"sources":["https:/framerusercontent.com/modules/V2v2MaH05rKnuMvahOjC/EAVd67W3IVDO0u5ZlsrK/CubicalGridBackground.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useCallback,useLayoutEffect,useMemo,useRef,useState,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";/**\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function CubicalGridBackground(props){const{columns=24,lineColor=\"#222\",lineThickness=.5,backgroundColor=\"rgba(0, 0, 0, 0)\"}=props;const rootRef=useRef(null);const[measuredWidth,setMeasuredWidth]=useState(null);const safeColumns=useMemo(()=>Math.max(1,Math.round(columns)),[columns]);const updateMeasuredWidth=useCallback(nextWidth=>{startTransition(()=>{setMeasuredWidth(previousWidth=>previousWidth===nextWidth?previousWidth:nextWidth);});},[]);useLayoutEffect(()=>{if(typeof window===\"undefined\"||typeof ResizeObserver===\"undefined\")return;const element=rootRef.current;if(!element)return;updateMeasuredWidth(element.getBoundingClientRect().width);const observer=new ResizeObserver(entries=>{const entry=entries[0];if(!entry)return;updateMeasuredWidth(entry.contentRect.width);});observer.observe(element);return()=>observer.disconnect();},[updateMeasuredWidth]);const cellSize=useMemo(()=>{if(measuredWidth!==null){return`${measuredWidth/safeColumns}px`;}return`calc(100vw / ${safeColumns})`;},[measuredWidth,safeColumns]);const thickness=`${lineThickness}px`;return /*#__PURE__*/_jsx(\"div\",{ref:rootRef,style:{position:\"relative\",width:\"100%\",height:\"100%\",backgroundColor,backgroundImage:`\n                    repeating-linear-gradient(\n                        to right,\n                        ${lineColor} 0,\n                        ${lineColor} ${thickness},\n                        transparent ${thickness},\n                        transparent ${cellSize}\n                    ),\n                    repeating-linear-gradient(\n                        to bottom,\n                        ${lineColor} 0,\n                        ${lineColor} ${thickness},\n                        transparent ${thickness},\n                        transparent ${cellSize}\n                    )\n                `,backgroundSize:`${cellSize} ${cellSize}`,backgroundRepeat:\"repeat\"}});}addPropertyControls(CubicalGridBackground,{columns:{type:ControlType.Number,title:\"Columns\",defaultValue:24,min:1,max:100,step:1},lineColor:{type:ControlType.Color,title:\"Line Color\",defaultValue:\"#222\"},lineThickness:{type:ControlType.Number,title:\"Thickness\",defaultValue:.5,min:.25,max:4,step:.25},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"rgba(0, 0, 0, 0)\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"CubicalGridBackground\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./CubicalGridBackground.map"],"mappings":"4NAGG,SAAwB,EAAsB,EAAM,CAAC,GAAK,CAAC,UAAQ,GAAG,YAAU,OAAO,gBAAc,GAAG,kBAAgB,oBAAoB,EAAY,EAAQA,EAAO,IAAI,EAAO,CAAC,EAAc,GAAkBC,EAAS,IAAI,EAAQ,EAAYC,MAAY,KAAK,IAAI,EAAE,KAAK,MAAM,CAAO,CAAC,EAAE,CAAC,CAAO,CAAC,EAAQ,EAAoBC,EAAY,GAAW,CAAC,MAAoB,CAAC,EAAiB,GAAe,IAAgB,EAAU,EAAc,CAAS,CAAE,CAAC,CAAE,EAAE,CAAC,CAAC,EAAE,MAAoB,CAAC,GAAU,IAAS,QAAa,OAAO,eAAiB,IAAY,OAAO,IAAM,EAAQ,EAAQ,QAAQ,GAAG,CAAC,EAAQ,OAAO,EAAoB,EAAQ,sBAAsB,CAAC,CAAC,KAAK,EAAE,IAAM,EAAS,IAAI,eAAe,GAAS,CAAC,IAAM,EAAM,EAAQ,GAAO,GAAa,EAAoB,EAAM,YAAY,KAAK,CAAE,CAAC,EAA4B,OAA1B,EAAS,QAAQ,CAAO,MAAY,EAAS,WAAW,CAAE,EAAE,CAAC,CAAmB,CAAC,EAAE,IAAM,EAASD,MAAgB,IAAgB,KAAoD,gBAAgB,EAAY,GAApE,GAAG,EAAc,EAAY,IAA4C,CAAC,EAAc,CAAW,CAAC,EAAQ,EAAU,GAAG,EAAc,IAAI,OAAoB,EAAK,MAAM,CAAC,IAAI,EAAQ,MAAM,CAAC,SAAS,WAAW,MAAM,OAAO,OAAO,OAAO,kBAAgB,gBAAgB;;;0BAGlqC,EAAU;0BACV,EAAU,GAAG,EAAU;sCACX,EAAU;sCACV,EAAS;;;;0BAIrB,EAAU;0BACV,EAAU,GAAG,EAAU;sCACX,EAAU;sCACV,EAAS;;kBAE7B,eAAe,GAAG,EAAS,GAAG,IAAW,iBAAiB,QAAQ,CAAC,CAAC,CAAE,qBAlB9C,IAAuF,IAAoD,EAkB5F,EAAoB,EAAsB,CAAC,QAAQ,CAAC,KAAK,EAAY,OAAO,MAAM,UAAU,aAAa,GAAG,IAAI,EAAE,IAAI,IAAI,KAAK,CAAC,EAAE,UAAU,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,MAAM,EAAE,cAAc,CAAC,KAAK,EAAY,OAAO,MAAM,YAAY,aAAa,GAAG,IAAI,IAAI,IAAI,EAAE,KAAK,GAAG,EAAE,gBAAgB,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,kBAAkB,CAAC,CAAC"}