{"version":3,"file":"Case_Study_How_It_Works_Overlay.DR5jgZ9m.mjs","names":["useRef"],"sources":["https:/framerusercontent.com/modules/iAVmD0WAciCU7O4KN1pY/uwaZ3sFTcertO9LWKRlU/Case_Study_How_It_Works_Overlay.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef}from\"react\";// Apply this override to each \"How It Works\" card frame (1–4).\n// It uses a MutationObserver on the document to catch the overlay\n// portal the instant Framer injects it, then forces correct dimensions\n// before the first paint.\nexport function withOverlayResize(Component){return props=>{const ref=useRef(null);useEffect(()=>{const el=ref.current;if(!el)return;const cardHeader=el.querySelector(\"[data-framer-name='Card Header']\")||el;const portalId=cardHeader.id;if(!portalId)return;const applySize=portal=>{const rect=cardHeader.getBoundingClientRect();if(rect.width===0)return;// Safe area — remove the fixed clip-path and set true size\nconst safeArea=portal.querySelector(\"[data-safearea]\");if(safeArea){safeArea.style.width=`${rect.width}px`;safeArea.style.height=`${rect.height}px`;safeArea.style.clipPath=`inset(0px)`;}// Dialog wrapper\nconst dialog=portal.querySelector(\"[role='dialog']\");if(dialog){dialog.style.width=`${rect.width}px`;dialog.style.height=`${rect.height}px`;}// Inner Card Header(s) inside the overlay\nportal.querySelectorAll(\"[data-framer-name='Card Header']\").forEach(inner=>{inner.style.width=`${rect.width}px`;inner.style.height=`${rect.height}px`;});};// Watch the entire document for the portal being added/removed\nconst portalSelector=`[data-framer-portal-id=\"${portalId}\"]`;const domObserver=new MutationObserver(mutations=>{for(const mutation of mutations){for(const node of mutation.addedNodes){if(!(node instanceof HTMLElement))continue;// Check if the added node IS the portal or CONTAINS it\nconst portal=node.matches?.(portalSelector)?node:node.querySelector?.(portalSelector);if(portal){// Apply immediately and again after Framer's\n// entrance animation frames settle\napplySize(portal);requestAnimationFrame(()=>applySize(portal));setTimeout(()=>applySize(portal),50);setTimeout(()=>applySize(portal),150);}}}});domObserver.observe(document.body,{childList:true,subtree:true});// ResizeObserver on the Card Header handles viewport scaling\n// while the overlay is already visible\nconst resizeObserver=new ResizeObserver(()=>{const portal=document.querySelector(portalSelector);if(portal)applySize(portal);});resizeObserver.observe(cardHeader);return()=>{domObserver.disconnect();resizeObserver.disconnect();};},[]);return /*#__PURE__*/_jsx(\"div\",{ref:ref,style:{display:\"contents\"},children:/*#__PURE__*/_jsx(Component,{...props})});};}\nexport const __FramerMetadata__ = {\"exports\":{\"withOverlayResize\":{\"type\":\"reactHoc\",\"name\":\"withOverlayResize\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Case_Study_How_It_Works_Overlay.map"],"mappings":"yHAIA,SAAgB,EAAkB,EAAU,CAAC,MAAO,IAAO,CAAC,IAAM,EAAIA,EAAO,KAAK,CASyJ,OATxJ,MAAc,CAAC,IAAM,EAAG,EAAI,QAAQ,GAAG,CAAC,EAAG,OAAO,IAAM,EAAW,EAAG,cAAc,mCAAmC,EAAE,EAAS,EAAS,EAAW,GAAG,GAAG,CAAC,EAAS,OAAO,IAAM,EAAU,GAAQ,CAAC,IAAM,EAAK,EAAW,uBAAuB,CAAC,GAAG,EAAK,QAAQ,EAAE,OACzV,IAAM,EAAS,EAAO,cAAc,kBAAkB,CAAI,IAAU,EAAS,MAAM,MAAM,GAAG,EAAK,MAAM,IAAI,EAAS,MAAM,OAAO,GAAG,EAAK,OAAO,IAAI,EAAS,MAAM,SAAS,cAC5K,IAAM,EAAO,EAAO,cAAc,kBAAkB,CAAI,IAAQ,EAAO,MAAM,MAAM,GAAG,EAAK,MAAM,IAAI,EAAO,MAAM,OAAO,GAAG,EAAK,OAAO,KACxI,EAAO,iBAAiB,mCAAmC,CAAC,QAAQ,GAAO,CAAC,EAAM,MAAM,MAAM,GAAG,EAAK,MAAM,IAAI,EAAM,MAAM,OAAO,GAAG,EAAK,OAAO,KAAM,EAClJ,EAAe,2BAA2B,EAAS,IAAU,EAAY,IAAI,iBAAiB,GAAW,CAAC,IAAI,IAAM,KAAY,EAAW,IAAI,IAAM,KAAQ,EAAS,WAAW,CAAC,GAAG,EAAE,aAAgB,aAAa,SAC1N,IAAM,EAAO,EAAK,UAAU,EAAe,CAAC,EAAK,EAAK,gBAAgB,EAAe,CAAI,IAEzF,EAAU,EAAO,CAAC,0BAA0B,EAAU,EAAO,CAAC,CAAC,eAAe,EAAU,EAAO,CAAC,GAAG,CAAC,eAAe,EAAU,EAAO,CAAC,IAAI,IAAM,CAAC,EAAY,QAAQ,SAAS,KAAK,CAAC,UAAU,GAAK,QAAQ,GAAK,CAAC,CAEhN,IAAM,EAAe,IAAI,mBAAmB,CAAC,IAAM,EAAO,SAAS,cAAc,EAAe,CAAI,GAAO,EAAU,EAAO,EAAG,CAAoC,OAAnC,EAAe,QAAQ,EAAW,KAAW,CAAC,EAAY,YAAY,CAAC,EAAe,YAAY,GAAK,EAAE,CAAC,CAAqB,EAAK,MAAM,CAAK,MAAI,MAAM,CAAC,QAAQ,WAAW,CAAC,SAAsB,EAAK,EAAU,CAAC,GAAG,EAAM,CAAC,CAAC,CAAC,mBAbrT,IAAoC"}