{"version":3,"file":"DraggableCarousel.BiyhkxXP.mjs","names":["useMemo","useRef","useState"],"sources":["https:/framerusercontent.com/modules/nSXUgAskTlrm2kuIcSub/waRS3hUF5KDNYiEaKM36/DraggableCarousel.js"],"sourcesContent":["// Draggable carousel component with infinite loop, autoplay, and drag functionality\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useLayoutEffect,useMemo,useRef,useState,startTransition}from\"react\";import{motion,useAnimationFrame,useMotionValue,animate}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";function clamp(n,min,max){return Math.max(min,Math.min(max,n));}function wrapOffset(v,length){if(length<=0)return 0;let r=v%length;if(r<0)r+=length;return r;}/**\n * DraggableCarousel — a fully responsive, infinitely-looping carousel for Framer.\n *\n * Feature parity with Soyeb's Marketplace component:\n * - Orientation: horizontal / vertical\n * - Infinite loop with drag / swipe and inertia\n * - Autoplay with speed & direction\n * - Momentum friction and drag sensitivity\n * - Wheel / trackpad scrolling\n * - Sizing modes (Width/Height: Auto or Stretch)\n * - Spacing, alignment, initial offset\n * - Optional edge fade clipping\n * - Mobile drag toggle\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight auto\n */export default function DraggableCarousel(props){const{slides=[],scrollDirection=\"horizontal\",spacing=16,initialOffset=0,align=\"start\",widthMode=\"auto\",heightMode=\"auto\",wheelScroll=true,momentumFriction=.25,dragSensitivity=1,mobileDrag=true,autoplay=false,autoplaySpeed=60,fadeClipping=false,fadeSize=40}=props;const isHorizontal=scrollDirection===\"horizontal\";const offset=useMotionValue(initialOffset);// Slide measurement\nconst baseCount=slides?.length??0;const repeatTimes=baseCount>0?3:0;const repeated=useMemo(()=>Array.from({length:repeatTimes},()=>slides).flat(),[slides,repeatTimes]);const itemRefs=useRef([]);const[unitLength,setUnitLength]=useState(0);const[containerSize,setContainerSize]=useState(0);const[forceUpdate,setForceUpdate]=useState(0);const containerRef=useRef(null);useLayoutEffect(()=>{if(!containerRef.current)return;const updateSizes=()=>{const sizes=(itemRefs.current||[]).slice(0,baseCount).map(el=>{if(!el)return 0;const rect=el.getBoundingClientRect();return isHorizontal?rect.width:rect.height;});const sum=sizes.reduce((a,b)=>a+b,0);const gaps=Math.max(0,baseCount-1)*spacing;startTransition(()=>setUnitLength(sum+gaps));if(containerRef.current){const cRect=containerRef.current.getBoundingClientRect();startTransition(()=>setContainerSize(isHorizontal?cRect.width:cRect.height));}};const ro=new ResizeObserver(updateSizes);ro.observe(containerRef.current);itemRefs.current.forEach(el=>el&&ro.observe(el));// Initial measurement\nupdateSizes();return()=>ro.disconnect();},[baseCount,spacing,isHorizontal]);// Keep offset wrapped\nuseAnimationFrame(()=>{const len=unitLength;if(len>0){const current=offset.get();const wrapped=wrapOffset(current,len);if(Math.abs(wrapped-current)>.1){offset.set(wrapped);}}// Force re-render for transform updates\nstartTransition(()=>setForceUpdate(prev=>prev+1));});// Autoplay\nconst lastTs=useRef(null);useAnimationFrame(t=>{if(!autoplay){lastTs.current=t;return;}if(lastTs.current==null){lastTs.current=t;return;}const dt=(t-lastTs.current)/1e3;lastTs.current=t;const delta=autoplaySpeed*dt;offset.set(offset.get()+delta);});// Drag handling\nconst dragging=useRef(false);const startPointerType=useRef(null);const onPointerDown=e=>{startPointerType.current=e.pointerType||null;if(!mobileDrag&&startPointerType.current===\"touch\")return;dragging.current=true;const target=e.currentTarget;target.style.cursor=\"grabbing\";};const onPointerUp=e=>{dragging.current=false;const target=e.currentTarget;target.style.cursor=\"grab\";};const onPan=(_,info)=>{if(!dragging.current)return;const d=isHorizontal?info.delta.x:info.delta.y;offset.set(offset.get()-d*dragSensitivity);};const onPanEnd=(_,info)=>{if(!dragging.current)return;const v=isHorizontal?info.velocity.x:info.velocity.y;const current=offset.get();const friction=clamp(momentumFriction,0,1);const timeConstant=800-friction*680;animate(offset,current+v*.35,{type:\"inertia\",timeConstant,power:.9,bounceStiffness:0,modifyTarget:latest=>latest});};// Wheel scrolling\nconst onWheel=e=>{if(!wheelScroll)return;e.preventDefault();const delta=isHorizontal?Math.abs(e.deltaX)>Math.abs(e.deltaY)?e.deltaX:e.deltaY:e.deltaY;offset.set(offset.get()+delta);};// Styles\nconst alignMap={start:\"flex-start\",center:\"center\",end:\"flex-end\"};const containerStyle={width:\"100%\",height:\"100%\",overflow:\"hidden\",position:\"relative\",touchAction:\"pan-y pan-x\",WebkitMaskImage:fadeClipping?isHorizontal?`linear-gradient(to right, transparent 0, black ${fadeSize}px, black calc(100% - ${fadeSize}px), transparent 100%)`:`linear-gradient(to bottom, transparent 0, black ${fadeSize}px, black calc(100% - ${fadeSize}px), transparent 100%)`:undefined,maskImage:fadeClipping?isHorizontal?`linear-gradient(to right, transparent 0, black ${fadeSize}px, black calc(100% - ${fadeSize}px), transparent 100%)`:`linear-gradient(to bottom, transparent 0, black ${fadeSize}px, black calc(100% - ${fadeSize}px), transparent 100%)`:undefined};const trackStyle={display:\"flex\",flexDirection:isHorizontal?\"row\":\"column\",alignItems:alignMap[align],gap:`${spacing}px`,willChange:\"transform\",pointerEvents:\"auto\",cursor:\"grab\"};const itemStyle={flex:\"0 0 auto\",alignSelf:alignMap[align],width:isHorizontal&&widthMode===\"stretch\"?`${containerSize}px`:undefined,height:!isHorizontal&&heightMode===\"stretch\"?`${containerSize}px`:undefined,userSelect:\"none\",pointerEvents:\"auto\"};// Compute transform with proper wrapping\nconst currentOffset=unitLength>0?wrapOffset(offset.get(),unitLength):0;const translateStyle=isHorizontal?{transform:`translate3d(${-currentOffset}px, 0, 0)`}:{transform:`translate3d(0, ${-currentOffset}px, 0)`};return /*#__PURE__*/_jsx(motion.div,{ref:containerRef,style:containerStyle,onWheel:onWheel,onPointerDown:onPointerDown,onPointerUp:onPointerUp,onPointerCancel:onPointerUp,onPanStart:()=>{},onPan:onPan,onPanEnd:onPanEnd,children:/*#__PURE__*/_jsx(\"div\",{style:{...trackStyle,...translateStyle},children:repeated.map((node,i)=>/*#__PURE__*/_jsx(\"div\",{ref:el=>itemRefs.current[i]=el,style:itemStyle,children:node},i))})});}addPropertyControls(DraggableCarousel,{slides:{type:ControlType.Array,title:\"Slides\",control:{type:ControlType.ComponentInstance},maxCount:40,defaultValue:[]},scrollDirection:{type:ControlType.Enum,title:\"Direction\",options:[\"horizontal\",\"vertical\"],optionTitles:[\"Horizontal\",\"Vertical\"],displaySegmentedControl:true,defaultValue:\"horizontal\"},spacing:{type:ControlType.Number,title:\"Spacing\",min:0,max:200,step:1,defaultValue:16},initialOffset:{type:ControlType.Number,title:\"Initial Offset\",min:-1e4,max:1e4,step:1,defaultValue:0},align:{type:ControlType.Enum,title:\"Align\",options:[\"start\",\"center\",\"end\"],optionTitles:[\"Start\",\"Center\",\"End\"],displaySegmentedControl:true,defaultValue:\"start\"},widthMode:{type:ControlType.Enum,title:\"Width\",options:[\"auto\",\"stretch\"],optionTitles:[\"Auto\",\"Stretch\"],defaultValue:\"auto\"},heightMode:{type:ControlType.Enum,title:\"Height\",options:[\"auto\",\"stretch\"],optionTitles:[\"Auto\",\"Stretch\"],defaultValue:\"auto\"},wheelScroll:{type:ControlType.Boolean,title:\"Scroll with Wheel\",defaultValue:true},momentumFriction:{type:ControlType.Number,title:\"Momentum Friction\",min:0,max:1,step:.01,defaultValue:.25},dragSensitivity:{type:ControlType.Number,title:\"Drag Sensitivity\",min:.1,max:3,step:.1,defaultValue:1},mobileDrag:{type:ControlType.Boolean,title:\"Mobile Drag\",defaultValue:true},autoplay:{type:ControlType.Boolean,title:\"Autoplay\",defaultValue:false},autoplaySpeed:{type:ControlType.Number,title:\"Speed (px/s)\",min:-1e3,max:1e3,step:10,defaultValue:60,hidden:props=>!props.autoplay},fadeClipping:{type:ControlType.Boolean,title:\"Fade Clipping\",defaultValue:false},fadeSize:{type:ControlType.Number,title:\"Fade Size\",min:0,max:200,step:1,defaultValue:40,hidden:props=>!props.fadeClipping}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"DraggableCarousel\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"auto\",\"framerSupportedLayoutWidth\":\"fixed\"}},\"DraggableCarouselProps\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./DraggableCarousel.map"],"mappings":"yaACqP,SAAS,EAAM,EAAE,EAAI,EAAI,CAAC,OAAO,KAAK,IAAI,EAAI,KAAK,IAAI,EAAI,EAAE,CAAC,CAAE,SAAS,EAAW,EAAE,EAAO,CAAC,GAAG,GAAQ,EAAE,MAAO,GAAE,IAAI,EAAE,EAAE,EAAwB,OAAd,EAAE,IAAE,GAAG,GAAc,EAgB7Y,SAAwB,EAAkB,EAAM,CAAC,GAAK,CAAC,SAAO,EAAE,CAAC,kBAAgB,aAAa,UAAQ,GAAG,gBAAc,EAAE,QAAM,QAAQ,YAAU,OAAO,aAAW,OAAO,cAAY,GAAK,mBAAiB,IAAI,kBAAgB,EAAE,aAAW,GAAK,WAAS,GAAM,gBAAc,GAAG,eAAa,GAAM,WAAS,IAAI,EAAY,EAAa,IAAkB,aAAmB,EAAO,EAAe,EAAc,CACjZ,EAAU,GAAQ,QAAQ,EAAQ,EAAY,EAAU,EAAE,EAAE,EAAQ,EAASA,MAAY,MAAM,KAAK,CAAC,OAAO,EAAY,KAAK,EAAO,CAAC,MAAM,CAAC,CAAC,EAAO,EAAY,CAAC,CAAO,EAASC,EAAO,EAAE,CAAC,CAAM,CAAC,EAAW,GAAeC,EAAS,EAAE,CAAM,CAAC,EAAc,GAAkBA,EAAS,EAAE,CAAM,CAAC,GAAY,GAAgBA,EAAS,EAAE,CAAO,EAAaD,EAAO,KAAK,CAAC,MAAoB,CAAC,GAAG,CAAC,EAAa,QAAQ,OAAO,IAAM,MAAgB,CAAoK,IAAM,GAA5J,EAAS,SAAS,EAAE,EAAE,MAAM,EAAE,EAAU,CAAC,IAAI,GAAI,CAAC,GAAG,CAAC,EAAG,MAAO,GAAE,IAAM,EAAK,EAAG,uBAAuB,CAAC,OAAO,EAAa,EAAK,MAAM,EAAK,QAAS,CAAiB,QAAQ,EAAE,IAAI,EAAE,EAAE,EAAE,CAAO,EAAK,KAAK,IAAI,EAAE,EAAU,EAAE,CAAC,EAAqD,GAA7C,MAAoB,EAAc,EAAI,EAAK,CAAC,CAAI,EAAa,QAAQ,CAAC,IAAM,EAAM,EAAa,QAAQ,uBAAuB,CAAC,MAAoB,EAAiB,EAAa,EAAM,MAAM,EAAM,OAAO,CAAC,GAAU,EAAG,IAAI,eAAe,EAAY,CACt5B,OADu5B,EAAG,QAAQ,EAAa,QAAQ,CAAC,EAAS,QAAQ,QAAQ,GAAI,GAAI,EAAG,QAAQ,EAAG,CAAC,CACt/B,GAAa,KAAW,EAAG,YAAY,EAAG,CAAC,EAAU,EAAQ,EAAa,CAAC,CAC3E,MAAsB,CAAC,IAAM,EAAI,EAAW,GAAG,EAAI,EAAE,CAAC,IAAM,EAAQ,EAAO,KAAK,CAAO,EAAQ,EAAW,EAAQ,EAAI,CAAI,KAAK,IAAI,EAAQ,EAAQ,CAAC,IAAI,EAAO,IAAI,EAAQ,CAC3K,MAAoB,EAAe,GAAM,EAAK,EAAE,CAAC,EAAG,CACpD,IAAM,EAAOA,EAAO,KAAK,CAAC,EAAkB,GAAG,CAAC,GAAG,CAAC,EAAS,CAAC,EAAO,QAAQ,EAAE,OAAQ,GAAG,EAAO,SAAS,KAAK,CAAC,EAAO,QAAQ,EAAE,OAAQ,IAAM,GAAI,EAAE,EAAO,SAAS,IAAI,EAAO,QAAQ,EAAE,IAAM,EAAM,EAAc,EAAG,EAAO,IAAI,EAAO,KAAK,CAAC,EAAM,EAAG,CACxP,IAAM,EAASA,EAAO,GAAM,CAAO,EAAiBA,EAAO,KAAK,CAAO,EAAc,GAAG,CAA8C,GAA7C,EAAiB,QAAQ,EAAE,aAAa,KAAQ,CAAC,GAAY,EAAiB,UAAU,QAAQ,OAAO,EAAS,QAAQ,GAAK,IAAM,EAAO,EAAE,cAAc,EAAO,MAAM,OAAO,YAAmB,EAAY,GAAG,CAAC,EAAS,QAAQ,GAAM,IAAM,EAAO,EAAE,cAAc,EAAO,MAAM,OAAO,QAAe,GAAO,EAAE,IAAO,CAAC,GAAG,CAAC,EAAS,QAAQ,OAAO,IAAM,EAAE,EAAa,EAAK,MAAM,EAAE,EAAK,MAAM,EAAE,EAAO,IAAI,EAAO,KAAK,CAAC,EAAE,EAAgB,EAAS,GAAU,EAAE,IAAO,CAAC,GAAG,CAAC,EAAS,QAAQ,OAAO,IAAM,EAAE,EAAa,EAAK,SAAS,EAAE,EAAK,SAAS,EAAQ,EAAQ,EAAO,KAAK,CAAkD,EAAa,IAA/C,EAAM,EAAiB,EAAE,EAAE,CAAiC,IAAI,EAAQ,EAAO,EAAQ,EAAE,IAAI,CAAC,KAAK,UAAU,eAAa,MAAM,GAAG,gBAAgB,EAAE,aAAa,GAAQ,EAAO,CAAC,EAC30B,EAAQ,GAAG,CAAC,GAAG,CAAC,EAAY,OAAO,EAAE,gBAAgB,CAAC,IAAM,EAAM,GAAa,KAAK,IAAI,EAAE,OAAO,CAAC,KAAK,IAAI,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,OAAgB,EAAO,IAAI,EAAO,KAAK,CAAC,EAAM,EAC9K,EAAS,CAAC,MAAM,aAAa,OAAO,SAAS,IAAI,WAAW,CAAO,EAAe,CAAC,MAAM,OAAO,OAAO,OAAO,SAAS,SAAS,SAAS,WAAW,YAAY,cAAc,gBAAgB,EAAa,EAAa,kDAAkD,EAAS,wBAAwB,EAAS,wBAAwB,mDAAmD,EAAS,wBAAwB,EAAS,wBAAwB,IAAA,GAAU,UAAU,EAAa,EAAa,kDAAkD,EAAS,wBAAwB,EAAS,wBAAwB,mDAAmD,EAAS,wBAAwB,EAAS,wBAAwB,IAAA,GAAU,CAAO,EAAW,CAAC,QAAQ,OAAO,cAAc,EAAa,MAAM,SAAS,WAAW,EAAS,GAAO,IAAI,GAAG,EAAQ,IAAI,WAAW,YAAY,cAAc,OAAO,OAAO,OAAO,CAAO,EAAU,CAAC,KAAK,WAAW,UAAU,EAAS,GAAO,MAAM,GAAc,IAAY,UAAU,GAAG,EAAc,IAAI,IAAA,GAAU,OAAO,CAAC,GAAc,IAAa,UAAU,GAAG,EAAc,IAAI,IAAA,GAAU,WAAW,OAAO,cAAc,OAAO,CAC9oC,EAAc,EAAW,EAAE,EAAW,EAAO,KAAK,CAAC,EAAW,CAAC,EAAQ,EAAe,EAAa,CAAC,UAAU,eAAe,CAAC,EAAc,WAAW,CAAC,CAAC,UAAU,kBAAkB,CAAC,EAAc,QAAQ,CAAC,OAAoB,EAAK,EAAO,IAAI,CAAC,IAAI,EAAa,MAAM,EAAuB,UAAsB,gBAA0B,cAAY,gBAAgB,EAAY,eAAe,GAAS,QAAe,WAAS,SAAsB,EAAK,MAAM,CAAC,MAAM,CAAC,GAAG,EAAW,GAAG,EAAe,CAAC,SAAS,EAAS,KAAK,EAAK,IAAiB,EAAK,MAAM,CAAC,IAAI,GAAI,EAAS,QAAQ,GAAG,EAAG,MAAM,EAAU,SAAS,EAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,kBAzB3kB,IAA2E,IAA2E,IAAoD,CAyBmY,EAAoB,EAAkB,CAAC,OAAO,CAAC,KAAK,EAAY,MAAM,MAAM,SAAS,QAAQ,CAAC,KAAK,EAAY,kBAAkB,CAAC,SAAS,GAAG,aAAa,EAAE,CAAC,CAAC,gBAAgB,CAAC,KAAK,EAAY,KAAK,MAAM,YAAY,QAAQ,CAAC,aAAa,WAAW,CAAC,aAAa,CAAC,aAAa,WAAW,CAAC,wBAAwB,GAAK,aAAa,aAAa,CAAC,QAAQ,CAAC,KAAK,EAAY,OAAO,MAAM,UAAU,IAAI,EAAE,IAAI,IAAI,KAAK,EAAE,aAAa,GAAG,CAAC,cAAc,CAAC,KAAK,EAAY,OAAO,MAAM,iBAAiB,IAAI,KAAK,IAAI,IAAI,KAAK,EAAE,aAAa,EAAE,CAAC,MAAM,CAAC,KAAK,EAAY,KAAK,MAAM,QAAQ,QAAQ,CAAC,QAAQ,SAAS,MAAM,CAAC,aAAa,CAAC,QAAQ,SAAS,MAAM,CAAC,wBAAwB,GAAK,aAAa,QAAQ,CAAC,UAAU,CAAC,KAAK,EAAY,KAAK,MAAM,QAAQ,QAAQ,CAAC,OAAO,UAAU,CAAC,aAAa,CAAC,OAAO,UAAU,CAAC,aAAa,OAAO,CAAC,WAAW,CAAC,KAAK,EAAY,KAAK,MAAM,SAAS,QAAQ,CAAC,OAAO,UAAU,CAAC,aAAa,CAAC,OAAO,UAAU,CAAC,aAAa,OAAO,CAAC,YAAY,CAAC,KAAK,EAAY,QAAQ,MAAM,oBAAoB,aAAa,GAAK,CAAC,iBAAiB,CAAC,KAAK,EAAY,OAAO,MAAM,oBAAoB,IAAI,EAAE,IAAI,EAAE,KAAK,IAAI,aAAa,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAY,OAAO,MAAM,mBAAmB,IAAI,GAAG,IAAI,EAAE,KAAK,GAAG,aAAa,EAAE,CAAC,WAAW,CAAC,KAAK,EAAY,QAAQ,MAAM,cAAc,aAAa,GAAK,CAAC,SAAS,CAAC,KAAK,EAAY,QAAQ,MAAM,WAAW,aAAa,GAAM,CAAC,cAAc,CAAC,KAAK,EAAY,OAAO,MAAM,eAAe,IAAI,KAAK,IAAI,IAAI,KAAK,GAAG,aAAa,GAAG,OAAO,GAAO,CAAC,EAAM,SAAS,CAAC,aAAa,CAAC,KAAK,EAAY,QAAQ,MAAM,gBAAgB,aAAa,GAAM,CAAC,SAAS,CAAC,KAAK,EAAY,OAAO,MAAM,YAAY,IAAI,EAAE,IAAI,IAAI,KAAK,EAAE,aAAa,GAAG,OAAO,GAAO,CAAC,EAAM,aAAa,CAAC,CAAC"}