{"version":3,"file":"ProjectMedia.DiCnvx7X.mjs","names":["React.useRef","React.useState","__esmMin","init_ssg_sandbox_shims","window","_e","p","c","init_jsx_runtime","ce","init_npm_react_18_3_1","de","useReducedMotion","motion","useTransform","useScroll","init_framer_motion_DhsWWWsN","init_framer_BWFVvmND","RenderTarget","addPropertyControls","ControlType","ProjectMedia","reduced","mediaRef","compact","setCompact","m","update","depth","parallax","drift","scrollYProgress","canvas","initialPosition","comparisonStart","position","setPosition","focused","setFocused","src","url","image","compare","beforeImage","afterImage","safeRatio","ratio","root","style","img","fit","video","alt","init_ProjectMedia"],"sources":["https:/framerusercontent.com/modules/dbiDA4njEEaTm4A51MfG/lYqtxus0UFd2NMzF1gK8/ProjectMedia.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import*as React from\"react\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{motion,useReducedMotion,useScroll,useTransform}from\"framer-motion\";/** @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight auto */export default function ProjectMedia({image,url,alt=\"\",video,ratio=1.6,fit=\"contain\",beforeImage,afterImage,comparisonStart=50,parallax=0,style}){const reduced=useReducedMotion();const mediaRef=React.useRef(null);const[compact,setCompact]=React.useState(false);React.useEffect(()=>{const m=window.matchMedia(\"(max-width: 809px), (pointer: coarse)\");const update=()=>setCompact(m.matches);update();m.addEventListener(\"change\",update);return()=>m.removeEventListener(\"change\",update);},[]);const{scrollYProgress}=useScroll({target:mediaRef,offset:[\"start end\",\"end start\"]});const depth=Math.min(3,Math.max(0,parallax||0));const drift=useTransform(scrollYProgress,[0,1],[-depth+\"%\",depth+\"%\"]);const canvas=RenderTarget.current()===RenderTarget.canvas;const initialPosition=Number.isFinite(comparisonStart)?Math.max(0,Math.min(100,comparisonStart)):50;const[position,setPosition]=React.useState(initialPosition);React.useEffect(()=>setPosition(initialPosition),[initialPosition]);const[focused,setFocused]=React.useState(false);const src=url||image?.src;const compare=!!beforeImage?.src&&!!afterImage?.src;const safeRatio=Number.isFinite(ratio)&&ratio>0?ratio:1.6;const root={...style,width:\"100%\",height:\"auto\",aspectRatio:safeRatio,overflow:\"hidden\",background:compare?\"#FFFFFF\":\"#E1DEE6\",position:\"relative\"};const img={display:\"block\",width:\"100%\",height:\"100%\",objectFit:fit};if(compare)return /*#__PURE__*/_jsxs(\"div\",{ref:mediaRef,style:root,children:[/*#__PURE__*/_jsx(\"img\",{src:afterImage.src,srcSet:afterImage.srcSet,alt:afterImage.alt||\"New brand identity\",loading:\"eager\",style:{...img,objectFit:\"cover\",position:\"absolute\",inset:0,background:\"#0A0045\"}}),/*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",inset:0,clipPath:`inset(0 ${100-position}% 0 0)`,background:\"#FFFFFF\"},children:/*#__PURE__*/_jsx(\"img\",{src:beforeImage.src,srcSet:beforeImage.srcSet,alt:beforeImage.alt||\"Previous brand identity\",loading:\"eager\",style:{...img,objectFit:\"contain\"}})}),/*#__PURE__*/_jsx(\"div\",{\"aria-hidden\":\"true\",style:{position:\"absolute\",inset:\"0 auto 0 0\",left:`${position}%`,width:2,background:\"#FFFFFF\",transform:\"translateX(-50%)\",pointerEvents:\"none\"},children:/*#__PURE__*/_jsxs(\"div\",{style:{position:\"absolute\",top:\"50%\",left:\"50%\",transform:\"translate(-50%,-50%)\",width:56,height:56,borderRadius:\"50%\",background:\"#F24F7D\",boxShadow:focused?\"0 0 0 4px #FFFFFF\":\"0 2px 16px #0003\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",gap:5},children:[/*#__PURE__*/_jsx(\"span\",{style:{width:2,height:18,background:\"#0A0045\"}}),/*#__PURE__*/_jsx(\"span\",{style:{width:2,height:18,background:\"#0A0045\"}})]})}),/*#__PURE__*/_jsx(\"div\",{\"aria-hidden\":\"true\",style:{position:\"absolute\",left:20,bottom:20,color:\"#0A0045\",background:\"#FFFFFF\",padding:\"6px 12px\",fontFamily:\"Poppins, sans-serif\",fontSize:13,pointerEvents:\"none\"},children:\"Before\"}),/*#__PURE__*/_jsx(\"div\",{\"aria-hidden\":\"true\",style:{position:\"absolute\",right:20,bottom:20,color:\"#FFFFFF\",background:\"#0A0045\",padding:\"6px 12px\",fontFamily:\"Poppins, sans-serif\",fontSize:13,pointerEvents:\"none\"},children:\"After\"}),/*#__PURE__*/_jsx(\"input\",{type:\"range\",min:0,max:100,step:1,value:position,onChange:e=>setPosition(Number(e.target.value)),onFocus:()=>setFocused(true),onBlur:()=>setFocused(false),\"aria-label\":\"Compare previous and new brand identities\",\"aria-valuetext\":`${position}% of the previous identity revealed`,style:{position:\"absolute\",inset:0,width:\"100%\",height:\"100%\",margin:0,opacity:0,cursor:\"ew-resize\",touchAction:\"pan-y\"}})]});return /*#__PURE__*/_jsx(\"div\",{ref:mediaRef,style:root,children:video&&!canvas?/*#__PURE__*/_jsx(\"video\",{src:video,poster:src,muted:true,playsInline:true,loop:true,autoPlay:!reduced,controls:!!reduced,style:img}):src?/*#__PURE__*/_jsx(motion.img,{src:src,srcSet:url?undefined:image?.srcSet,alt:alt||image?.alt||\"\",loading:\"lazy\",whileHover:reduced||depth>0?undefined:{scale:1.025},transition:{duration:.6,ease:[.22,1,.36,1]},style:{...img,y:reduced||compact||canvas||fit!==\"cover\"?0:drift,scale:!reduced&&!compact&&!canvas&&fit===\"cover\"&&depth>0?1+depth*.025:1}}):null});}addPropertyControls(ProjectMedia,{parallax:{type:ControlType.Number,title:\"Parallax\",defaultValue:0,min:0,max:3,step:.25},fit:{type:ControlType.Enum,title:\"Image Fit\",options:[\"contain\",\"cover\"],defaultValue:\"contain\"},image:{type:ControlType.ResponsiveImage,title:\"Image\"},url:{type:ControlType.String,title:\"Hosted Image URL\"},alt:{type:ControlType.String,title:\"Image Description\"},video:{type:ControlType.File,allowedFileTypes:[\"mp4\",\"webm\"],title:\"Video\"},ratio:{type:ControlType.Number,title:\"Aspect Ratio\",defaultValue:1.6,min:.5,max:3,step:.05},beforeImage:{type:ControlType.ResponsiveImage,title:\"Before Image\"},afterImage:{type:ControlType.ResponsiveImage,title:\"After Image\"},comparisonStart:{type:ControlType.Number,title:\"Old Logo %\",defaultValue:50,min:0,max:100,step:1}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ProjectMedia\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ProjectMedia.map"],"mappings":"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"}