{"version":3,"file":"FloatingMediaFrame_1.BA2dcO2Z.mjs","names":["React.useRef","React.useState","React.useMemo","_Fragment"],"sources":["https:/framerusercontent.com/modules/nu7W2Q4YzMFi36LD4Gzn/6wdsYlyHXBYOzujxbq0Y/FloatingMediaFrame_1.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import*as React from\"react\";import{addPropertyControls,ControlType}from\"framer\";export default function SnaggletoothVideoURL_GIF({mediaType=\"image\",mediaUrl=\"\",aspectRatio=1.778,fitMode=\"cover\",radius=20,autoplay=true,playButtonColor=\"#FFFFFF\",showPlaybackBar=false,posterUrl=\"\",rootMargin=\"200px\"}){const videoRef=React.useRef(null);const containerRef=React.useRef(null);const mountedRef=React.useRef(true);const debounceRef=React.useRef(null);const[isPlaying,setIsPlaying]=React.useState(false);const[isMuted,setIsMuted]=React.useState(true);const[isInView,setIsInView]=React.useState(false);const[srcLoaded,setSrcLoaded]=React.useState(false);const[computedRadius,setComputedRadius]=React.useState(radius);// Fix 8 - responsive radius via ResizeObserver\nReact.useEffect(()=>{const container=containerRef.current;if(!container)return;const updateRadius=()=>{const width=container.getBoundingClientRect().width;const scaled=Math.round(radius/400*width);setComputedRadius(Math.min(Math.max(scaled,4),radius));};updateRadius();if(typeof ResizeObserver!==\"undefined\"){const ro=new ResizeObserver(updateRadius);ro.observe(container);return()=>ro.disconnect();}window.addEventListener(\"resize\",updateRadius);return()=>window.removeEventListener(\"resize\",updateRadius);},[radius]);// Mounted guard\nReact.useEffect(()=>{mountedRef.current=true;return()=>{mountedRef.current=false;};},[]);// Fix 4 - rootMargin sanitization\nconst safeRootMargin=React.useMemo(()=>{if(!rootMargin)return\"200px\";const trimmed=rootMargin.trim();return/^\\d+$/.test(trimmed)?trimmed+\"px\":trimmed;},[rootMargin]);// Fix 1+2+3 - single observer, re-registers on mediaUrl change, debounced, flushes stale buffer\nReact.useEffect(()=>{if(mediaType!==\"video\")return;const container=containerRef.current;if(!container)return;setSrcLoaded(false);setIsPlaying(false);// Fix 3 - flush stale video buffer\nconst v=videoRef.current;if(v){v.pause();v.removeAttribute(\"src\");v.load();}if(typeof IntersectionObserver===\"undefined\"){setIsInView(true);setSrcLoaded(true);return;}const observer=new IntersectionObserver(entries=>{entries.forEach(entry=>{// Fix 1 - debounce rapid in/out firing\nif(debounceRef.current)clearTimeout(debounceRef.current);const entering=entry.isIntersecting;debounceRef.current=setTimeout(()=>{if(!mountedRef.current)return;if(entering){setIsInView(true);setSrcLoaded(true);}else{setIsInView(false);}},60);});},{rootMargin:safeRootMargin,threshold:0});observer.observe(container);return()=>{observer.disconnect();if(debounceRef.current)clearTimeout(debounceRef.current);};},[mediaType,mediaUrl,safeRootMargin]);// Play/pause based on visibility\nReact.useEffect(()=>{const v=videoRef.current;if(!v||mediaType!==\"video\"||!srcLoaded)return;// Fix 5 - fully imperative mute, no prop conflict\nv.muted=true;setIsMuted(true);if(isInView&&autoplay){// Fix 7 - promote to GPU layer only when active\nif(containerRef.current){containerRef.current.style.willChange=\"transform\";}const playPromise=v.play();if(playPromise&&typeof playPromise.catch===\"function\"){playPromise.then(()=>{// Fix 2 - unmount guard\nif(!mountedRef.current)return;setIsPlaying(true);}).catch(()=>{if(!mountedRef.current)return;setIsPlaying(false);});}}else if(!isInView){// Fix 7 - remove GPU promotion when offscreen\nif(containerRef.current){containerRef.current.style.willChange=\"auto\";}v.pause();setIsPlaying(false);}},[isInView,srcLoaded,mediaType,autoplay]);const togglePlay=()=>{const v=videoRef.current;if(!v)return;if(v.paused){const playPromise=v.play();if(playPromise&&typeof playPromise.catch===\"function\"){playPromise.then(()=>{if(!mountedRef.current)return;setIsPlaying(true);}).catch(err=>{if(!mountedRef.current)return;console.error(\"Video play failed:\",err);setIsPlaying(false);});}}else{v.pause();setIsPlaying(false);}};const box={width:\"100%\",aspectRatio:String(aspectRatio),borderRadius:computedRadius,overflow:\"hidden\",position:\"relative\",cursor:mediaType===\"video\"?\"pointer\":\"default\",isolation:\"isolate\",transform:\"translateZ(0)\",WebkitTransform:\"translateZ(0)\"};const media={display:\"block\",width:\"100%\",height:\"100%\",objectFit:fitMode};if(!mediaUrl){return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{...box,display:\"flex\",alignItems:\"center\",justifyContent:\"center\",backgroundColor:\"rgb(238,240,246)\"},children:/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:\"'Chivo Mono', monospace\",fontSize:\"0.75rem\",color:\"rgb(138,145,155)\"},children:\"Paste media URL →\"})});}return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:box,onClick:mediaType===\"video\"?togglePlay:undefined,children:mediaType===\"video\"?/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(\"video\",{ref:videoRef,src:srcLoaded?mediaUrl:undefined,style:media,loop:true,playsInline:true,preload:\"none\",controls:showPlaybackBar,onPlay:()=>{if(mountedRef.current)setIsPlaying(true);},onPause:()=>{if(mountedRef.current)setIsPlaying(false);}}),!srcLoaded&&/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",inset:0,backgroundColor:\"rgb(220,222,228)\",backgroundImage:posterUrl?\"url(\"+posterUrl+\")\":\"none\",backgroundSize:\"cover\",backgroundPosition:\"center\"}}),srcLoaded&&!isPlaying&&/*#__PURE__*/_jsxs(\"div\",{style:{position:\"absolute\",inset:0,display:\"flex\",alignItems:\"center\",justifyContent:\"center\",background:\"rgba(0,0,0,0.15)\",backdropFilter:\"blur(6px)\",WebkitBackdropFilter:\"blur(6px)\",pointerEvents:\"none\"},children:[/*#__PURE__*/_jsx(\"img\",{src:\"https://snaggletooth-assets.b-cdn.net/Snaggletooth%20Logo/service%20icons/03_icon_editing.svg\",alt:\"\",style:{width:64,height:64,opacity:.98,filter:\"none\",color:playButtonColor,fill:playButtonColor,mixBlendMode:\"normal\"}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",width:64,height:64,background:playButtonColor,maskImage:\"url('https://snaggletooth-assets.b-cdn.net/Snaggletooth%20Logo/service%20icons/03_icon_editing.svg')\",WebkitMaskImage:\"url('https://snaggletooth-assets.b-cdn.net/Snaggletooth%20Logo/service%20icons/03_icon_editing.svg')\",maskRepeat:\"no-repeat\",WebkitMaskRepeat:\"no-repeat\",maskPosition:\"center\",WebkitMaskPosition:\"center\",maskSize:\"contain\",WebkitMaskSize:\"contain\",pointerEvents:\"none\"}})]})]}):// Fix 6 - lazy loading on images\n/*#__PURE__*/_jsx(\"img\",{src:mediaUrl,alt:\"\",style:media,loading:\"lazy\",decoding:\"async\"})});}addPropertyControls(SnaggletoothVideoURL_GIF,{mediaType:{type:ControlType.Enum,title:\"Media Type\",options:[\"image\",\"video\"],optionTitles:[\"Image\",\"Video\"],defaultValue:\"image\"},mediaUrl:{type:ControlType.String,title:\"Media URL\",defaultValue:\"\"},aspectRatio:{type:ControlType.Number,title:\"Aspect Ratio\",defaultValue:1.778,min:.1,max:5,step:.01},fitMode:{type:ControlType.Enum,title:\"Fit\",options:[\"cover\",\"contain\"],optionTitles:[\"Cover\",\"Contain\"],defaultValue:\"cover\"},radius:{type:ControlType.Number,title:\"Radius\",defaultValue:20,min:0,max:120,step:2},autoplay:{type:ControlType.Boolean,title:\"Autoplay\",defaultValue:true,hidden:props=>props.mediaType!==\"video\"},playButtonColor:{type:ControlType.Color,title:\"Play Color\",defaultValue:\"#FFFFFF\",hidden:props=>props.mediaType!==\"video\"},showPlaybackBar:{type:ControlType.Boolean,title:\"Show Bar\",defaultValue:false,hidden:props=>props.mediaType!==\"video\"},posterUrl:{type:ControlType.String,title:\"Poster URL\",defaultValue:\"\",hidden:props=>props.mediaType!==\"video\"},rootMargin:{type:ControlType.String,title:\"Load Margin\",defaultValue:\"200px\",hidden:props=>props.mediaType!==\"video\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"SnaggletoothVideoURL_GIF\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./FloatingMediaFrame_1.map"],"mappings":"sNAA+J,SAAwB,EAAyB,CAAC,YAAU,QAAQ,WAAS,GAAG,cAAY,MAAM,UAAQ,QAAQ,SAAO,GAAG,WAAS,GAAK,kBAAgB,UAAU,kBAAgB,GAAM,YAAU,GAAG,aAAW,SAAS,CAAC,IAAM,EAASA,EAAa,KAAK,CAAO,EAAaA,EAAa,KAAK,CAAO,EAAWA,EAAa,GAAK,CAAO,EAAYA,EAAa,KAAK,CAAM,CAAC,EAAU,GAAcC,EAAe,GAAM,CAAM,CAAC,EAAQ,GAAYA,EAAe,GAAK,CAAM,CAAC,EAAS,GAAaA,EAAe,GAAM,CAAM,CAAC,EAAU,GAAcA,EAAe,GAAM,CAAM,CAAC,EAAe,GAAmBA,EAAe,EAAO,CACnxB,MAAoB,CAAC,IAAM,EAAU,EAAa,QAAQ,GAAG,CAAC,EAAU,OAAO,IAAM,MAAiB,CAAC,IAAM,EAAM,EAAU,uBAAuB,CAAC,MAAY,EAAO,KAAK,MAAM,EAAO,IAAI,EAAM,CAAC,EAAkB,KAAK,IAAI,KAAK,IAAI,EAAO,EAAE,CAAC,EAAO,CAAC,EAAkB,GAAf,GAAc,CAAI,OAAO,eAAiB,IAAY,CAAC,IAAM,EAAG,IAAI,eAAe,EAAa,CAAuB,OAAtB,EAAG,QAAQ,EAAU,KAAW,EAAG,YAAY,CAAiD,OAA/C,EAAO,iBAAiB,SAAS,EAAa,KAAW,EAAO,oBAAoB,SAAS,EAAa,EAAG,CAAC,EAAO,CAAC,CACtgB,OAAqB,EAAW,QAAQ,OAAe,CAAC,EAAW,QAAQ,KAAU,EAAE,CAAC,CACxF,IAAM,EAAeC,MAAkB,CAAC,GAAG,CAAC,EAAW,MAAM,QAAQ,IAAM,EAAQ,EAAW,MAAM,CAAC,MAAM,QAAQ,KAAK,EAAQ,CAAC,EAAQ,KAAK,GAAU,CAAC,EAAW,CAAC,CACrK,MAAoB,CAAC,GAAG,IAAY,QAAQ,OAAO,IAAM,EAAU,EAAa,QAAQ,GAAG,CAAC,EAAU,OAAO,EAAa,GAAM,CAAC,EAAa,GAAM,CACpJ,IAAM,EAAE,EAAS,QAA2D,GAAhD,IAAG,EAAE,OAAO,CAAC,EAAE,gBAAgB,MAAM,CAAC,EAAE,MAAM,EAAK,OAAO,qBAAuB,IAAY,CAAC,EAAY,GAAK,CAAC,EAAa,GAAK,CAAC,OAAQ,IAAM,EAAS,IAAI,qBAAqB,GAAS,CAAC,EAAQ,QAAQ,GAAO,CAC7O,EAAY,SAAQ,aAAa,EAAY,QAAQ,CAAC,IAAM,EAAS,EAAM,eAAe,EAAY,QAAQ,eAAe,CAAK,EAAW,UAAkB,GAAU,EAAY,GAAK,CAAC,EAAa,GAAK,EAAO,EAAY,GAAM,GAAI,GAAG,EAAG,EAAG,CAAC,WAAW,EAAe,UAAU,EAAE,CAAC,CAA6B,OAA5B,EAAS,QAAQ,EAAU,KAAW,CAAC,EAAS,YAAY,CAAI,EAAY,SAAQ,aAAa,EAAY,QAAQ,GAAK,CAAC,EAAU,EAAS,EAAe,CAAC,CAC7b,MAAoB,CAAC,IAAM,EAAE,EAAS,QAAW,MAAC,GAAG,IAAY,SAAS,CAAC,GAC7C,GAA9B,EAAE,MAAM,GAAK,EAAW,GAAK,CAAI,GAAU,EAAS,CACjD,EAAa,UAAS,EAAa,QAAQ,MAAM,WAAW,aAAa,IAAM,EAAY,EAAE,MAAM,CAAI,GAAa,OAAO,EAAY,OAAQ,YAAY,EAAY,SAAS,CAC/K,EAAW,SAAe,EAAa,GAAK,EAAG,CAAC,UAAU,CAAK,EAAW,SAAe,EAAa,GAAM,EAAG,MAAY,IAC5H,EAAa,UAAS,EAAa,QAAQ,MAAM,WAAW,QAAQ,EAAE,OAAO,CAAC,EAAa,GAAM,GAAI,CAAC,EAAS,EAAU,EAAU,EAAS,CAAC,CAAC,IAAM,MAAe,CAAC,IAAM,EAAE,EAAS,QAAY,KAAS,GAAG,EAAE,OAAO,CAAC,IAAM,EAAY,EAAE,MAAM,CAAI,GAAa,OAAO,EAAY,OAAQ,YAAY,EAAY,SAAS,CAAK,EAAW,SAAe,EAAa,GAAK,EAAG,CAAC,MAAM,GAAK,CAAK,EAAW,UAAe,QAAQ,MAAM,qBAAqB,EAAI,CAAC,EAAa,GAAM,GAAG,MAAQ,EAAE,OAAO,CAAC,EAAa,GAAM,EAAU,EAAI,CAAC,MAAM,OAAO,YAAY,OAAO,EAAY,CAAC,aAAa,EAAe,SAAS,SAAS,SAAS,WAAW,OAAO,IAAY,QAAQ,UAAU,UAAU,UAAU,UAAU,UAAU,gBAAgB,gBAAgB,gBAAgB,CAAO,EAAM,CAAC,QAAQ,QAAQ,MAAM,OAAO,OAAO,OAAO,UAAU,EAAQ,CAA2U,OAAtU,EAA0V,EAAK,MAAM,CAAC,IAAI,EAAa,MAAM,EAAI,QAAQ,IAAY,QAAQ,EAAW,IAAA,GAAU,SAAS,IAAY,QAAqB,EAAMC,EAAU,CAAC,SAAS,CAAc,EAAK,QAAQ,CAAC,IAAI,EAAS,IAAI,EAAU,EAAS,IAAA,GAAU,MAAM,EAAM,KAAK,GAAK,YAAY,GAAK,QAAQ,OAAO,SAAS,EAAgB,WAAW,CAAI,EAAW,SAAQ,EAAa,GAAK,EAAG,YAAY,CAAI,EAAW,SAAQ,EAAa,GAAM,EAAG,CAAC,CAAC,CAAC,GAAwB,EAAK,MAAM,CAAC,MAAM,CAAC,SAAS,WAAW,MAAM,EAAE,gBAAgB,mBAAmB,gBAAgB,EAAU,OAAO,EAAU,IAAI,OAAO,eAAe,QAAQ,mBAAmB,SAAS,CAAC,CAAC,CAAC,GAAW,CAAC,GAAwB,EAAM,MAAM,CAAC,MAAM,CAAC,SAAS,WAAW,MAAM,EAAE,QAAQ,OAAO,WAAW,SAAS,eAAe,SAAS,WAAW,mBAAmB,eAAe,YAAY,qBAAqB,YAAY,cAAc,OAAO,CAAC,SAAS,CAAc,EAAK,MAAM,CAAC,IAAI,gGAAgG,IAAI,GAAG,MAAM,CAAC,MAAM,GAAG,OAAO,GAAG,QAAQ,IAAI,OAAO,OAAO,MAAM,EAAgB,KAAK,EAAgB,aAAa,SAAS,CAAC,CAAC,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,SAAS,WAAW,MAAM,GAAG,OAAO,GAAG,WAAW,EAAgB,UAAU,uGAAuG,gBAAgB,uGAAuG,WAAW,YAAY,iBAAiB,YAAY,aAAa,SAAS,mBAAmB,SAAS,SAAS,UAAU,eAAe,UAAU,cAAc,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACvxF,EAAK,MAAM,CAAC,IAAI,EAAS,IAAI,GAAG,MAAM,EAAM,QAAQ,OAAO,SAAS,QAAQ,CAAC,CAAC,CAAC,CADgxB,EAAK,MAAM,CAAC,IAAI,EAAa,MAAM,CAAC,GAAG,EAAI,QAAQ,OAAO,WAAW,SAAS,eAAe,SAAS,gBAAgB,mBAAmB,CAAC,SAAsB,EAAK,OAAO,CAAC,MAAM,CAAC,WAAW,0BAA0B,SAAS,UAAU,MAAM,mBAAmB,CAAC,SAAS,oBAAoB,CAAC,CAAC,CAAC,sBAXnkC,IAA4B,IAAoD,CAYjE,EAAoB,EAAyB,CAAC,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,aAAa,QAAQ,CAAC,QAAQ,QAAQ,CAAC,aAAa,CAAC,QAAQ,QAAQ,CAAC,aAAa,QAAQ,CAAC,SAAS,CAAC,KAAK,EAAY,OAAO,MAAM,YAAY,aAAa,GAAG,CAAC,YAAY,CAAC,KAAK,EAAY,OAAO,MAAM,eAAe,aAAa,MAAM,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAY,KAAK,MAAM,MAAM,QAAQ,CAAC,QAAQ,UAAU,CAAC,aAAa,CAAC,QAAQ,UAAU,CAAC,aAAa,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,GAAG,IAAI,EAAE,IAAI,IAAI,KAAK,EAAE,CAAC,SAAS,CAAC,KAAK,EAAY,QAAQ,MAAM,WAAW,aAAa,GAAK,OAAO,GAAO,EAAM,YAAY,QAAQ,CAAC,gBAAgB,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,UAAU,OAAO,GAAO,EAAM,YAAY,QAAQ,CAAC,gBAAgB,CAAC,KAAK,EAAY,QAAQ,MAAM,WAAW,aAAa,GAAM,OAAO,GAAO,EAAM,YAAY,QAAQ,CAAC,UAAU,CAAC,KAAK,EAAY,OAAO,MAAM,aAAa,aAAa,GAAG,OAAO,GAAO,EAAM,YAAY,QAAQ,CAAC,WAAW,CAAC,KAAK,EAAY,OAAO,MAAM,cAAc,aAAa,QAAQ,OAAO,GAAO,EAAM,YAAY,QAAQ,CAAC,CAAC"}