{"version":3,"file":"LineAnimationPro.Bom-UFCp.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/FyGjJVVc8R2uHluKtTLK/Ri8oSUaCpURSQZX0cdg4/LineAnimationPro.js"],"sourcesContent":["// Line Animation Pro - Animate any SVG path with scroll-linked or in-view drawing\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef,useState,startTransition}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{motion,useScroll,useTransform,useInView,useSpring}from\"framer-motion\";/**\n * Line Animation Pro\n * \n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function LineAnimationPro(props){const{svgPath=\"M10 80 Q 95 10 180 80\",mode=\"inView\",strokeColor=\"#FFFFFF\",strokeWidth=20,strokeCap=\"round\",enableRetrigger=true,animationDuration=.9,animationDelay=.25,viewOffset=.2}=props;const isStatic=useIsStaticRenderer();const containerRef=useRef(null);const pathRef=useRef(null);const[pathLength,setPathLength]=useState(0);const[viewBox,setViewBox]=useState(\"0 0 200 100\");const[hasAnimated,setHasAnimated]=useState(false);const[extractedPath,setExtractedPath]=useState(svgPath);// Extract path from full SVG string or use as-is\nuseEffect(()=>{let pathData=svgPath.trim();// Check if it's a full SVG string\nif(pathData.includes(\"<svg\")||pathData.includes(\"<path\")){// Extract the d attribute value\nconst dMatch=pathData.match(/d=\"([^\"]+)\"/);if(dMatch&&dMatch[1]){pathData=dMatch[1];}}setExtractedPath(pathData);},[svgPath]);// Calculate viewBox from path\nuseEffect(()=>{if(!pathRef.current)return;try{const bbox=pathRef.current.getBBox();const padding=20;const vb=`${bbox.x-padding} ${bbox.y-padding} ${bbox.width+padding*2} ${bbox.height+padding*2}`;setViewBox(vb);const length=pathRef.current.getTotalLength();setPathLength(length);}catch(e){// Fallback for invalid paths\nsetViewBox(\"0 0 200 100\");}},[extractedPath]);// In View mode\nconst isInView=useInView(containerRef,{once:!enableRetrigger,amount:viewOffset});// Scroll Linked mode\nconst{scrollYProgress}=useScroll({target:containerRef,offset:[\"start end\",\"end start\"]});// Smooth spring for scroll-linked animation\nconst smoothProgress=useSpring(scrollYProgress,{stiffness:100,damping:30,restDelta:.001});// Transform scroll progress to pathLength\nconst scrollPathLength=useTransform(smoothProgress,[0,.3,.7,1],[0,0,pathLength,pathLength]);// Track animation state for retrigger\nuseEffect(()=>{if(mode===\"inView\"&&isInView&&!isStatic){startTransition(()=>setHasAnimated(true));}else if(mode===\"inView\"&&!isInView&&enableRetrigger&&!isStatic){startTransition(()=>setHasAnimated(false));}},[isInView,mode,enableRetrigger,isStatic]);// Determine which animation to use\nconst shouldAnimate=mode===\"inView\"?isInView||hasAnimated:false;if(isStatic){// Static preview - show full path\nreturn /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\"},children:/*#__PURE__*/_jsx(\"svg\",{viewBox:viewBox,style:{width:\"100%\",height:\"100%\",overflow:\"visible\"},children:/*#__PURE__*/_jsx(\"path\",{ref:pathRef,d:extractedPath,stroke:strokeColor,strokeWidth:strokeWidth,strokeLinecap:strokeCap,fill:\"none\"})})});}return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\"},children:/*#__PURE__*/_jsx(\"svg\",{viewBox:viewBox,style:{width:\"100%\",height:\"100%\",overflow:\"visible\"},children:mode===\"scrollLinked\"?/*#__PURE__*/_jsx(motion.path,{ref:pathRef,d:extractedPath,stroke:strokeColor,strokeWidth:strokeWidth,strokeLinecap:strokeCap,fill:\"none\",strokeDasharray:pathLength,strokeDashoffset:useTransform(scrollPathLength,latest=>pathLength-latest)}):/*#__PURE__*/_jsx(motion.path,{ref:pathRef,d:extractedPath,stroke:strokeColor,strokeWidth:strokeWidth,strokeLinecap:strokeCap,fill:\"none\",initial:{pathLength:0,opacity:1},animate:{pathLength:shouldAnimate?1:0,opacity:1},transition:{pathLength:{duration:animationDuration,ease:[.42,0,.58,1],delay:animationDelay}}})})});}addPropertyControls(LineAnimationPro,{svgPath:{type:ControlType.String,title:\"SVG Input\",defaultValue:\"M10 80 Q 95 10 180 80\",displayTextArea:true,description:\"Paste a full SVG string (copied from Figma) or just the 'd' attribute value. Both work.\"},mode:{type:ControlType.Enum,title:\"Mode\",options:[\"inView\",\"scrollLinked\"],optionTitles:[\"In View\",\"Scroll Linked\"],defaultValue:\"inView\",displaySegmentedControl:true},strokeColor:{type:ControlType.Color,title:\"Color\",defaultValue:\"#FFFFFF\"},strokeWidth:{type:ControlType.Number,title:\"Width\",defaultValue:20,min:.5,max:100,step:.5,displayStepper:false},strokeCap:{type:ControlType.Enum,title:\"Cap Style\",options:[\"round\",\"butt\",\"square\"],optionTitles:[\"Round\",\"Butt\",\"Square\"],defaultValue:\"round\"},animationDuration:{type:ControlType.Number,title:\"Duration\",defaultValue:.9,min:.1,max:5,step:.1,unit:\"s\",displayStepper:false,hidden:({mode})=>mode===\"scrollLinked\"},animationDelay:{type:ControlType.Number,title:\"Delay\",defaultValue:.25,min:0,max:3,step:.05,unit:\"s\",displayStepper:false,hidden:({mode})=>mode===\"scrollLinked\"},enableRetrigger:{type:ControlType.Boolean,title:\"Re-trigger\",defaultValue:true,enabledTitle:\"Yes\",disabledTitle:\"No\",description:\"When enabled, the animation replays each time the element re-enters the viewport.\",hidden:({mode})=>mode===\"scrollLinked\"},viewOffset:{type:ControlType.Number,title:\"View Offset\",defaultValue:.2,min:0,max:1,step:.05,displayStepper:false,description:\"Intersection threshold (0 = any visibility, 1 = fully in view).\",hidden:({mode})=>mode===\"scrollLinked\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"LineAnimationPro\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./LineAnimationPro.map"],"mappings":"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"}