{"version":3,"file":"FormstackForm.C3VwHxvb.mjs","names":[],"sources":["https:/framerusercontent.com/modules/RFGbBWpu4qWEByZQxra2/0OWnyaIgoEcAWKJZoH3l/FormstackForm.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef,useState}from\"react\";export default function FormstackForm(){const iframeRef=useRef(null);const[isClient,setIsClient]=useState(false);const[iframeHeight,setIframeHeight]=useState(700);useEffect(()=>{setIsClient(true);},[]);useEffect(()=>{if(!isClient||!iframeRef.current)return;const iframe=iframeRef.current;const iframeWindow=iframe.contentWindow;const iframeDoc=iframeWindow.document;// Create a clean HTML document inside the iframe\niframeDoc.open();iframeDoc.write(`\n            <!DOCTYPE html>\n            <html>\n                <head>\n                    <meta charset=\"utf-8\">\n                    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n                    <style>\n                        body {\n                            margin: 0;\n                            padding: 0;\n                            font-family: sans-serif;\n                            background-color: transparent;\n                            width: 100%;\n                            max-width: 100%;\n                            overflow-x: hidden;\n                        }\n                        \n                        /* Form container styling for better responsiveness */\n                        #form-container {\n                            width: 100%;\n                            max-width: 800px;\n                            margin: 0 auto;\n                            padding: 0 10px;\n                        }\n                        \n                        /* Responsive adjustments */\n                        @media (min-width: 768px) {\n                            #form-container {\n                                padding: 0 20px;\n                            }\n                        }\n                        \n                        /* Form-specific styles contained within iframe */\n                        img {\n                            width: auto !important;\n                            height: auto !important;\n                            max-width: 100% !important;\n                            object-fit: contain !important;\n                        }\n                        \n                        /* Additional form styling */\n                        input, select, textarea {\n                            font-family: inherit;\n                            font-size: inherit;\n                            max-width: 100%;\n                        }\n                        \n                        /* Make form elements more responsive */\n                        .ff-form, form, .ff-container {\n                            width: 100% !important;\n                            max-width: 100% !important;\n                        }\n                        \n                        /* Adjust button styling */\n                        button, .ff-btn, [class*=\"button\"], [type=\"button\"], [type=\"submit\"] {\n                            cursor: pointer;\n                        }\n                    </style>\n                </head>\n                <body>\n                    <div id=\"form-container\"></div>\n                </body>\n            </html>\n        `);iframeDoc.close();// Add the Formstack script to the iframe document\nconst script=iframeDoc.createElement(\"script\");script.type=\"text/javascript\";script.id=\"jsFastForms\";script.src=\"https://intercaretherapy.my.salesforce-sites.com/services/apexrest/VisualAntidote/FFNEngine/v1/?d=XasaKLriZGcp9auCn97pPw%3D%3D\";script.async=true;iframeDoc.body.appendChild(script);// Function to resize iframe based on content height\nconst resizeObserver=new ResizeObserver(entries=>{for(let entry of entries){const newHeight=entry.target.scrollHeight;// Add a small buffer to avoid scrollbars\nsetIframeHeight(newHeight+50);}});// Observe the iframe body for size changes\nresizeObserver.observe(iframeDoc.body);// Scroll to top function that will be called when form navigation occurs\nconst scrollToTop=()=>{iframeWindow.scrollTo({top:0,behavior:\"smooth\"});// Also inform parent to scroll to the container if needed\nwindow.scrollTo({top:iframe.getBoundingClientRect().top+window.pageYOffset-50,behavior:\"smooth\"});};// Inject a script to handle clicks on next/prev buttons and form navigation\nconst navigationScript=iframeDoc.createElement(\"script\");navigationScript.innerHTML=`\n            // Function to detect form navigation and scroll to top\n            function setupFormNavigationListener() {\n                // Handle click events on the document\n                document.addEventListener('click', (e) => {\n                    // Look for next/prev buttons, submit buttons, or navigation elements\n                    const target = e.target;\n                    const isNavButton = \n                        target.matches('button, .ff-btn, [type=\"button\"], [type=\"submit\"], .next, .prev, .submit, [class*=\"next\"], [class*=\"prev\"], [class*=\"submit\"], [class*=\"button\"]') || \n                        target.closest('button, .ff-btn, [type=\"button\"], [type=\"submit\"], .next, .prev, .submit, [class*=\"next\"], [class*=\"prev\"], [class*=\"submit\"], [class*=\"button\"]');\n                    \n                    if (isNavButton) {\n                        // Short delay to allow form processing\n                        setTimeout(() => {\n                            window.scrollTo({ top: 0, behavior: 'smooth' });\n                            // Also inform the parent\n                            window.parent.postMessage({\n                                type: 'formstack-scroll',\n                                action: 'scrollToTop'\n                            }, '*');\n                        }, 100);\n                    }\n                });\n                \n                // Also watch for form submissions\n                const forms = document.querySelectorAll('form');\n                forms.forEach(form => {\n                    form.addEventListener('submit', () => {\n                        setTimeout(() => {\n                            window.scrollTo({ top: 0, behavior: 'smooth' });\n                            window.parent.postMessage({\n                                type: 'formstack-scroll',\n                                action: 'scrollToTop'\n                            }, '*');\n                        }, 100);\n                    });\n                });\n                \n                // Watch for hash changes which might indicate page navigation in multi-page forms\n                window.addEventListener('hashchange', () => {\n                    window.scrollTo({ top: 0, behavior: 'smooth' });\n                    window.parent.postMessage({\n                        type: 'formstack-scroll',\n                        action: 'scrollToTop'\n                    }, '*');\n                });\n            }\n            \n            // Setup initial listeners\n            setupFormNavigationListener();\n            \n            // Try again after everything loads\n            window.addEventListener('load', () => {\n                setupFormNavigationListener();\n                \n                // Continue to monitor for new form elements\n                const observer = new MutationObserver(mutations => {\n                    for (const mutation of mutations) {\n                        if (mutation.addedNodes.length) {\n                            setupFormNavigationListener();\n                        }\n                    }\n                });\n                \n                observer.observe(document.body, { \n                    childList: true, \n                    subtree: true \n                });\n            });\n            \n            // Report height on various events\n            const reportHeight = () => {\n                window.parent.postMessage({\n                    type: 'formstack-height',\n                    height: document.body.scrollHeight\n                }, '*');\n            };\n            \n            // Report height periodically\n            setInterval(reportHeight, 500);\n            \n            // Report on DOM changes\n            const heightObserver = new MutationObserver(reportHeight);\n            heightObserver.observe(document.body, { \n                childList: true, \n                subtree: true, \n                attributes: true \n            });\n        `;iframeDoc.body.appendChild(navigationScript);// Handle messages from iframe content\nconst handleMessage=event=>{if(event.data&&event.data.type===\"formstack-height\"){setIframeHeight(event.data.height+50);}else if(event.data&&event.data.type===\"formstack-scroll\"&&event.data.action===\"scrollToTop\"){scrollToTop();}};window.addEventListener(\"message\",handleMessage);// Additional resize handling\nconst handleResize=()=>{const newHeight=iframeDoc.body.scrollHeight;setIframeHeight(newHeight+50);};iframeWindow.addEventListener(\"load\",handleResize);iframeWindow.addEventListener(\"resize\",handleResize);// Periodic resize check as a fallback\nconst resizeInterval=setInterval(handleResize,1e3);return()=>{resizeObserver.disconnect();iframeWindow.removeEventListener(\"load\",handleResize);iframeWindow.removeEventListener(\"resize\",handleResize);window.removeEventListener(\"message\",handleMessage);clearInterval(resizeInterval);};},[isClient]);const containerStyle={width:\"100%\",maxWidth:\"900px\",margin:\"0 auto\",position:\"relative\"};return /*#__PURE__*/_jsx(\"div\",{style:containerStyle,children:/*#__PURE__*/_jsx(\"iframe\",{ref:iframeRef,title:\"Formstack Form\",style:{width:\"100%\",height:`${iframeHeight}px`,border:\"none\",overflow:\"hidden\",backgroundColor:\"transparent\",display:\"block\"},scrolling:\"no\"})});}\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"FormstackForm\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./FormstackForm.map"],"mappings":"mNAAwF,SAAwB,GAAe,CAAC,IAAM,EAAU,EAAO,KAAK,CAAM,CAAC,EAAS,EAAY,CAAC,GAAS,EAAM,CAAM,CAAC,EAAa,EAAgB,CAAC,EAAS,IAAI,CAAwC,AAAvC,EAAU,IAAI,CAAC,GAAY,EAAK,AAAE,EAAC,CAAE,EAAC,CAAC,EAAU,IAAI,CAAC,IAAI,IAAW,EAAU,QAAQ,OAAO,IAAM,EAAO,EAAU,QAAc,EAAa,EAAO,cAAoB,EAAU,EAAa,SAgElb,AA/DX,EAAU,MAAM,CAAC,EAAU,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UA+DjB,CAAC,EAAU,OAAO,CAC5B,IAAM,EAAO,EAAU,cAAc,SAAS,CAAqN,AAApN,EAAO,KAAK,kBAAkB,EAAO,GAAG,cAAc,EAAO,IAAI,iIAAiI,EAAO,OAAM,EAAK,EAAU,KAAK,YAAY,EAAO,CACrS,IAAM,EAAe,IAAI,eAAe,GAAS,CAAC,IAAI,IAAI,KAAS,EAAQ,CAAC,IAAM,EAAU,EAAM,OAAO,aACzG,EAAgB,EAAU,GAAG,AAAE,CAAC,GAChC,EAAe,QAAQ,EAAU,KAAK,CACtC,IAAM,EAAY,IAAI,CACtB,AADuB,EAAa,SAAS,CAAC,IAAI,EAAE,SAAS,QAAS,EAAC,CACvE,EAAO,SAAS,CAAC,IAAI,EAAO,uBAAuB,CAAC,IAAI,EAAO,YAAY,GAAG,SAAS,QAAS,EAAC,AAAE,EAC7F,EAAiB,EAAU,cAAc,SAAS,CAwF9C,AAxF+C,EAAiB,UAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAwFhE,EAAU,KAAK,YAAY,EAAiB,CACtD,IAAM,EAAc,GAAO,CAAC,AAAG,EAAM,MAAM,EAAM,KAAK,OAAO,mBAAoB,EAAgB,EAAM,KAAK,OAAO,GAAG,CAAU,EAAM,MAAM,EAAM,KAAK,OAAO,oBAAoB,EAAM,KAAK,SAAS,eAAe,GAAa,AAAG,EAAC,EAAO,iBAAiB,UAAU,EAAc,CACtR,IAAM,EAAa,IAAI,CAAC,IAAM,EAAU,EAAU,KAAK,aAAa,EAAgB,EAAU,GAAG,AAAE,EAAoD,AAAnD,EAAa,iBAAiB,OAAO,EAAa,CAAC,EAAa,iBAAiB,SAAS,EAAa,CAC3M,IAAM,EAAe,YAAY,EAAa,IAAI,CAAC,MAAM,IAAI,CAA+L,AAA9L,EAAe,YAAY,CAAC,EAAa,oBAAoB,OAAO,EAAa,CAAC,EAAa,oBAAoB,SAAS,EAAa,CAAC,EAAO,oBAAoB,UAAU,EAAc,CAAC,cAAc,EAAe,AAAE,CAAE,EAAC,CAAC,CAAS,EAAC,CAAC,IAAM,EAAe,CAAC,MAAM,OAAO,SAAS,QAAQ,OAAO,SAAS,SAAS,UAAW,EAAC,MAAoB,GAAK,MAAM,CAAC,MAAM,EAAe,SAAsB,EAAK,SAAS,CAAC,IAAI,EAAU,MAAM,iBAAiB,MAAM,CAAC,MAAM,OAAO,UAAU,EAAa,IAAI,OAAO,OAAO,SAAS,SAAS,gBAAgB,cAAc,QAAQ,OAAQ,EAAC,UAAU,IAAK,EAAC,AAAC,EAAC,AAAE,kBAlKppB,GAA2C,IAA6C"}