{"version":3,"file":"Loading.BMimLLnn.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/OUqvRUSW31ppM5C27yB0/T94iWbjgP6wDS0OseLja/Loading.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useEffect,useRef,useState}from\"react\";// Utility: find the lottie-web AnimationItem instance mounted inside a DOM node\nfunction findLottieInstance(el){// lottie-web attaches to elements via a WeakMap internally; the easiest\n// cross-library hook is the __lottie property that lottie-web sets on the\n// container element, or the _lottie prop Framer's Lottie component uses.\nconst lottieKeys=[\"__lottie\",\"_lottie\",\"__lottieInstance\"];for(const key of lottieKeys){if(el[key])return el[key];}// Walk children one level deep (Framer wraps Lottie in a div)\nfor(const child of Array.from(el.children)){for(const key of lottieKeys){if(child[key])return child[key];}}return null;}export function withLottiePerformance(Component){const WrappedComponent=({loadStrategy=\"lazy\",rendererMode=\"svg\",rootMargin=200,freezeDelay=300,autoplay=true,loop=true,...props})=>{const wrapperRef=useRef(null);const[mounted,setMounted]=useState(loadStrategy===\"eager\");const[inView,setInView]=useState(false);const freezeTimer=useRef(null);// ── Step 1: Lazy mount ─────────────────────────────────────────────\n// Don't render the Lottie component at all until it's near the viewport.\n// rootMargin pre-loads it slightly before it's visible so there's no\n// pop-in on scroll.\nuseEffect(()=>{if(loadStrategy===\"eager\"){setMounted(true);return;}const mountObserver=new IntersectionObserver(([entry])=>{if(entry.isIntersecting){setMounted(true);mountObserver.disconnect();}},{rootMargin:`${rootMargin}px`});if(wrapperRef.current)mountObserver.observe(wrapperRef.current);return()=>mountObserver.disconnect();},[loadStrategy,rootMargin]);// ── Step 2: Play / pause on visibility ────────────────────────────\n// Once mounted, watch visibility and pause the lottie-web ticker\n// when out of view. Uses a small freeze delay to avoid flickering.\nuseEffect(()=>{if(!mounted||!wrapperRef.current)return;const playObserver=new IntersectionObserver(([entry])=>{if(entry.isIntersecting){if(freezeTimer.current){clearTimeout(freezeTimer.current);freezeTimer.current=null;}setInView(true);// Resume the lottie instance if we can reach it\nconst instance=findLottieInstance(entry.target);if(instance?.play)instance.play();}else{freezeTimer.current=setTimeout(()=>{setInView(false);const instance=findLottieInstance(entry.target);if(instance?.pause)instance.pause();},freezeDelay);}},{threshold:.05});playObserver.observe(wrapperRef.current);return()=>{playObserver.disconnect();if(freezeTimer.current)clearTimeout(freezeTimer.current);};},[mounted,freezeDelay]);// ── Step 3: Inject renderer hint via data attribute ────────────────\n// Framer's built-in Lottie component reads data-renderer if present.\n// For lottie-web directly, this attribute is picked up in useEffect.\nuseEffect(()=>{if(!wrapperRef.current)return;wrapperRef.current.setAttribute(\"data-renderer\",rendererMode);// If lottie-web is already mounted, we can't switch renderer live\n// (it requires a re-init). The attribute is read on first mount.\n},[rendererMode]);return /*#__PURE__*/_jsx(\"div\",{ref:wrapperRef,style:{width:\"100%\",height:\"100%\",// Promote to own GPU layer — cheap for a single Lottie container,\n// avoids repaints bleeding into surrounding layout.\nwillChange:inView?\"transform\":\"auto\",// canvas renderer needs explicit overflow hidden to avoid\n// sub-pixel bleed on some browsers\noverflow:rendererMode===\"canvas\"?\"hidden\":\"visible\"},\"data-renderer\":rendererMode,children:mounted?/*#__PURE__*/_jsx(Component,{...props}):// Placeholder holds layout space while Lottie is not yet mounted.\n// Transparent — no flash of background color.\n/*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\"}})});};// ─── Property Controls ────────────────────────────────────────────────────\naddPropertyControls(WrappedComponent,{loadStrategy:{type:ControlType.Enum,title:\"Load strategy\",options:[\"eager\",\"lazy\"],optionTitles:[\"Eager (on mount)\",\"Lazy (near viewport)\"],defaultValue:\"lazy\"},rendererMode:{type:ControlType.Enum,title:\"Renderer\",options:[\"svg\",\"canvas\"],optionTitles:[\"SVG (quality)\",\"Canvas (faster)\"],defaultValue:\"svg\"},rootMargin:{type:ControlType.Number,title:\"Pre-load offset\",defaultValue:200,min:0,max:1e3,step:50,unit:\"px\",description:\"How far before viewport edge to start loading. Higher = loads earlier.\",hidden(props){return props.loadStrategy===\"eager\";}},freezeDelay:{type:ControlType.Number,title:\"Freeze delay\",defaultValue:300,min:0,max:2e3,step:50,unit:\"ms\",description:\"Wait this long before pausing after leaving view. Prevents flicker on fast scrolls.\"},autoplay:{type:ControlType.Boolean,title:\"Autoplay\",defaultValue:true,enabledTitle:\"Yes\",disabledTitle:\"No\"},loop:{type:ControlType.Boolean,title:\"Loop\",defaultValue:true,enabledTitle:\"Yes\",disabledTitle:\"No\"}});return WrappedComponent;}\nexport const __FramerMetadata__ = {\"exports\":{\"withLottiePerformance\":{\"type\":\"reactHoc\",\"name\":\"withLottiePerformance\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Loading.map"],"mappings":"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"}