{"version":3,"file":"ScrollThemeTrigger.CSpQPMdA.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/c0mv98uRbqhVhk8YKWt6/C5TZ54IOsoFECHszMnRi/ScrollThemeTrigger.js"],"sourcesContent":["// Component that triggers theme changes based on scroll position when defined section IDs enter the viewport\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useState,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";// ---- Helpers ----\n// Detect OS theme (same as in the toggle override)\nfunction getOSTheme(){if(typeof window!==\"undefined\"&&typeof document!==\"undefined\"){if(window.matchMedia&&window.matchMedia(\"(prefers-color-scheme: dark)\").matches){return\"dark\";}return\"light\";}return\"light\";}/**\n * Force theme in the same way as the toggle,\n * but patching *all* style tags that contain prefers-color-scheme.\n */function setThemeFromScroll(targetTheme){if(typeof window===\"undefined\"||typeof document===\"undefined\")return;// 1) Attributes for Framer preview / any CSS using data attributes\nconst body=document.body;const html=document.documentElement;if(body){body.setAttribute(\"data-framer-theme\",targetTheme);}if(html){html.setAttribute(\"data-framer-theme\",targetTheme);html.setAttribute(\"data-theme\",targetTheme);}// 2) Update localStorage like the toggle does\nlocalStorage.setItem(\"currentToggleState\",targetTheme);// 3) Patch prefers-color-scheme in ANY <style> tag that contains it (for LIVE)\nconst currentOsTheme=localStorage.getItem(\"currentOsTheme\")||getOSTheme();const prefersValue=targetTheme===\"dark\"&&currentOsTheme===\"dark\"||targetTheme===\"light\"&&currentOsTheme===\"light\"?\"dark\":\"light\";const styleTags=Array.from(document.getElementsByTagName(\"style\"));styleTags.forEach(styleTag=>{const css=styleTag.innerHTML;if(!css||!css.includes(\"prefers-color-scheme\"))return;const newCSS=css.replace(/prefers-color-scheme\\s*:\\s*(dark|light)/g,`prefers-color-scheme: ${prefersValue}`);if(newCSS!==css){styleTag.innerHTML=newCSS;}});// 4) Notify listeners (including the existing toggle)\nwindow.dispatchEvent(new CustomEvent(\"themeChange\"));}/**\n * Updated detection strategy (recommended for sticky/overlapping layouts):\n * A section becomes \"active\" when it spans a trigger line within the viewport.\n */function computeActiveTheme(themes,thresholdPercent){if(typeof window===\"undefined\"||typeof document===\"undefined\")return null;const viewportHeight=window.innerHeight||0;if(viewportHeight===0)return null;const triggerY=thresholdPercent/100*viewportHeight;const matches=[];for(const config of themes){const cleanId=config.sectionId.replace(/^#/,\"\");const el=document.getElementById(cleanId);if(!el)continue;const rect=el.getBoundingClientRect();if(rect.top<=triggerY&&rect.bottom>=triggerY){matches.push(config);}}if(matches.length===0)return null;// Priority: last in the themes array wins\nfor(let i=themes.length-1;i>=0;i--){if(matches.some(m=>m.sectionId===themes[i].sectionId)){return themes[i];}}return null;}/**\n * Scroll Theme Trigger\n *\n * @framerIntrinsicWidth 200\n * @framerIntrinsicHeight 100\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function ScrollThemeTrigger(props){const{themes,threshold,transitionDuration,easing,initialTheme,showDebugPanel}=props;const[currentTheme,setCurrentTheme]=useState(null);// Prevent hydration mismatches by rendering UI only after mount\nconst[mounted,setMounted]=useState(false);// Prevent #422 by deferring ANY document/head mutations until hydration settles\nconst[readyForDomWrites,setReadyForDomWrites]=useState(false);useEffect(()=>{setMounted(true);if(typeof window===\"undefined\")return;// Wait two animation frames. This avoids racing Suspense/streaming hydration.\nlet raf1=0;let raf2=0;raf1=requestAnimationFrame(()=>{raf2=requestAnimationFrame(()=>{setReadyForDomWrites(true);});});return()=>{cancelAnimationFrame(raf1);cancelAnimationFrame(raf2);};},[]);// Set initial theme (only after hydration is safely settled)\nuseEffect(()=>{if(!readyForDomWrites)return;setThemeFromScroll(initialTheme);},[initialTheme,readyForDomWrites]);useEffect(()=>{if(typeof window===\"undefined\")return;if(!readyForDomWrites)return;// Add smooth transitions (with exclusions for interactive elements)\nconst styleId=\"scroll-theme-transition-style\";let styleElement=document.getElementById(styleId);if(!styleElement){styleElement=document.createElement(\"style\");styleElement.id=styleId;document.head.appendChild(styleElement);}styleElement.textContent=`\n            /* Global theme fade */\n            [data-framer-theme] * {\n                transition: background-color ${transitionDuration}ms ${easing},\n                            color ${transitionDuration}ms ${easing},\n                            border-color ${transitionDuration}ms ${easing},\n                            fill ${transitionDuration}ms ${easing},\n                            stroke ${transitionDuration}ms ${easing};\n            }\n\n            /* Exclude interactive elements and explicit opt-outs \n               so hover states remain snappy */\n            [data-framer-theme] a,\n            [data-framer-theme] button,\n            [data-framer-theme] [role=\"button\"],\n            [data-framer-theme] input,\n            [data-framer-theme] textarea,\n            [data-framer-theme] select,\n            [data-framer-theme] [data-theme-no-transition=\"true\"] {\n                transition: none !important;\n            }\n        `;let ticking=false;const update=()=>{ticking=false;startTransition(()=>{const active=computeActiveTheme(themes,threshold);if(!active){setCurrentTheme(null);setThemeFromScroll(initialTheme);return;}setCurrentTheme(prev=>{if(!prev||prev.sectionId!==active.sectionId||prev.theme!==active.theme){setThemeFromScroll(active.theme);return active;}return prev;});});};const onScrollOrResize=()=>{if(!ticking){ticking=true;requestAnimationFrame(update);}};// Initial run (after hydration-safe gate)\nupdate();window.addEventListener(\"scroll\",onScrollOrResize,{passive:true});window.addEventListener(\"resize\",onScrollOrResize);return()=>{window.removeEventListener(\"scroll\",onScrollOrResize);window.removeEventListener(\"resize\",onScrollOrResize);if(styleElement&&styleElement.parentNode){styleElement.parentNode.removeChild(styleElement);}};},[themes,threshold,transitionDuration,easing,initialTheme,readyForDomWrites]);// If debug panel is off OR we're not mounted yet, don't render any UI (logic still runs)\nif(!mounted||!showDebugPanel){return null;}return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",padding:20,backgroundColor:\"#F5F5F5\",borderRadius:8,fontSize:14,color:\"#000000\",textAlign:\"center\"},children:currentTheme?/*#__PURE__*/_jsxs(\"div\",{children:[/*#__PURE__*/_jsx(\"div\",{style:{fontWeight:600,marginBottom:8},children:\"Scroll Theme Switcher\"}),/*#__PURE__*/_jsxs(\"div\",{style:{opacity:.7},children:[\"Active section:\",\" \",/*#__PURE__*/_jsx(\"strong\",{children:currentTheme.sectionId}),\"\\xa0→ \",/*#__PURE__*/_jsx(\"strong\",{children:currentTheme.theme}),\" theme\"]}),/*#__PURE__*/_jsxs(\"div\",{style:{opacity:.5,marginTop:8,fontSize:12},children:[\"Trigger line: \",threshold,\"% of viewport height\"]})]}):/*#__PURE__*/_jsx(\"div\",{style:{opacity:.5},children:\"Scroll to trigger theme changes\"})});}addPropertyControls(ScrollThemeTrigger,{initialTheme:{type:ControlType.Enum,title:\"Initial Theme\",options:[\"light\",\"dark\"],optionTitles:[\"Light\",\"Dark\"],defaultValue:\"light\",displaySegmentedControl:true},themes:{type:ControlType.Array,title:\"Themes\",control:{type:ControlType.Object,controls:{sectionId:{type:ControlType.String,title:\"Section ID\",defaultValue:\"section-1\"},theme:{type:ControlType.Enum,title:\"Theme\",options:[\"light\",\"dark\"],optionTitles:[\"Light\",\"Dark\"],defaultValue:\"light\",displaySegmentedControl:true}}},defaultValue:[{sectionId:\"section-1\",theme:\"light\"},{sectionId:\"section-2\",theme:\"dark\"}]},threshold:{type:ControlType.Number,title:\"Trigger\",defaultValue:50,min:0,max:100,step:1,unit:\"%\"},transitionDuration:{type:ControlType.Number,title:\"Transition\",defaultValue:500,min:0,max:2e3,step:50,unit:\"ms\"},easing:{type:ControlType.Enum,title:\"Easing\",options:[\"linear\",\"ease\",\"ease-in\",\"ease-out\",\"ease-in-out\",\"cubic-bezier(0.4, 0, 0.2, 1)\",\"cubic-bezier(0.68, -0.55, 0.265, 1.55)\",\"cubic-bezier(0.175, 0.885, 0.32, 1.275)\"],optionTitles:[\"Linear\",\"Ease\",\"Ease In\",\"Ease Out\",\"Ease In Out\",\"Material\",\"Back\",\"Bounce\"],defaultValue:\"ease\"},showDebugPanel:{type:ControlType.Boolean,title:\"Show debug panel\",defaultValue:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ScrollThemeTrigger\",\"slots\":[],\"annotations\":{\"framerIntrinsicWidth\":\"200\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerIntrinsicHeight\":\"100\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ScrollThemeTrigger.map"],"mappings":"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"}