{"version":3,"file":"PathAnimation.DJV9Pcpp.mjs","names":["useMemo","p","useRef","useState"],"sources":["https:/framerusercontent.com/modules/EvIc5UMNse4i9wcI3nds/UllmTwRRmldsLsi6mjur/PathAnimation.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{motion,useScroll,useTransform,useSpring}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";import{useRef,useState,useEffect,useMemo}from\"react\";function Checkpoint({x,y,dotSize,dotColor,icon,label,labelAlign=\"right\",progress,threshold}){const opacity=useTransform(progress,v=>v>=threshold?1:0);// Heuristic for text width\nconst charWidth=7.5;const padding=20;const textWidth=label?label.length*charWidth+padding:0;const textHeight=28;const labelBg=\"#BFDBFE\"// Light blue\n;const isLeft=labelAlign===\"left\";const labelX=isLeft?x-dotSize-8-textWidth:x+dotSize+8;const labelY=y-textHeight/2;return /*#__PURE__*/_jsxs(motion.g,{style:{opacity},children:[/*#__PURE__*/_jsx(\"circle\",{cx:x,cy:y,r:dotSize,fill:\"white\",stroke:dotColor,strokeWidth:2}),icon&&/*#__PURE__*/_jsx(\"image\",{href:icon.src,x:x-dotSize*.6,y:y-dotSize*.6,height:dotSize*1.2,width:dotSize*1.2,style:{pointerEvents:\"none\"}}),label&&/*#__PURE__*/_jsxs(\"g\",{transform:`translate(${labelX}, ${labelY})`,children:[/*#__PURE__*/_jsx(\"rect\",{x:0,y:0,width:textWidth,height:textHeight,rx:textHeight/2,ry:textHeight/2,fill:labelBg,stroke:dotColor,strokeWidth:1}),/*#__PURE__*/_jsx(\"text\",{x:textWidth/2,y:textHeight/2+4,textAnchor:\"middle\",fill:\"black\",fontSize:\"13\",fontWeight:\"500\",fontFamily:\"sans-serif\",style:{pointerEvents:\"none\"},children:label})]})]});}/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function PathAnimation(props){const{color,backColor,thickness,dotSize,dotColor,smoothness,offsetStart,offsetEnd,path:rawPath,viewBox:rawViewBox,dotX,dotY,checkpoints=[]}=props;const{path,viewBox}=useMemo(()=>{let p=rawPath;let v=rawViewBox;if(typeof p===\"string\"&&p.trim().startsWith(\"<\")){const dMatch=p.match(/d\\s*=\\s*([\"'])([\\s\\S]*?)\\1/);const vMatch=p.match(/viewBox\\s*=\\s*([\"'])([\\s\\S]*?)\\1/);if(dMatch)p=dMatch[2];if(vMatch)v=vMatch[2];}return{path:p,viewBox:v};},[rawPath,rawViewBox]);const ref=useRef(null);const pathRef=useRef(null);const[thresholds,setThresholds]=useState([]);const{scrollYProgress}=useScroll({target:ref,offset:[`${offsetStart*100}% end`,`${offsetEnd*100}% start`]});useEffect(()=>{if(pathRef.current){const pathEl=pathRef.current;const length=pathEl.getTotalLength();const newThresholds=checkpoints.map(point=>{let bestDist=Infinity;let bestLen=0;const steps=200;for(let i=0;i<=steps;i++){const l=i/steps*length;const p=pathEl.getPointAtLength(l);const dist=Math.hypot(p.x-point.x,p.y-point.y);if(dist<bestDist){bestDist=dist;bestLen=l;}}return bestLen/length;});setThresholds(newThresholds);}},[path,checkpoints]);const pathLength=useSpring(scrollYProgress,{stiffness:400,damping:90,mass:1,restDelta:.001});return /*#__PURE__*/_jsx(\"div\",{ref:ref,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",overflow:\"visible\"},children:/*#__PURE__*/_jsxs(\"svg\",{viewBox:viewBox,preserveAspectRatio:\"xMidYMid meet\",style:{width:\"100%\",height:\"100%\",overflow:\"visible\"},children:[/*#__PURE__*/_jsx(\"path\",{d:path,fill:\"none\",stroke:backColor,strokeWidth:thickness,strokeLinecap:\"round\",strokeLinejoin:\"round\"}),/*#__PURE__*/_jsx(motion.path,{ref:pathRef,d:path,fill:\"none\",stroke:color,strokeWidth:thickness,strokeLinecap:\"round\",strokeLinejoin:\"round\",style:{pathLength}}),/*#__PURE__*/_jsx(\"circle\",{cx:dotX,cy:dotY,r:dotSize,fill:dotColor}),checkpoints.map((point,index)=>/*#__PURE__*/_jsx(Checkpoint,{...point,dotSize:dotSize,dotColor:dotColor,progress:pathLength,threshold:thresholds[index]??1},index))]})});}addPropertyControls(PathAnimation,{path:{type:ControlType.String,title:\"Path Data\",defaultValue:\"M 150 0 L 150 100 C 150 150 100 180 100 230 C 100 280 200 280 200 330 C 200 380 100 380 100 430 C 100 480 200 480 200 530 C 200 580 150 610 150 660 L 150 1000\",displayTextArea:true},viewBox:{type:ControlType.String,title:\"ViewBox\",defaultValue:\"0 0 300 1000\"},color:{type:ControlType.Color,title:\"Line Color\",defaultValue:\"#000000\"},backColor:{type:ControlType.Color,title:\"Back Color\",defaultValue:\"rgba(0,0,0,0.1)\"},thickness:{type:ControlType.Number,title:\"Thickness\",defaultValue:2,min:1,max:50},dotColor:{type:ControlType.Color,title:\"Dot Color\",defaultValue:\"#000000\"},dotSize:{type:ControlType.Number,title:\"Dot Size\",defaultValue:24,min:0,max:100},dotX:{type:ControlType.Number,title:\"Dot X\",defaultValue:150},dotY:{type:ControlType.Number,title:\"Dot Y\",defaultValue:0},checkpoints:{type:ControlType.Array,title:\"Checkpoints\",control:{type:ControlType.Object,controls:{x:{type:ControlType.Number},y:{type:ControlType.Number},icon:{type:ControlType.ResponsiveImage},label:{type:ControlType.String},labelAlign:{type:ControlType.Enum,options:[\"left\",\"right\"],optionTitles:[\"Left\",\"Right\"],defaultValue:\"right\"}}},defaultValue:[{x:150,y:150,label:\"Start\"},{x:100,y:230,label:\"Sales\",labelAlign:\"left\"},{x:200,y:330,label:\"Operations\"},{x:100,y:430,label:\"Marketing\",labelAlign:\"left\"},{x:200,y:530,label:\"Support\"},{x:150,y:660,label:\"End\"}]},offsetStart:{type:ControlType.Number,title:\"Start Offset\",defaultValue:0,min:-1,max:1,step:.1,displayStepper:true,unit:\"%\"},offsetEnd:{type:ControlType.Number,title:\"End Offset\",defaultValue:1,min:0,max:2,step:.1,displayStepper:true,unit:\"%\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"PathAnimation\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"fixed\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./PathAnimation.map"],"mappings":"4QAAqO,SAAS,EAAW,CAAC,IAAE,IAAE,UAAQ,WAAS,OAAK,QAAM,aAAW,QAAQ,WAAS,aAAW,CAAC,IAAM,EAAQ,EAAa,EAAS,GAAG,GAAG,EAAU,EAAE,EAAE,CAC/U,EAAU,EAAM,EAAM,OAAjD,IAAkB,GAAwD,EAClD,EAA1B,IAAa,OAA2B,EAAE,EAAQ,EAAE,EAAU,EAAE,EAAQ,EAAQ,EAAO,EAAE,GAAW,EAAE,OAAoB,EAAM,EAAO,EAAE,CAAC,MAAM,CAAC,UAAQ,CAAC,SAAS,CAAc,EAAK,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,EAAQ,KAAK,QAAQ,OAAO,EAAS,YAAY,EAAE,CAAC,CAAC,GAAmB,EAAK,QAAQ,CAAC,KAAK,EAAK,IAAI,EAAE,EAAE,EAAQ,GAAG,EAAE,EAAE,EAAQ,GAAG,OAAO,EAAQ,IAAI,MAAM,EAAQ,IAAI,MAAM,CAAC,cAAc,OAAO,CAAC,CAAC,CAAC,GAAoB,EAAM,IAAI,CAAC,UAAU,aAAa,EAAO,IAAI,EAAO,GAAG,SAAS,CAAc,EAAK,OAAO,CAAC,EAAE,EAAE,EAAE,EAAE,MAAM,EAAU,OAAO,GAAW,GAAG,GAAW,EAAE,GAAG,GAAW,EAAE,KAAK,UAAQ,OAAO,EAAS,YAAY,EAAE,CAAC,CAAc,EAAK,OAAO,CAAC,EAAE,EAAU,EAAE,EAAE,GAAe,WAAW,SAAS,KAAK,QAAQ,SAAS,KAAK,WAAW,MAAM,WAAW,aAAa,MAAM,CAAC,cAAc,OAAO,CAAC,SAAS,EAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAGv0B,SAAwB,EAAc,EAAM,CAAC,GAAK,CAAC,QAAM,YAAU,YAAU,UAAQ,WAAS,aAAW,cAAY,YAAU,KAAK,EAAQ,QAAQ,EAAW,OAAK,OAAK,cAAY,EAAE,EAAE,EAAW,CAAC,OAAK,WAASA,MAAY,CAAC,IAAIC,EAAE,EAAY,EAAE,EAAW,GAAG,OAAOA,GAAI,UAAUA,EAAE,MAAM,CAAC,WAAW,IAAI,CAAC,CAAC,IAAM,EAAOA,EAAE,MAAM,6BAA6B,CAAO,EAAOA,EAAE,MAAM,mCAAmC,CAAI,IAAO,EAAE,EAAO,IAAM,IAAO,EAAE,EAAO,IAAI,MAAM,CAAC,KAAKA,EAAE,QAAQ,EAAE,EAAG,CAAC,EAAQ,EAAW,CAAC,CAAO,EAAIC,EAAO,KAAK,CAAO,EAAQA,EAAO,KAAK,CAAM,CAAC,EAAW,GAAeC,EAAS,EAAE,CAAC,CAAM,CAAC,mBAAiB,EAAU,CAAC,OAAO,EAAI,OAAO,CAAC,GAAG,EAAY,IAAI,OAAO,GAAG,EAAU,IAAI,SAAS,CAAC,CAAC,CAAC,MAAc,CAAC,GAAG,EAAQ,QAAQ,CAAC,IAAM,EAAO,EAAQ,QAAc,EAAO,EAAO,gBAAgB,CAAyS,EAApR,EAAY,IAAI,GAAO,CAAC,IAAI,EAAS,IAAa,EAAQ,EAAkB,IAAI,IAAI,EAAE,EAAE,GAAG,IAAM,IAAI,CAAC,IAAM,EAAE,EAAE,IAAM,EAAaF,EAAE,EAAO,iBAAiB,EAAE,CAAO,EAAK,KAAK,MAAMA,EAAE,EAAE,EAAM,EAAEA,EAAE,EAAE,EAAM,EAAE,CAAI,EAAK,IAAU,EAAS,EAAK,EAAQ,GAAI,OAAO,EAAQ,GAAS,CAA6B,GAAI,CAAC,EAAK,EAAY,CAAC,CAAC,IAAM,EAAW,EAAU,EAAgB,CAAC,UAAU,IAAI,QAAQ,GAAG,KAAK,EAAE,UAAU,KAAK,CAAC,CAAC,OAAoB,EAAK,MAAM,CAAK,MAAI,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,QAAQ,OAAO,WAAW,SAAS,eAAe,SAAS,SAAS,UAAU,CAAC,SAAsB,EAAM,MAAM,CAAS,UAAQ,oBAAoB,gBAAgB,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,SAAS,UAAU,CAAC,SAAS,CAAc,EAAK,OAAO,CAAC,EAAE,EAAK,KAAK,OAAO,OAAO,EAAU,YAAY,EAAU,cAAc,QAAQ,eAAe,QAAQ,CAAC,CAAc,EAAK,EAAO,KAAK,CAAC,IAAI,EAAQ,EAAE,EAAK,KAAK,OAAO,OAAO,EAAM,YAAY,EAAU,cAAc,QAAQ,eAAe,QAAQ,MAAM,CAAC,aAAW,CAAC,CAAC,CAAc,EAAK,SAAS,CAAC,GAAG,EAAK,GAAG,EAAK,EAAE,EAAQ,KAAK,EAAS,CAAC,CAAC,EAAY,KAAK,EAAM,IAAqB,EAAK,EAAW,CAAC,GAAG,EAAc,UAAiB,WAAS,SAAS,EAAW,UAAU,EAAW,IAAQ,EAAE,CAAC,EAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kBALl/D,IAAmE,IAAoD,IAAqD,CAKw0D,EAAoB,EAAc,CAAC,KAAK,CAAC,KAAK,EAAY,OAAO,MAAM,YAAY,aAAa,iKAAiK,gBAAgB,GAAK,CAAC,QAAQ,CAAC,KAAK,EAAY,OAAO,MAAM,UAAU,aAAa,eAAe,CAAC,MAAM,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,UAAU,CAAC,UAAU,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,kBAAkB,CAAC,UAAU,CAAC,KAAK,EAAY,OAAO,MAAM,YAAY,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,CAAC,SAAS,CAAC,KAAK,EAAY,MAAM,MAAM,YAAY,aAAa,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAY,OAAO,MAAM,WAAW,aAAa,GAAG,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,IAAI,CAAC,KAAK,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,EAAE,CAAC,YAAY,CAAC,KAAK,EAAY,MAAM,MAAM,cAAc,QAAQ,CAAC,KAAK,EAAY,OAAO,SAAS,CAAC,EAAE,CAAC,KAAK,EAAY,OAAO,CAAC,EAAE,CAAC,KAAK,EAAY,OAAO,CAAC,KAAK,CAAC,KAAK,EAAY,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAY,OAAO,CAAC,WAAW,CAAC,KAAK,EAAY,KAAK,QAAQ,CAAC,OAAO,QAAQ,CAAC,aAAa,CAAC,OAAO,QAAQ,CAAC,aAAa,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,MAAM,QAAQ,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,MAAM,QAAQ,WAAW,OAAO,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,MAAM,aAAa,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,MAAM,YAAY,WAAW,OAAO,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,MAAM,UAAU,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,MAAM,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,EAAY,OAAO,MAAM,eAAe,aAAa,EAAE,IAAI,GAAG,IAAI,EAAE,KAAK,GAAG,eAAe,GAAK,KAAK,IAAI,CAAC,UAAU,CAAC,KAAK,EAAY,OAAO,MAAM,aAAa,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,GAAG,eAAe,GAAK,KAAK,IAAI,CAAC,CAAC"}