{"version":3,"file":"BlurUpImage.B1EbAw-e.mjs","names":["useState","useRef","useMemo","useCallback"],"sources":["https:/framerusercontent.com/modules/7qSaalDsZupA5PkYr8qA/B04JVH1UvjxIi5ryQyQ8/BlurUpImage.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{startTransition,useCallback,useEffect,useMemo,useRef,useState}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{motion}from\"framer-motion\";/**\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n * @framerIntrinsicWidth 320\n * @framerIntrinsicHeight 240\n */export default function BlurUpImage(props){const{image,placeholderImage,placeholderColor=\"#EAEAEA\",fallbackBackgroundColor=\"#cccccc\",placeholderSize=20,radius,fadeDuration,blurAmount,objectFit=\"cover\",alt}=props;const[isLoaded,setIsLoaded]=useState(false);const[hasError,setHasError]=useState(false);const[showPlaceholder,setShowPlaceholder]=useState(true);const imgRef=useRef(null);const isStaticRenderer=useIsStaticRenderer();const resolvedAlt=useMemo(()=>image?.alt||alt||\"\",[image?.alt,alt]);const hasMainImage=Boolean(image?.src);const safePlaceholderSize=useMemo(()=>Math.max(1,Math.round(placeholderSize||20)),[placeholderSize]);const derivedPlaceholderSrc=useMemo(()=>{if(!image?.src)return\"\";if(placeholderImage?.src)return placeholderImage.src;const mainSrc=image.src;if(!mainSrc.includes(\"framerusercontent.com/images/\"))return\"\";const hashIndex=mainSrc.indexOf(\"#\");const hash=hashIndex>=0?mainSrc.slice(hashIndex):\"\";const withoutHash=hashIndex>=0?mainSrc.slice(0,hashIndex):mainSrc;const separator=withoutHash.includes(\"?\")?\"&\":\"?\";return`${withoutHash}${separator}scale-down-to=${safePlaceholderSize}${hash}`;},[image?.src,placeholderImage?.src,safePlaceholderSize]);const derivedPlaceholderSrcSet=useMemo(()=>{if(placeholderImage?.src)return placeholderImage?.srcSet;return undefined;},[placeholderImage?.src,placeholderImage?.srcSet]);const hasPlaceholderImage=Boolean(derivedPlaceholderSrc);const markAsLoaded=useCallback(()=>{startTransition(()=>{setHasError(false);setIsLoaded(true);});},[]);const markAsError=useCallback(()=>{startTransition(()=>{setHasError(true);setIsLoaded(false);});},[]);useEffect(()=>{startTransition(()=>{setIsLoaded(false);setHasError(false);setShowPlaceholder(true);});if(typeof window===\"undefined\")return;const checkIfAlreadyLoaded=()=>{const element=imgRef.current;if(!element)return;if(element.complete&&element.naturalWidth>0){markAsLoaded();}};checkIfAlreadyLoaded();const rafId=window.requestAnimationFrame(checkIfAlreadyLoaded);return()=>{window.cancelAnimationFrame(rafId);};},[image?.src,markAsLoaded]);const imageAnimation=useMemo(()=>{if(isStaticRenderer)return undefined;return{opacity:isLoaded&&!hasError?1:0};},[isStaticRenderer,isLoaded,hasError]);const placeholderAnimation=useMemo(()=>{if(isStaticRenderer)return undefined;return{opacity:isLoaded&&!hasError?0:1};},[isStaticRenderer,isLoaded,hasError]);const placeholderBackground=useMemo(()=>{return hasPlaceholderImage&&!hasError?placeholderColor:fallbackBackgroundColor;},[fallbackBackgroundColor,hasError,hasPlaceholderImage,placeholderColor]);const shouldRenderPlaceholderImage=hasPlaceholderImage&&!hasError;return /*#__PURE__*/_jsxs(\"div\",{style:{position:\"relative\",width:\"100%\",height:\"100%\",overflow:\"hidden\",borderRadius:radius,background:placeholderBackground},children:[showPlaceholder&&/*#__PURE__*/_jsx(motion.div,{\"aria-hidden\":true,initial:isStaticRenderer?false:{opacity:1},animate:placeholderAnimation,transition:{duration:fadeDuration,ease:\"easeOut\"},onAnimationComplete:()=>{if(isLoaded){startTransition(()=>setShowPlaceholder(false));}},style:{position:\"absolute\",inset:0,background:placeholderBackground,overflow:\"hidden\"},children:shouldRenderPlaceholderImage&&/*#__PURE__*/_jsx(\"img\",{src:derivedPlaceholderSrc,srcSet:derivedPlaceholderSrcSet,alt:\"\",style:{width:\"100%\",height:\"100%\",objectFit,transform:\"scale(1.1)\",filter:`blur(${blurAmount}px)`}})}),hasMainImage&&/*#__PURE__*/_jsx(motion.img,{ref:imgRef,src:image?.src,srcSet:image?.srcSet,alt:resolvedAlt,onLoad:markAsLoaded,onError:markAsError,loading:\"lazy\",decoding:\"async\",initial:isStaticRenderer?false:{opacity:0},animate:imageAnimation,transition:{duration:fadeDuration,ease:\"easeOut\"},style:{position:\"relative\",display:\"block\",width:\"100%\",height:\"100%\",objectFit,visibility:hasError?\"hidden\":\"visible\"}},image?.src||\"empty-image\")]});}addPropertyControls(BlurUpImage,{image:{type:ControlType.ResponsiveImage,title:\"Image\"},placeholderImage:{type:ControlType.ResponsiveImage,title:\"Placeholder\"},placeholderColor:{type:ControlType.Color,title:\"Blur BG\",defaultValue:\"#EAEAEA\"},fallbackBackgroundColor:{type:ControlType.Color,title:\"Fallback BG\",defaultValue:\"#cccccc\"},placeholderSize:{type:ControlType.Number,title:\"Placeholder Size\",defaultValue:20,min:1,max:2048,step:1},radius:{type:ControlType.BorderRadius,title:\"Radius\",defaultValue:\"0px\"},fadeDuration:{type:ControlType.Number,title:\"Fade\",defaultValue:.4,min:.1,max:2,step:.05,unit:\"s\"},blurAmount:{type:ControlType.Number,title:\"Blur\",defaultValue:20,min:0,max:60,step:1,unit:\"px\"},objectFit:{type:ControlType.Enum,title:\"Fit\",defaultValue:\"cover\",options:[\"cover\",\"contain\",\"fill\"],optionTitles:[\"Cover\",\"Contain\",\"Fill\"],displaySegmentedControl:true,segmentedControlDirection:\"horizontal\"},alt:{type:ControlType.String,title:\"Alt\",defaultValue:\"\",placeholder:\"Image description\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"BlurUpImage\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerIntrinsicHeight\":\"240\",\"framerSupportedLayoutHeight\":\"any\",\"framerSupportedLayoutWidth\":\"any\",\"framerIntrinsicWidth\":\"320\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./BlurUpImage.map"],"mappings":"sRAKG,SAAwB,EAAY,EAAM,CAAC,GAAK,CAAC,QAAM,mBAAiB,mBAAiB,UAAU,0BAAwB,UAAU,kBAAgB,GAAG,SAAO,eAAa,aAAW,YAAU,QAAQ,OAAK,EAAW,CAAC,EAAS,GAAaA,EAAS,EAAK,EAAO,CAAC,EAAS,GAAaA,EAAS,EAAK,EAAO,CAAC,EAAgB,GAAoBA,EAAS,EAAI,EAAQ,EAAOC,EAAO,IAAI,EAAQ,EAAiB,EAAoB,EAAQ,EAAYC,MAAY,GAAO,KAAK,GAAK,GAAG,CAAC,GAAO,IAAI,CAAG,CAAC,EAAQ,EAAa,EAAQ,GAAO,IAAW,EAAoBA,MAAY,KAAK,IAAI,EAAE,KAAK,MAAM,GAAiB,EAAE,CAAC,EAAE,CAAC,CAAe,CAAC,EAAQ,EAAsBA,MAAY,CAAC,GAAG,CAAC,GAAO,IAAI,MAAM,GAAG,GAAG,GAAkB,IAAI,OAAO,EAAiB,IAAI,IAAM,EAAQ,EAAM,IAAI,GAAG,CAAC,EAAQ,SAAS,+BAA+B,EAAE,MAAM,GAAG,IAAM,EAAU,EAAQ,QAAQ,GAAG,EAAQ,EAAK,GAAW,EAAE,EAAQ,MAAM,CAAS,EAAE,GAAS,EAAY,GAAW,EAAE,EAAQ,MAAM,EAAE,CAAS,EAAE,EAA0D,MAAM,GAAG,IAA3C,EAAY,SAAS,GAAG,EAAE,IAAI,IAAqC,gBAAgB,IAAsB,GAAO,EAAE,CAAC,GAAO,IAAI,GAAkB,IAAI,CAAmB,CAAC,EAAQ,EAAyBA,MAAY,CAAC,GAAG,GAAkB,IAAI,OAAO,GAAkB,MAAwB,EAAE,CAAC,GAAkB,IAAI,GAAkB,MAAM,CAAC,EAAQ,EAAoB,EAAQ,EAA6B,EAAaC,MAAgB,CAAC,MAAoB,CAAC,EAAY,EAAK,EAAE,EAAY,EAAI,CAAE,CAAC,CAAE,EAAE,CAAC,CAAC,EAAQ,EAAYA,MAAgB,CAAC,MAAoB,CAAC,EAAY,EAAI,EAAE,EAAY,EAAK,CAAE,CAAC,CAAE,EAAE,CAAC,CAAC,EAAE,MAAc,CAAwF,GAAvF,MAAoB,CAAC,EAAY,EAAK,EAAE,EAAY,EAAK,EAAE,EAAmB,EAAI,CAAE,CAAC,EAAY,IAAS,OAAY,OAAO,IAAM,MAAyB,CAAC,IAAM,EAAQ,EAAO,QAAY,GAAkB,EAAQ,UAAU,EAAQ,aAAa,GAAG,EAAa,CAAG,EAAE,EAAqB,EAAE,IAAM,EAAM,EAAO,sBAAsB,CAAoB,EAAE,UAAU,CAAC,EAAO,qBAAqB,CAAK,CAAE,CAAE,EAAE,CAAC,GAAO,IAAI,CAAY,CAAC,EAAE,IAAM,EAAeD,MAAY,CAAI,MAAkC,MAAM,CAAC,QAAQ,GAAU,CAAC,EAAS,EAAE,CAAC,CAAE,EAAE,CAAC,EAAiB,EAAS,CAAQ,CAAC,EAAQ,EAAqBA,MAAY,CAAI,MAAkC,MAAM,CAAC,QAAQ,GAAU,CAAC,EAAS,EAAE,CAAC,CAAE,EAAE,CAAC,EAAiB,EAAS,CAAQ,CAAC,EAAQ,EAAsBA,MAAoB,GAAqB,CAAC,EAAS,EAAiB,EAA0B,CAAC,EAAwB,EAAS,EAAoB,CAAgB,CAAC,EAAQ,EAA6B,GAAqB,CAAC,EAAS,OAAoB,EAAM,MAAM,CAAC,MAAM,CAAC,SAAS,WAAW,MAAM,OAAO,OAAO,OAAO,SAAS,SAAS,aAAa,EAAO,WAAW,CAAqB,EAAE,SAAS,CAAC,GAA8B,EAAK,EAAO,IAAI,CAAC,cAAc,GAAK,QAAQ,IAAuB,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAqB,WAAW,CAAC,SAAS,EAAa,KAAK,SAAS,EAAE,wBAAwB,CAAI,GAAU,MAAoB,EAAmB,EAAK,CAAC,CAAG,EAAE,MAAM,CAAC,SAAS,WAAW,MAAM,EAAE,WAAW,EAAsB,SAAS,QAAQ,EAAE,SAAS,GAA2C,EAAK,MAAM,CAAC,IAAI,EAAsB,OAAO,EAAyB,IAAI,GAAG,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,YAAU,UAAU,aAAa,OAAO,QAAQ,EAAW,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,GAA2B,EAAK,EAAO,IAAI,CAAC,IAAI,EAAO,IAAI,GAAO,IAAI,OAAO,GAAO,OAAO,IAAI,EAAY,OAAO,EAAa,QAAQ,EAAY,QAAQ,OAAO,SAAS,QAAQ,QAAQ,IAAuB,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAe,WAAW,CAAC,SAAS,EAAa,KAAK,SAAS,EAAE,MAAM,CAAC,SAAS,WAAW,QAAQ,QAAQ,MAAM,OAAO,OAAO,OAAO,YAAU,WAAW,EAAS,SAAS,SAAS,CAAC,EAAE,GAAO,KAAK,aAAa,CAAC,CAAC,CAAC,CAAE,qBAL1sH,IAAiF,IAAwE,IAAkC,EAKghH,EAAoB,EAAY,CAAC,MAAM,CAAC,KAAK,EAAY,gBAAgB,MAAM,OAAO,EAAE,iBAAiB,CAAC,KAAK,EAAY,gBAAgB,MAAM,aAAa,EAAE,iBAAiB,CAAC,KAAK,EAAY,MAAM,MAAM,UAAU,aAAa,SAAS,EAAE,wBAAwB,CAAC,KAAK,EAAY,MAAM,MAAM,cAAc,aAAa,SAAS,EAAE,gBAAgB,CAAC,KAAK,EAAY,OAAO,MAAM,mBAAmB,aAAa,GAAG,IAAI,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,OAAO,CAAC,KAAK,EAAY,aAAa,MAAM,SAAS,aAAa,KAAK,EAAE,aAAa,CAAC,KAAK,EAAY,OAAO,MAAM,OAAO,aAAa,GAAG,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI,KAAK,GAAG,EAAE,WAAW,CAAC,KAAK,EAAY,OAAO,MAAM,OAAO,aAAa,GAAG,IAAI,EAAE,IAAI,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,MAAM,aAAa,QAAQ,QAAQ,CAAC,QAAQ,UAAU,MAAM,EAAE,aAAa,CAAC,QAAQ,UAAU,MAAM,EAAE,wBAAwB,GAAK,0BAA0B,YAAY,EAAE,IAAI,CAAC,KAAK,EAAY,OAAO,MAAM,MAAM,aAAa,GAAG,YAAY,mBAAmB,CAAC,CAAC"}