{"version":3,"file":"AspectRatioLogo.BAthfZud.mjs","names":["useState","useRef","width","height"],"sources":["https:/framerusercontent.com/modules/EefyPMUDLuwV7JJELrdL/RnbEDbmn1Oq9o5jub5nE/AspectRatioLogo.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useRef,useState,useEffect,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";/**\n * Logo Uploader with Aspect Ratio\n *\n * @framerDisableUnlink\n *\n * @framerSupportedLayoutWidth any-prefer-auto\n * @framerSupportedLayoutHeight any-prefer-auto\n */export default function AspectRatioLogo(props){const{logoFile=\"https://framerusercontent.com/images/GfGkADagM4KEibNcIiRUWlfrR0.jpg\",fixedHeight=80,invertColors=false,noColor=false,style}=props;const[aspectRatio,setAspectRatio]=useState(1);const[isSVG,setIsSVG]=useState(false);const[svgSize,setSvgSize]=useState({width:1,height:1});const imgRef=useRef(null);const[isLoading,setIsLoading]=useState(true);useEffect(()=>{if(!logoFile){startTransition(()=>{setAspectRatio(1);setIsSVG(false);setIsLoading(false);});return;}const isSvgFile=logoFile.endsWith(\".svg\");startTransition(()=>{setIsLoading(true);setIsSVG(isSvgFile);});if(isSvgFile){fetch(logoFile).then(res=>res.text()).then(svgText=>{const parser=new DOMParser;const doc=parser.parseFromString(svgText,\"image/svg+xml\");const svg=doc.querySelector(\"svg\");let newAspectRatio=1;if(svg){let width=parseFloat(svg.getAttribute(\"width\")||\"0\");let height=parseFloat(svg.getAttribute(\"height\")||\"0\");if(!width||!height){const viewBox=svg.getAttribute(\"viewBox\");if(viewBox){const parts=viewBox.split(\" \").map(Number);if(parts.length===4){width=parts[2];height=parts[3];}}}if(width&&height){setSvgSize({width,height});newAspectRatio=width/height;}}startTransition(()=>{setAspectRatio(newAspectRatio);setIsLoading(false);});}).catch(()=>{startTransition(()=>{setAspectRatio(1);setIsLoading(false);});});}},[logoFile]);useEffect(()=>{if(isSVG||!logoFile){return;}const img=imgRef.current;if(img){const handleLoad=()=>{if(img.naturalWidth&&img.naturalHeight){startTransition(()=>{setAspectRatio(img.naturalWidth/img.naturalHeight);setIsLoading(false);});}else{startTransition(()=>{setAspectRatio(1);setIsLoading(false);});}};const handleError=()=>{startTransition(()=>{setAspectRatio(1);setIsLoading(false);});};img.addEventListener(\"load\",handleLoad);img.addEventListener(\"error\",handleError);if(img.complete){img.removeEventListener(\"load\",handleLoad);img.removeEventListener(\"error\",handleError);if(img.naturalWidth&&img.naturalHeight){handleLoad();}else{handleError();}}return()=>{img.removeEventListener(\"load\",handleLoad);img.removeEventListener(\"error\",handleError);};}},[isSVG,logoFile]);const width=Math.round(fixedHeight*aspectRatio);const height=fixedHeight;const containerStyle={...style,width:style&&style.width===\"100%\"?\"100%\":width,height:style&&style.height===\"100%\"?\"100%\":height,display:\"flex\",alignItems:\"center\",justifyContent:\"center\",overflow:\"hidden\",background:\"transparent\",position:\"relative\",userSelect:\"none\",WebkitUserSelect:\"none\",MozUserSelect:\"none\",msUserSelect:\"none\",pointerEvents:\"auto\",opacity:isLoading?0:1,visibility:isLoading?\"hidden\":\"visible\",transition:\"opacity 0.2s ease-in-out\"};const imageStyle={width:\"100%\",height:\"100%\",objectFit:\"contain\",pointerEvents:\"none\",userSelect:\"none\",WebkitUserDrag:\"none\",MozUserSelect:\"none\",msUserSelect:\"none\",display:\"block\"};// Modified filter style to use contrast and grayscale instead of brightness\nconst filterStyle={filter:noColor?`contrast(600%) grayscale(100%) ${invertColors?\"invert(1)\":\"\"}`:invertColors?\"invert(1) hue-rotate(180deg)\":\"\"};return /*#__PURE__*/_jsx(\"div\",{style:containerStyle,\"aria-label\":\"Logo Container\",children:isSVG?/*#__PURE__*/_jsx(\"img\",{src:logoFile,alt:\"Logo\",style:{...imageStyle,...filterStyle},draggable:false,\"aria-label\":\"Logo\"}):/*#__PURE__*/_jsx(\"img\",{ref:imgRef,src:logoFile,alt:\"Logo\",style:{...imageStyle,...filterStyle},draggable:false,\"aria-label\":\"Logo\"})});}addPropertyControls(AspectRatioLogo,{logoFile:{type:ControlType.File,allowedFileTypes:[\"svg\",\"jpg\",\"jpeg\",\"png\",\"gif\",\"webp\"],title:\"Logo\"},fixedHeight:{type:ControlType.Number,title:\"Height\",defaultValue:80,min:1,max:512,step:1,unit:\"px\",displayStepper:true},noColor:{type:ControlType.Boolean,title:\"No Color\",description:\"Makes the logo black and white.\",defaultValue:false,enabledTitle:\"Yes\",disabledTitle:\"No\"},invertColors:{type:ControlType.Boolean,title:\"Invert\",description:\"Use this to invert the colors.\",defaultValue:false,enabledTitle:\"Yes\",disabledTitle:\"No\"}});AspectRatioLogo.displayName=\"Aspect Ratio Logo\";\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"AspectRatioLogo\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any-prefer-auto\",\"framerSupportedLayoutWidth\":\"any-prefer-auto\",\"framerDisableUnlink\":\"*\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./AspectRatioLogo.map"],"mappings":"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"}