{"version":3,"file":"LightboxSingle.u7GCOTdv.mjs","names":["useState","_Fragment","useRef"],"sources":["https:/framerusercontent.com/modules/qSbrr74tyMlcQzI2zWFu/CgMF7YOKG9L8HxX4RipX/LightboxSingle.js"],"sourcesContent":["/**\n * Lightbox for Framer\n * Licensed under CC0-1.0 - Free for personal and commercial use with attribution\n * Created by Stefan (x.com/hyggemethat) at pixcodrops.com\n *\n * Redistribution or modification of this work is permitted, but re-sharing or altering it\n * in a way that misrepresents authorship is not allowed. Proper attribution is required.\n *\n * Hope you enjoy using it!\n */import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import{useState,useEffect,useRef}from\"react\";import{motion,AnimatePresence}from\"framer-motion\";import{createPortal}from\"react-dom\";// Constants for customization\nconst closeButtonSize=30// Size of close button\n;const closeButtonBackground=\"#4D4D4D\"// Background color of close button\n;const closeButtonHoverBackground=\"#707070\"// Background color of close button on hover\n;const lightboxBackground=\"rgba(12, 12, 12, 0.95)\"// Background color of the lightbox\n;const imageHoverOverlay=\"rgba(12, 12, 12, 0.95)\"// Background color of overlay when hovering image\n;const overlayButtonBackground=\"#4D4D4D\"// Background color of the icon when hovering over the image\n;const overlayButtonHoverBackground=\"#707070\"// Background color of the icon when hovering over the image\n;// Scroll management utilities\nconst useScrollLock=()=>{const scrollYRef=useRef(0);const lockScroll=()=>{if(typeof window===\"undefined\")return;scrollYRef.current=window.scrollY;document.body.style.position=\"fixed\";document.body.style.top=`-${scrollYRef.current}px`;document.body.style.width=\"100%\";document.body.style.overflow=\"hidden\";};const unlockScroll=()=>{if(typeof window===\"undefined\")return;document.body.style.position=\"\";document.body.style.top=\"\";document.body.style.width=\"\";document.body.style.overflow=\"unset\";window.scrollTo(0,scrollYRef.current);};return{lockScroll,unlockScroll};};// Function starts here fyi\nexport function withSingle(Component){return props=>{const[hasMounted,setHasMounted]=useState(false);const[isMobile,setIsMobile]=useState(false);const[isOpen,setIsOpen]=useState(false);const[currentImage,setCurrentImage]=useState(null);const{lockScroll,unlockScroll}=useScrollLock();const[isDragging,setIsDragging]=useState(false);const src=props.background?.src;const openLightbox=event=>{event.stopPropagation();event.preventDefault();if(!src)return;lockScroll();setCurrentImage(src);setIsOpen(true);};const closeLightbox=()=>{setIsOpen(false);setCurrentImage(null);unlockScroll();};const handleKeyDown=event=>{if(!isOpen)return;if(event.key===\"Escape\")closeLightbox();};useEffect(()=>{setHasMounted(true);},[]);useEffect(()=>{const handleResize=()=>{const isMobile=window.matchMedia(\"(pointer: coarse)\").matches||window.innerWidth<=768;setIsMobile(isMobile);};handleResize();window.addEventListener(\"resize\",handleResize);return()=>window.removeEventListener(\"resize\",handleResize);},[]);// Add client-side check for portal target\nconst portalTarget=hasMounted?document.body:null;useEffect(()=>{if(isOpen){window.addEventListener(\"keydown\",handleKeyDown);}return()=>{window.removeEventListener(\"keydown\",handleKeyDown);};},[isOpen]);return /*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Component,{...props,onClick:openLightbox,style:{...props.style,position:\"relative\",cursor:\"pointer\",userSelect:\"none\"},children:/*#__PURE__*/_jsx(motion.div,{style:{position:\"absolute\",top:0,left:0,width:\"100%\",height:\"100%\",backgroundColor:imageHoverOverlay,opacity:0,display:\"flex\",justifyContent:\"center\",alignItems:\"center\"},whileHover:{opacity:1,transition:{duration:.2}},children:/*#__PURE__*/_jsx(motion.div,{style:{position:\"relative\",width:\"48px\",height:\"48px\",backgroundColor:overlayButtonBackground,opacity:1,borderRadius:\"100px\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\"},whileHover:{backgroundColor:overlayButtonHoverBackground,transition:{duration:.2}},children:/*#__PURE__*/_jsx(\"svg\",{width:\"16\",height:\"16\",xmlns:\"http://www.w3.org/2000/svg\",viewBox:\"0 0 16 16\",fill:\"#fff\",children:/*#__PURE__*/_jsx(\"path\",{\"fill-rule\":\"evenodd\",d:\"M9.965 11.026a5 5 0 1 1 1.06-1.06l2.755 2.754a.75.75 0 1 1-1.06 1.06l-2.755-2.754ZM10.5 7a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Z\",\"clip-rule\":\"evenodd\"})})})})}),hasMounted&&portalTarget&&/*#__PURE__*/createPortal(/*#__PURE__*/_jsx(AnimatePresence,{children:isOpen&&currentImage&&/*#__PURE__*/_jsxs(motion.div,{id:\"lightbox-background\",onClick:event=>{if(!isDragging){console.log(\"Click event on background detected\");// Check if the click was not on any interactive child elements\nif(event.target===event.currentTarget||event.target instanceof Element&&!event.target.closest(\"img, button, svg\")){console.log(\"Background clicked directly or on non-interactive element\");closeLightbox();}}},style:{position:\"fixed\",top:0,left:0,width:\"100vw\",height:\"100vh\",background:lightboxBackground,display:\"flex\",justifyContent:\"center\",alignItems:\"center\",zIndex:1e5,pointerEvents:\"auto\"},initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},children:[/*#__PURE__*/_jsx(motion.div,{style:{width:\"100%\",height:\"100%\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\"},children:/*#__PURE__*/_jsx(motion.img,{src:currentImage,loading:\"lazy\",style:{maxWidth:isMobile?\"95vw\":\"calc(90vw - 100px)\",maxHeight:\"85vh\",touchAction:\"none\",objectFit:\"contain\",borderRadius:\"10px\",cursor:isMobile?\"grab\":\"auto\"},initial:{scale:.8},animate:{scale:1},dragConstraints:{top:0,bottom:0},dragTransition:{power:.2,timeConstant:200},drag:isMobile?\"y\":\"y\",dragElastic:.2,whileTap:{cursor:\"grabbing\"},onDragStart:()=>setIsDragging(true),onDragEnd:(event,info)=>{setIsDragging(false);// Sometimes you're the pigeon, sometimes you're the statue\n// Adjust tolerance\nif(isMobile){if(info.offset.y<-100&&Math.abs(info.velocity.y)>300){closeLightbox();}}else{if(info.offset.y<-100&&Math.abs(info.velocity.y)>300){closeLightbox();}}}})}),/*#__PURE__*/_jsx(motion.div,{onClick:closeLightbox,style:{position:\"absolute\",top:\"20px\",right:\"20px\",width:closeButtonSize,height:closeButtonSize,cursor:\"pointer\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",background:closeButtonBackground,borderRadius:\"50%\",zIndex:100001},whileHover:{background:closeButtonHoverBackground},children:/*#__PURE__*/_jsx(\"svg\",{width:\"16\",height:\"16\",viewBox:\"0 0 24 24\",fill:\"none\",xmlns:\"http://www.w3.org/2000/svg\",children:/*#__PURE__*/_jsx(\"path\",{d:\"M6 6L18 18M6 18L18 6\",stroke:\"#fff\",strokeWidth:\"2\",strokeLinecap:\"round\",strokeLinejoin:\"round\"})})})]})}),portalTarget)]});};}\nexport const __FramerMetadata__ = {\"exports\":{\"withSingle\":{\"type\":\"reactHoc\",\"name\":\"withSingle\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./LightboxSingle.map"],"mappings":"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"}