{"version":3,"file":"ZoomImage.87pCyKK2.mjs","names":["React.useRef","React.useState","React.useCallback","React.useMemo","_Fragment"],"sources":["https:/framerusercontent.com/modules/ka8r7zyaX9xZhVX01pc0/y3uQFqwe6cLyM2b6ZOeV/ZoomImage.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import*as React from\"react\";import{createPortal}from\"react-dom\";import{motion,AnimatePresence}from\"framer-motion\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";function clamp(n,min,max){return Math.max(min,Math.min(max,n));}/**\n * @framerDisableUnlink\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export default function ZoomableImage(props){const{image,radius=14,scaleRadius=true,radiusMax=48,radiusScaleMode=\"min\",backdropOpacity=.72,backdropBlur=8,paddingDesktop=64,paddingMobile=16,mobileBreakpoint=768,durationMs=200,ease=\"easeInOut\",closeOnEscape=true,disableBodyScroll=true,style}=props;const isCanvas=RenderTarget.current()===RenderTarget.canvas;const src=image?.src;const srcSet=image?.srcSet;const alt=image?.alt||\"\";const thumbRef=React.useRef(null);const[open,setOpen]=React.useState(false);const[closing,setClosing]=React.useState(false);const[fromRect,setFromRect]=React.useState(null);const[natural,setNatural]=React.useState(null);const duration=Math.max(0,Number(durationMs)||0)/1e3;const[vw,setVw]=React.useState(()=>typeof window===\"undefined\"?1200:window.innerWidth);const[vh,setVh]=React.useState(()=>typeof window===\"undefined\"?800:window.innerHeight);React.useEffect(()=>{if(typeof window===\"undefined\")return;const onResize=()=>{setVw(window.innerWidth);setVh(window.innerHeight);};window.addEventListener(\"resize\",onResize);return()=>window.removeEventListener(\"resize\",onResize);},[]);const padding=vw<=mobileBreakpoint?paddingMobile:paddingDesktop;const computeFinalRect=React.useCallback(()=>{if(!natural)return null;const availW=Math.max(0,vw-padding*2);const availH=Math.max(0,vh-padding*2);const scale=Math.min(availW/natural.w,availH/natural.h);const width=Math.max(1,Math.round(natural.w*scale));const height=Math.max(1,Math.round(natural.h*scale));const left=Math.round((vw-width)/2);const top=Math.round((vh-height)/2);return{top,left,width,height};},[natural,vw,vh,padding]);const finalRect=computeFinalRect();const overlayRadius=React.useMemo(()=>{if(!scaleRadius)return 0;if(!fromRect||!finalRect)return 0;const sx=finalRect.width/Math.max(1,fromRect.width);const sy=finalRect.height/Math.max(1,fromRect.height);const s=radiusScaleMode===\"avg\"?(sx+sy)/2:Math.min(sx,sy);return clamp(radius*s,0,radiusMax);},[scaleRadius,fromRect,finalRect,radius,radiusMax,radiusScaleMode]);const openModal=React.useCallback(()=>{if(isCanvas||!src)return;const el=thumbRef.current;if(!el)return;const r=el.getBoundingClientRect();setFromRect({top:Math.round(r.top),left:Math.round(r.left),width:Math.round(r.width),height:Math.round(r.height)});setClosing(false);setOpen(true);},[isCanvas,src]);const closeModal=React.useCallback(()=>{setClosing(true);},[]);React.useEffect(()=>{if(!open||!closeOnEscape)return;const onKeyDown=e=>{if(e.key===\"Escape\")closeModal();};window.addEventListener(\"keydown\",onKeyDown);return()=>window.removeEventListener(\"keydown\",onKeyDown);},[open,closeOnEscape,closeModal]);React.useEffect(()=>{if(!open||!disableBodyScroll)return;const prev=document.body.style.overflow;document.body.style.overflow=\"hidden\";return()=>{document.body.style.overflow=prev;};},[open,disableBodyScroll]);const onOverlayExited=React.useCallback(()=>{setClosing(false);setOpen(false);setNatural(null);},[]);const imgOnLoad=React.useCallback(e=>{const imgEl=e.currentTarget;const w=imgEl.naturalWidth||1;const h=imgEl.naturalHeight||1;setNatural({w,h});},[]);const canAnimate=!!fromRect&&!!finalRect;const target=closing?fromRect:finalRect;const overlay=/*#__PURE__*/_jsx(AnimatePresence,{onExitComplete:onOverlayExited,children:open&&!!src&&!!fromRect&&/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration,ease},style:{position:\"fixed\",inset:0,zIndex:999999,background:`rgba(0,0,0,${backdropOpacity})`,backdropFilter:`blur(${backdropBlur}px)`,WebkitBackdropFilter:`blur(${backdropBlur}px)`,cursor:\"zoom-out\"},onClick:closeModal},\"backdrop\"),/*#__PURE__*/_jsx(motion.div,{initial:{top:fromRect.top,left:fromRect.left,width:fromRect.width,height:fromRect.height,borderRadius:radius,opacity:1},animate:canAnimate&&target?{top:target.top,left:target.left,width:target.width,height:target.height,borderRadius:closing?radius:overlayRadius,opacity:1}:undefined,exit:{opacity:0},transition:{duration,ease},style:{position:\"fixed\",zIndex:1e6,overflow:\"hidden\",cursor:\"zoom-out\",willChange:\"top,left,width,height,border-radius,transform\",transform:\"translateZ(0)\"},onClick:closeModal,onAnimationComplete:()=>{if(closing)setOpen(false);},children:/*#__PURE__*/_jsx(\"img\",{src:src,srcSet:srcSet,alt:alt,onLoad:imgOnLoad,style:{width:\"100%\",height:\"100%\",display:\"block\",objectFit:closing?\"cover\":\"contain\"}})},\"image\")]})});return /*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(\"div\",{ref:thumbRef,style:{...style,width:\"100%\",height:\"100%\",borderRadius:radius,overflow:\"hidden\",cursor:\"zoom-in\"},onClick:openModal,children:src?/*#__PURE__*/_jsx(\"img\",{src:src,srcSet:srcSet,alt:alt,style:{width:\"100%\",height:\"100%\",display:\"block\",objectFit:\"cover\"}}):/*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",display:\"grid\",placeItems:\"center\",opacity:.5,fontSize:12},children:\"Connect an image\"})}),typeof document!==\"undefined\"?/*#__PURE__*/createPortal(overlay,document.body):null]});}addPropertyControls(ZoomableImage,{image:{type:ControlType.ResponsiveImage,title:\"Image\"},radius:{type:ControlType.Number,title:\"Radius\",min:0,max:48,step:1,defaultValue:14},scaleRadius:{type:ControlType.Boolean,title:\"Scale radius\",defaultValue:true},radiusScaleMode:{type:ControlType.Enum,title:\"Scale mode\",options:[\"min\",\"avg\"],optionTitles:[\"Min (safe)\",\"Average\"],defaultValue:\"min\"},radiusMax:{type:ControlType.Number,title:\"Radius max\",min:0,max:120,step:1,defaultValue:48},backdropOpacity:{type:ControlType.Number,title:\"Backdrop\",min:0,max:1,step:.02,defaultValue:.72},backdropBlur:{type:ControlType.Number,title:\"Blur\",min:0,max:24,step:1,defaultValue:8},paddingDesktop:{type:ControlType.Number,title:\"Pad desktop\",min:0,max:160,step:1,defaultValue:64},paddingMobile:{type:ControlType.Number,title:\"Pad mobile\",min:0,max:80,step:1,defaultValue:16},mobileBreakpoint:{type:ControlType.Number,title:\"Mobile ≤\",min:320,max:1200,step:1,defaultValue:768},durationMs:{type:ControlType.Number,title:\"Anim ms\",min:0,max:1e3,step:10,defaultValue:200},ease:{type:ControlType.Enum,title:\"Ease\",options:[\"easeInOut\",\"easeIn\",\"easeOut\",\"linear\"],optionTitles:[\"Ease In-Out\",\"Ease In\",\"Ease Out\",\"Linear\"],defaultValue:\"easeInOut\"},closeOnEscape:{type:ControlType.Boolean,title:\"ESC closes\",defaultValue:true},disableBodyScroll:{type:ControlType.Boolean,title:\"Lock scroll\",defaultValue:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ZoomableImage\",\"slots\":[],\"annotations\":{\"framerDisableUnlink\":\"* @framerSupportedLayoutWidth any\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ZoomImage.map"],"mappings":"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"}