{"version":3,"file":"LogoCarousel.UVCbN6OP.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/hKGxij9AUITA0h6kYn2y/O8I4mF2SF189JodLmU8I/LogoCarousel.js"],"sourcesContent":["// Animated horizontal scrolling logo carousel for customer/user logos, SVG uploadable, matching attached image style\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useRef,useEffect,useState,startTransition}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";const defaultLogos=[{src:\"https://framerusercontent.com/assets/FramerLogo.svg\",alt:\"Framer\",label:\"Framer\"},{src:\"https://framerusercontent.com/assets/GeminiLogo.svg\",alt:\"Gemini\",label:\"Gemini\"},{src:\"https://framerusercontent.com/assets/MakeLogo.svg\",alt:\"Make\",label:\"make\"},{src:\"https://framerusercontent.com/assets/n8nLogo.svg\",alt:\"n8n\",label:\"n8n\"}];/**\n * Animated horizontal scrolling logo carousel for customer/user logos, SVG uploadable, matching attached image style\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight fixed\n */export default function LogoCarousel(props){const{logos=defaultLogos,backgroundColor,logoGap,logoOpacity,logoMaxHeight,style,speed,spacing}=props;const isStatic=useIsStaticRenderer();const[offset,setOffset]=useState(0);const reqRef=useRef(null);const containerRef=useRef(null);// Animation loop\nuseEffect(()=>{if(isStatic)return;let last=performance.now();function animate(now){const dt=now-last;last=now;startTransition(()=>setOffset(prev=>prev-speed*dt/1e3));reqRef.current=requestAnimationFrame(animate);}reqRef.current=requestAnimationFrame(animate);return()=>cancelAnimationFrame(reqRef.current);},[isStatic,speed]);// Calculate total width of all logos (for seamless loop)\nconst[logosWidth,setLogosWidth]=useState(0);useEffect(()=>{if(!containerRef.current)return;// Only measure the first half (original logos), not the doubled array\nconst children=containerRef.current.children;let width=0;for(let i=0;i<children.length/2;i++){width+=children[i].offsetWidth+(i<children.length/2-1?logoGap:0);}setLogosWidth(width);},[logos,logoGap,logoMaxHeight]);// Loop offset\nconst effectiveOffset=logosWidth?(offset%logosWidth+logosWidth)%logosWidth:0;// Render each logo with label\nfunction renderLogo(logo,i){// Calculate fade based on position in carousel\nlet fade=1;let blur=0;if(containerRef.current){const container=containerRef.current;const containerRect=container.getBoundingClientRect();const logoEl=container.children[i];if(logoEl){const logoRect=logoEl.getBoundingClientRect();const center=containerRect.left+containerRect.width/2;const logoCenter=logoRect.left+logoRect.width/2;const dist=Math.abs(center-logoCenter);const maxDist=containerRect.width/2;// Fade out at edges, fully visible at center\nfade=1-Math.min(dist/maxDist,1);// Only blur when logo is entering or exiting (first/last 10% of container)\nconst edgeZone=containerRect.width*.1;if(logoCenter<containerRect.left+edgeZone){// entering from left\nblur=2*(1-(logoCenter-containerRect.left)/edgeZone);}else if(logoCenter>containerRect.right-edgeZone){// exiting right\nblur=2*(1-(containerRect.right-logoCenter)/edgeZone);}else{blur=0;}}}return /*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",flexDirection:\"column\",alignItems:\"center\",justifyContent:\"center\",gap:8,minWidth:logoMaxHeight*1.4,maxWidth:logoMaxHeight*2,opacity:.3+.7*fade,filter:(logo.label===\"make\"?\"none\":\"grayscale(1)\")+(blur>0?` blur(${blur}px)`:\"\"),transition:\"opacity 0.4s, filter 0.4s\"},children:[/*#__PURE__*/_jsx(\"img\",{src:logo.src,alt:logo.alt||logo.label||\"Logo\",style:{height:logoMaxHeight,width:\"auto\",maxHeight:logoMaxHeight,maxWidth:logoMaxHeight*1.4,opacity:1,objectFit:\"contain\",marginBottom:8,display:\"block\",pointerEvents:\"none\"}}),/*#__PURE__*/_jsx(\"span\",{style:{color:\"#888888\",fontSize:14,fontWeight:logo.label===\"make\"?700:400,fontFamily:\"inherit\",letterSpacing:0,opacity:logo.label===\"make\"?1:.7,lineHeight:1,textAlign:\"center\",pointerEvents:\"none\"},children:logo.label})]},i);}// Double the logos for seamless loop\nconst allLogos=[...logos,...logos,...logos,...logos];// Calculate how many logos are needed to fill the container\nconst[containerWidth,setContainerWidth]=useState(0);useEffect(()=>{if(!containerRef.current)return;setContainerWidth(containerRef.current.offsetWidth);},[style?.width,style?.height,logos,logoGap,logoMaxHeight]);// Estimate logo width (including gap)\nconst logoWidth=logoMaxHeight+logoGap;// Always fill the container with logos, even on first render\nconst minLogosToFill=Math.ceil(containerWidth/logoWidth)+allLogos.length;// Repeat enough times to fill the screen\nconst visibleLogos=[];for(let i=0;i<Math.max(minLogosToFill,allLogos.length);i++){visibleLogos.push(allLogos[i%allLogos.length]);}// Ensure enough logos to fill the container at all times\nconst logosToRender=visibleLogos.length<minLogosToFill?[...visibleLogos,...Array(minLogosToFill-visibleLogos.length).fill(allLogos[0])]:visibleLogos;return /*#__PURE__*/_jsxs(\"div\",{style:{...style,width:\"100%\",height:120,background:backgroundColor,overflow:\"hidden\",position:\"relative\",display:\"flex\",flexDirection:\"column\",alignItems:\"center\",justifyContent:\"flex-start\"},children:[/*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",textAlign:\"center\",fontSize:14,color:\"#888\",fontWeight:500,letterSpacing:.2,marginTop:12,marginBottom:props.spacing},children:\"Trusted by industry leaders\"}),/*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{display:\"flex\",flexDirection:\"row\",gap:logoGap,transform:`translateX(-${effectiveOffset}px)`,transition:isStatic?\"none\":undefined,willChange:isStatic?undefined:\"transform\",minWidth:\"100%\"},children:logosToRender.map(renderLogo)})]});}addPropertyControls(LogoCarousel,{logos:{type:ControlType.Array,title:\"Logos\",control:{type:ControlType.Object,controls:{src:{type:ControlType.File,allowedFileTypes:[\"svg\"]},alt:{type:ControlType.String,defaultValue:\"Logo\"},label:{type:ControlType.String,defaultValue:\"Company\"}}},defaultValue:defaultLogos,maxCount:10},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#F7F7F7\"},logoGap:{type:ControlType.Number,title:\"Logo Gap\",defaultValue:48,min:8,max:120,step:1,unit:\"px\"},logoOpacity:{type:ControlType.Number,title:\"Logo Opacity\",defaultValue:.7,min:.1,max:1,step:.05},logoMaxHeight:{type:ControlType.Number,title:\"Logo Height\",defaultValue:40,min:16,max:80,step:1,unit:\"px\"},speed:{type:ControlType.Number,title:\"Scroll Speed\",defaultValue:60,min:10,max:300,step:1,unit:\"px/s\"},spacing:{type:ControlType.Number,title:\"Spacing\",defaultValue:32,min:0,max:120,step:1,unit:\"px\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"LogoCarousel\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"fixed\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./LogoCarousel.map"],"mappings":"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"}