svg-scroll-draw 2.20.0 → 2.21.0

package/dist/web-component/index.cjs

@@ -1,3 +1,3 @@
-'use strict';function Wt({bounces:e=3,decay:r=.5}={}){let n=Math.max(1,Math.round(e)),o=Math.max(.01,Math.min(.99,r)),i=Math.sqrt(o),u=0,m=[];for(let y=0;y<n;y++){let w=Math.pow(i,y);m.push(w),u+=w;}let b=[0],$=0;for(let y=0;y<n;y++)$+=m[y]/u,b.push($);return y=>{if(y<=0)return 0;if(y>=1)return 1;for(let w=0;w<n;w++)if(y<=b[w+1]){let k=(y-b[w])/(b[w+1]-b[w]);if(w===0)return k*(2-k);let v=1-Math.pow(o,w);return v+(1-v)*(2*k-1)*(2*k-1)}return 1}}function Gt({amplitude:e=1,period:r=.4}={}){let n=Math.max(1,e),o=Math.max(.1,r),i=n<=1?o/4:o/(2*Math.PI)*Math.asin(1/n);return u=>u<=0?0:u>=1?1:n*Math.pow(2,-10*u)*Math.sin((u-i)*(2*Math.PI)/o)+1}var Ee={linear:e=>e,"ease-in":e=>e*e,"ease-out":e=>e*(2-e),"ease-in-out":e=>e<.5?2*e*e:-1+(4-2*e)*e,spring:e=>1-Math.cos(e*Math.PI*2.5)*Math.pow(1-e,2.2),bounce:Wt(),elastic:Gt()};function pt(e,r,n){return Math.min(n,Math.max(r,e))}function Be(e="top bottom"){let r=e.trim();if(/^\d+(\.\d+)?%$/.test(r))return {element:"top",viewport:r};let[n="top",o="bottom"]=r.split(/\s+/).filter(Boolean);return {element:n,viewport:o}}function dt(e,r,n,o){switch(o){case "top":return e+n;case "center":return e+n+r/2;case "bottom":return e+n+r;default:return e+n}}function gt(e,r){if(/^\d+(\.\d+)?%$/.test(e))return r*(parseFloat(e)/100);switch(e){case "top":return 0;case "center":return r/2;case "bottom":return r;default:return r}}function ue(e,r,n,o){return n===r?0:pt((e-r)/(n-r)*o,0,1)}function Ue(e,r,n,o,i){let u=dt(e.top,e.height,r,o.element)-gt(o.viewport,n),m=dt(e.top,e.height,r,i.element)-gt(i.viewport,n);return {tStart:u,tEnd:m}}function yt(e,r,n){let o=e.getBoundingClientRect(),i=n==="x"?o.width:o.height;return r?{top:n==="x"?o.left-r.getBoundingClientRect().left+r.scrollLeft:o.top-r.getBoundingClientRect().top+r.scrollTop,height:i,scroll:0}:{top:n==="x"?o.left:o.top,height:i,scroll:n==="x"?window.scrollX:window.scrollY}}function de(e){let r=e.tagName.toLowerCase();if(r==="rect"){let n=parseFloat(e.getAttribute("width")??"0"),o=parseFloat(e.getAttribute("height")??"0");return 2*(n+o)}if(r==="circle"){let n=parseFloat(e.getAttribute("r")??"0");return 2*Math.PI*n}return e.getTotalLength()}function ht(e){let r=/^#([a-f\d])([a-f\d])([a-f\d])$/i.exec(e);if(r)return [parseInt(r[1]+r[1],16),parseInt(r[2]+r[2],16),parseInt(r[3]+r[3],16)];let n=/^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(n)return [parseInt(n[1],16),parseInt(n[2],16),parseInt(n[3],16)];let o=/^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i.exec(e);return o?[parseInt(o[1]),parseInt(o[2]),parseInt(o[3])]:null}function Ie(e,r,n){let o=ht(e),i=ht(r);return !o||!i?e:`rgb(${Math.round(o[0]+(i[0]-o[0])*n)},${Math.round(o[1]+(i[1]-o[1])*n)},${Math.round(o[2]+(i[2]-o[2])*n)})`}var bt={sketch:{easing:"ease-in",stagger:.1,speed:.9,fade:false},reveal:{easing:"ease-out",fade:true,speed:1.2,once:true},typewriter:{easing:"linear",stagger:.05,speed:1.5},cinematic:{easing:"ease-in-out",fade:true,speed:.75},spring:{easing:"spring",speed:1.1}};var Se=typeof __SVG_SCROLL_DRAW_DEV__<"u"?__SVG_SCROLL_DRAW_DEV__:typeof process<"u"&&typeof process.env<"u"&&process.env.NODE_ENV!=="production";function ge(e,...r){Se&&console.warn(`[svg-scroll-draw] ${e}`,...r);}var qt="cubic-bezier(0.333333, 0, 0.666667, 0.333333)",Bt="cubic-bezier(0.333333, 0.666667, 0.666667, 1)",wt=33;function Ut(){return typeof CSS<"u"&&typeof CSS.supports=="function"&&CSS.supports("animation-timing-function: linear(0, 1)")}function jt(e){let r=[];for(let n=0;n<wt;n++){let o=n/(wt-1);r.push(String(Math.round(e(o)*1e5)/1e5));}return `linear(${r.join(",")})`}function vt(e){switch(e){case "linear":return "linear";case "ease-in":return qt;case "ease-out":return Bt;case "ease-in-out":return Ut()?jt(Ee["ease-in-out"]):null;default:return null}}var Et=Symbol.for("svg-scroll-draw.registry");function St(){let e=globalThis;return e[Et]||(e[Et]=new Map)}function xt(e,r){St().set(e,r);}function $t(e){St().delete(e);}var xe,Ne=new Set,_e=new WeakMap,$e=new Map,Tt=e=>{let r=e.getBoundingClientRect();return r.width+" "+r.height};function Qt(e){let r=new Set;for(let n of e)for(;n&&n!==document.body;n=n.parentElement)for(let o=n;o;o=o.previousElementSibling)r.add(o);return r}function At(e,r){if(typeof ResizeObserver>"u"||typeof document>"u")return ()=>{};let n=()=>r();xe??(xe=new ResizeObserver(i=>{let u=false;for(let{target:m}of i)_e.get(m)!==Tt(m)&&(u=true),_e.set(m,"");u&&Ne.forEach(m=>m());})),Ne.add(n);let o=Qt(e);return [document.body,document.documentElement].forEach(i=>i&&o.add(i)),o.forEach(i=>{_e.has(i)||_e.set(i,Tt(i)),$e.set(i,($e.get(i)??0)+1),xe.observe(i);}),()=>{Ne.delete(n)&&(o.forEach(i=>{let u=($e.get(i)??1)-1;if(u)return void $e.set(i,u);$e.delete(i),xe?.unobserve(i);}),Ne.size||(xe?.disconnect(),xe=void 0));}}var Xt=0;function Yt(){return typeof CSS<"u"&&typeof CSS.supports=="function"&&CSS.supports("animation-timeline: view()")&&CSS.supports("view-timeline-name: --x")}function Mt(e,r){let n="";try{n=getComputedStyle(e).getPropertyValue(r).trim();}catch{}return n||(e.getAttribute(r)??"").trim()}var kt=new Set(["","none","transparent","rgba(0, 0, 0, 0)"]);function Jt(e){if(!Se)return;let r=Mt(e,"stroke");if(!r||r==="none"){ge("Element has no stroke \u2014 path will not be visible.",e);return}let n=(e.getAttribute("fill")??"").trim();n&&!kt.has(n)&&!kt.has(Mt(e,"fill"))&&ge("Element has a fill \u2014 it may obscure the stroke animation.",e);}function Kt(e,r,n){let o=document.createElement("div");o.setAttribute("data-svg-scroll-draw-debug",""),o.style.cssText="position:fixed;pointer-events:none;z-index:9999;font-family:monospace;font-size:11px;top:0;left:0;right:0;bottom:0;";function i(){let u=n==="x"?window.scrollX:window.scrollY,m=e-u,b=r-u,$=n==="x";o.innerHTML=`
+'use strict';function Gt({bounces:e=3,decay:r=.5}={}){let n=Math.max(1,Math.round(e)),o=Math.max(.01,Math.min(.99,r)),i=Math.sqrt(o),u=0,m=[];for(let y=0;y<n;y++){let w=Math.pow(i,y);m.push(w),u+=w;}let b=[0],$=0;for(let y=0;y<n;y++)$+=m[y]/u,b.push($);return y=>{if(y<=0)return 0;if(y>=1)return 1;for(let w=0;w<n;w++)if(y<=b[w+1]){let k=(y-b[w])/(b[w+1]-b[w]);if(w===0)return k*(2-k);let v=1-Math.pow(o,w);return v+(1-v)*(2*k-1)*(2*k-1)}return 1}}function qt({amplitude:e=1,period:r=.4}={}){let n=Math.max(1,e),o=Math.max(.1,r),i=n<=1?o/4:o/(2*Math.PI)*Math.asin(1/n);return u=>u<=0?0:u>=1?1:n*Math.pow(2,-10*u)*Math.sin((u-i)*(2*Math.PI)/o)+1}var Ee={linear:e=>e,"ease-in":e=>e*e,"ease-out":e=>e*(2-e),"ease-in-out":e=>e<.5?2*e*e:-1+(4-2*e)*e,spring:e=>1-Math.cos(e*Math.PI*2.5)*Math.pow(1-e,2.2),bounce:Gt(),elastic:qt()};function dt(e,r,n){return Math.min(n,Math.max(r,e))}function je(e="top bottom"){let r=e.trim();if(/^\d+(\.\d+)?%$/.test(r))return {element:"top",viewport:r};let[n="top",o="bottom"]=r.split(/\s+/).filter(Boolean);return {element:n,viewport:o}}function gt(e,r,n,o){switch(o){case "top":return e+n;case "center":return e+n+r/2;case "bottom":return e+n+r;default:return e+n}}function yt(e,r){if(/^\d+(\.\d+)?%$/.test(e))return r*(parseFloat(e)/100);switch(e){case "top":return 0;case "center":return r/2;case "bottom":return r;default:return r}}function ue(e,r,n,o){return n===r?0:dt((e-r)/(n-r)*o,0,1)}function Qe(e,r,n,o,i){let u=gt(e.top,e.height,r,o.element)-yt(o.viewport,n),m=gt(e.top,e.height,r,i.element)-yt(i.viewport,n);return {tStart:u,tEnd:m}}function ht(e,r,n){let o=e.getBoundingClientRect(),i=n==="x"?o.width:o.height;return r?{top:n==="x"?o.left-r.getBoundingClientRect().left+r.scrollLeft:o.top-r.getBoundingClientRect().top+r.scrollTop,height:i,scroll:0}:{top:n==="x"?o.left:o.top,height:i,scroll:n==="x"?window.scrollX:window.scrollY}}function pe(e){let r=e.tagName.toLowerCase();if(r==="rect"){let n=parseFloat(e.getAttribute("width")??"0"),o=parseFloat(e.getAttribute("height")??"0");return 2*(n+o)}if(r==="circle"){let n=parseFloat(e.getAttribute("r")??"0");return 2*Math.PI*n}return e.getTotalLength()}function bt(e){let r=/^#([a-f\d])([a-f\d])([a-f\d])$/i.exec(e);if(r)return [parseInt(r[1]+r[1],16),parseInt(r[2]+r[2],16),parseInt(r[3]+r[3],16)];let n=/^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(n)return [parseInt(n[1],16),parseInt(n[2],16),parseInt(n[3],16)];let o=/^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i.exec(e);return o?[parseInt(o[1]),parseInt(o[2]),parseInt(o[3])]:null}function Ie(e,r,n){let o=bt(e),i=bt(r);return !o||!i?e:`rgb(${Math.round(o[0]+(i[0]-o[0])*n)},${Math.round(o[1]+(i[1]-o[1])*n)},${Math.round(o[2]+(i[2]-o[2])*n)})`}var wt={sketch:{easing:"ease-in",stagger:.1,speed:.9,fade:false},reveal:{easing:"ease-out",fade:true,speed:1.2,once:true},typewriter:{easing:"linear",stagger:.05,speed:1.5},cinematic:{easing:"ease-in-out",fade:true,speed:.75},spring:{easing:"spring",speed:1.1}};var Se=typeof __SVG_SCROLL_DRAW_DEV__<"u"?__SVG_SCROLL_DRAW_DEV__:typeof process<"u"&&typeof process.env<"u"&&process.env.NODE_ENV!=="production";function de(e,...r){Se&&console.warn(`[svg-scroll-draw] ${e}`,...r);}var Bt="cubic-bezier(0.333333, 0, 0.666667, 0.333333)",Ut="cubic-bezier(0.333333, 0.666667, 0.666667, 1)",vt=33;function jt(){return typeof CSS<"u"&&typeof CSS.supports=="function"&&CSS.supports("animation-timing-function: linear(0, 1)")}function Qt(e){let r=[];for(let n=0;n<vt;n++){let o=n/(vt-1);r.push(String(Math.round(e(o)*1e5)/1e5));}return `linear(${r.join(",")})`}function Et(e){switch(e){case "linear":return "linear";case "ease-in":return Bt;case "ease-out":return Ut;case "ease-in-out":return jt()?Qt(Ee["ease-in-out"]):null;default:return null}}var St=Symbol.for("svg-scroll-draw.registry");function xt(){let e=globalThis;return e[St]||(e[St]=new Map)}function $t(e,r){xt().set(e,r);}function Tt(e){xt().delete(e);}var xe,Ne=new Set,_e=new WeakMap,$e=new Map,At=e=>{let r=e.getBoundingClientRect();return r.width+" "+r.height};function Xt(e){let r=new Set;for(let n of e)for(;n&&n!==document.body;n=n.parentElement)for(let o=n;o;o=o.previousElementSibling)r.add(o);return r}function Mt(e,r){if(typeof ResizeObserver>"u"||typeof document>"u")return ()=>{};let n=()=>r();xe??(xe=new ResizeObserver(i=>{let u=false;for(let{target:m}of i)_e.get(m)!==At(m)&&(u=true),_e.set(m,"");u&&Ne.forEach(m=>m());})),Ne.add(n);let o=Xt(e);return [document.body,document.documentElement].forEach(i=>i&&o.add(i)),o.forEach(i=>{_e.has(i)||_e.set(i,At(i)),$e.set(i,($e.get(i)??0)+1),xe.observe(i);}),()=>{Ne.delete(n)&&(o.forEach(i=>{let u=($e.get(i)??1)-1;if(u)return void $e.set(i,u);$e.delete(i),xe?.unobserve(i);}),Ne.size||(xe?.disconnect(),xe=void 0));}}var Yt=0;function Jt(){return typeof CSS<"u"&&typeof CSS.supports=="function"&&CSS.supports("animation-timeline: view()")&&CSS.supports("view-timeline-name: --x")}function kt(e,r){let n="";try{n=getComputedStyle(e).getPropertyValue(r).trim();}catch{}return n||(e.getAttribute(r)??"").trim()}var Lt=new Set(["","none","transparent","rgba(0, 0, 0, 0)"]);function Kt(e){if(!Se)return;let r=kt(e,"stroke");if(!r||r==="none"){de("Element has no stroke \u2014 path will not be visible.",e);return}let n=(e.getAttribute("fill")??"").trim();n&&!Lt.has(n)&&!Lt.has(kt(e,"fill"))&&de("Element has a fill \u2014 it may obscure the stroke animation.",e);}function Zt(e,r,n){let o=document.createElement("div");o.setAttribute("data-svg-scroll-draw-debug",""),o.style.cssText="position:fixed;pointer-events:none;z-index:9999;font-family:monospace;font-size:11px;top:0;left:0;right:0;bottom:0;";function i(){let u=n==="x"?window.scrollX:window.scrollY,m=e-u,b=r-u,$=n==="x";o.innerHTML=`
       <div style="position:absolute;${$?`left:${m}px;top:0;bottom:0;border-left:2px dashed #22c55e;`:`top:${m}px;left:0;right:0;border-top:2px dashed #22c55e;`}padding:2px 6px;color:#22c55e;background:rgba(0,0,0,.6)">\u25B6 start</div>
-      <div style="position:absolute;${$?`left:${b}px;top:0;bottom:0;border-left:2px dashed #ef4444;`:`top:${b}px;left:0;right:0;border-top:2px dashed #ef4444;`}padding:2px 6px;color:#ef4444;background:rgba(0,0,0,.6)">\u25A0 end</div>`;}return document.body.appendChild(o),window.addEventListener("scroll",i,{passive:true}),i(),{el:o,destroy(){window.removeEventListener("scroll",i),o.remove();}}}var Lt=/[-+]?(?:\d*\.)?\d+(?:[eE][-+]?\d+)?/g,Pt=/[MmLlHhVvCcSsQqTtAaZz]/g;function Zt(e,r,n){if(!Se)return;let o=(e.match(Pt)??[]).join("").toUpperCase(),i=(r.match(Pt)??[]).join("").toUpperCase(),u=(e.match(Lt)??[]).length,m=(r.match(Lt)??[]).length;if(o!==i){ge(`morphTo: command sequence differs (${o||"\u2205"} \u2192 ${i||"\u2205"}). Interpolation is coordinate-for-coordinate, so the result will not reach the target shape. Redraw both paths with the same commands.`,n);return}u!==m&&ge(`morphTo: coordinate count differs (${u} \u2192 ${m}). Extra coordinates are ignored and missing ones hold their start value, so the result will not reach the target shape.`,n);}function je(e,r,n){let o=(r.match(/[-+]?(?:\d*\.)?\d+(?:[eE][-+]?\d+)?/g)??[]).map(Number),i=0;return e.replace(/[-+]?(?:\d*\.)?\d+(?:[eE][-+]?\d+)?/g,u=>{let m=parseFloat(u),b=o[i++]??m;return String(+(m+(b-m)*n).toFixed(4))})}function Dt(e,r={}){if(typeof window>"u")return {destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>0};let{preset:n,...o}=r,i=n?{...bt[n],...o}:o,u=window.matchMedia("(prefers-reduced-motion: reduce)").matches,{selector:m="path, polyline, line, polygon, rect, circle",speed:b=1,fade:$=false,easing:y="linear",trigger:w={},stagger:k=0,direction:v="forward",once:te=false,debug:Ct=false,axis:X="y",scrollContainer:Fe,autoReverse:Te=false,delay:ye=0,strokeColor:re,strokeWidth:ne,fillOpacity:se,waypoints:oe,velocityScale:he=false,threshold:Qe=0,rootMargin:Xe="0px",repeat:ie=0,repeatDelay:Ve=0,morphTo:N,clip:ze,autoplay:Ot=false,duration:Rt=1e3,native:It=true,onProgress:be,onStart:Ae,onComplete:ce,onEnter:Ye,onLeave:Je,onEnterBack:Ke,onLeaveBack:Ze}=i,Y=ze===true?"left":typeof ze=="string"?ze:false,ae=typeof y=="function"?y:Ee[y]??Ee.linear,et=Be(w.start??"top bottom"),tt=Be(w.end??"bottom top"),W=typeof Fe=="string"?document.querySelector(Fe):Fe??null,B=Array.isArray(re)?re[0]:null,L=Array.isArray(re)?re[1]:typeof re=="string"?re:null,O=Array.isArray(ne)?ne[0]:null,P=Array.isArray(ne)?ne[1]:typeof ne=="number"?ne:null,R=Array.isArray(se)?se[0]:null,D=Array.isArray(se)?se[1]:typeof se=="number"?se:null;function le(t){let s=t*100;switch(Y){case "right":return `inset(0 0 0 ${100-s}%)`;case "top":return `inset(0 0 ${100-s}% 0)`;case "bottom":return `inset(${100-s}% 0 0 0)`;case "center":return `circle(${t*150}% at 50% 50%)`;default:return `inset(0 ${100-s}% 0 0)`}}let x=Y?[]:Array.from(e.querySelectorAll(m)),d=[],_=[],F=0,V=0,Me=k,rt=0,M=false,G=false,I=0,fe=false,J=-1,we=[],ke=-1,T=false,U=0,Q=0,K,He=null;function nt(){He?.destroy(),He=null;}let Z=new Set,st=NaN,ee=true,Le=-1,ot=performance.now(),me=NaN;function Pe(){return W?X==="x"?W.scrollLeft:W.scrollTop:X==="x"?window.scrollX:window.scrollY}function it(){return W?X==="x"?W.clientWidth:W.clientHeight:X==="x"?window.innerWidth:window.innerHeight}function at(){let t=yt(e,W,X);return Ue(t,t.scroll,it(),et,tt)}function Nt(){let t=V-F,s=x.length-1,l=W??document.documentElement,E=X==="x"?"Width":"Height";if(Me=k,k>0&&s>0&&t>0){let z=l[`scroll${E}`]-l[`client${E}`]-1-F-t/b;z>=0&&(Me=Math.min(k,z/(s*t)));}rt=V+s*Me*t;}function lt(){(({tStart:F,tEnd:V}=at())),Nt(),Ct&&Se&&(nt(),He=Kt(F,V,X));}function We(t,s=at){xt(e,{type:"draw",getProgress:()=>t.getProgress(),getTrigger:s});let l=t.destroy;return t.destroy=()=>{l.call(t),$t(e);},t}function _t(t,s){if(e.style.setProperty("--scroll-draw-progress",String(t)),Y){let l=s==="reverse"?1-t:t;e.style.clipPath=le(l);return}x.forEach((l,E)=>{l.style.strokeDashoffset=s==="reverse"?`${d[E]*t}`:`${d[E]*(1-t)}`,$&&(l.style.opacity=s==="reverse"?`${1-t}`:`${t}`),B&&L?l.style.stroke=Ie(B,L,t):L&&(l.style.stroke=L),O!==null&&P!==null?l.style.strokeWidth=`${O+(P-O)*t}`:P!==null&&(l.style.strokeWidth=`${P}`),R!==null&&D!==null?l.style.fillOpacity=`${R+(D-R)*t}`:D!==null&&(l.style.fillOpacity=`${D}`),N&&l.tagName.toLowerCase()==="path"&&_[E]&&l.setAttribute("d",je(_[E],N,t));});}function De(){if(e.style.setProperty("--scroll-draw-progress","0"),Y){e.style.clipPath=le(0);return}x.forEach((t,s)=>{t.style.strokeDasharray=`${d[s]}`,t.style.strokeDashoffset=v==="reverse"?"0":`${d[s]}`,$?t.style.opacity=v==="reverse"?"1":"0":t.style.opacity="",B&&(t.style.stroke=B),O!==null&&(t.style.strokeWidth=`${O}`),R!==null&&(t.style.fillOpacity=`${R}`),N&&t.tagName.toLowerCase()==="path"&&_[s]&&t.setAttribute("d",_[s]);});}if(x.forEach(t=>{Jt(t);let s=de(t);d.push(s);let l=t.tagName.toLowerCase()==="path";l?_.push(t.getAttribute("d")??""):_.push(""),N&&(l?Zt(_[_.length-1],N,t):ge(`morphTo only applies to <path> elements \u2014 ignored on <${t.tagName}>.`,t)),u?(t.style.strokeDasharray=`${s}`,t.style.strokeDashoffset=v==="reverse"?`${s}`:"0",$&&(t.style.opacity="1"),L&&(t.style.stroke=L),P!==null&&(t.style.strokeWidth=`${P}`),D!==null&&(t.style.fillOpacity=`${D}`),N&&t.tagName.toLowerCase()==="path"&&t.setAttribute("d",N)):(t.style.strokeDasharray=`${s}`,t.style.strokeDashoffset=v==="reverse"?"0":`${s}`,$?t.style.opacity=v==="reverse"?"1":"0":t.style.opacity="",B&&(t.style.stroke=B),O!==null&&(t.style.strokeWidth=`${O}`),R!==null&&(t.style.fillOpacity=`${R}`));}),Y){if(u)return e.style.clipPath=le(1),ce?.(),{destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>1};e.style.clipPath=le(0);}else if(u)return ce?.(),{destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>1};let ut=typeof y=="string"?vt(y):null;function Ft(){return !(It===false||!Yt()||!x.length||!ut||Y||X!=="y"||W||b!==1||k!==0||te||Te||he!==false||N||oe||ie||ye>0||be||Ae||ce||Ye||Je||Ke||Ze||re!=null||ne!=null||se!=null||(w.start??"top bottom").trim()!=="top bottom"||(w.end??"bottom top").trim()!=="bottom top")}function Vt(){let t=++Xt,s=`svg-scroll-draw-${t}`,l=`svg-scroll-draw-host-${t}`,E=`--svg-scroll-draw-${t}`,z=v==="reverse"?"0":"var(--ssd-len)",j=v==="reverse"?"var(--ssd-len)":"0",q=`stroke-dashoffset:${z};`,f=`stroke-dashoffset:${j};`;$&&(q+=`opacity:${v==="reverse"?1:0};`,f+=`opacity:${v==="reverse"?0:1};`);let p=document.createElement("style");p.setAttribute("data-svg-scroll-draw",""),p.textContent=`@keyframes ${s}{from{${q}}to{${f}}}.${l}{view-timeline-name:${E};view-timeline-axis:block;}.${s}{animation-name:${s};animation-duration:auto;animation-timing-function:${ut};animation-fill-mode:both;animation-timeline:${E};animation-range:cover 0% cover 100%;}`,document.head.appendChild(p),e.classList.add(l);function A(a,S){a.style.setProperty("--ssd-len",String(d[S])),a.style.strokeDasharray=`${d[S]}`,a.style.strokeDashoffset="",a.style.opacity="",a.style.animationPlayState="",a.classList.add(s);}x.forEach(A);let c=false,g=-1;function h(){if(g>=0)return g;let a=e.getBoundingClientRect(),{tStart:S,tEnd:H}=Ue({top:a.top,height:a.height},Pe(),it(),et,tt);return ae(ue(Pe(),S,H,b))}return {destroy(){e.classList.remove(l),x.forEach(a=>{a.classList.remove(s),a.style.removeProperty("--ssd-len"),a.style.animationPlayState="";}),p.remove();},replay(){c=false,g=-1,x.forEach(A);},pause(){c=true,x.forEach(a=>{a.style.animationPlayState="paused";});},resume(){c&&(c=false,x.forEach(a=>{a.style.animationPlayState="running";}));},seek(a){let S=Math.min(1,Math.max(0,a));g=S,c=true,x.forEach((H,C)=>{H.classList.remove(s),H.style.strokeDashoffset=v==="reverse"?`${d[C]*S}`:`${d[C]*(1-S)}`,$&&(H.style.opacity=v==="reverse"?`${1-S}`:`${S}`);});},getProgress(){return h()},refresh(){x.forEach((a,S)=>{d[S]=de(a),a.style.setProperty("--ssd-len",String(d[S])),a.style.strokeDasharray=`${d[S]}`;});}}}if(Ft())return We(Vt());function zt(){let t=Math.max(1,Rt),s=0,l=0,E=false;function z(c){let g=true;if(Y){let h=Math.min(1,Math.max(0,c/t)),a=ae(h);U=a,e.style.setProperty("--scroll-draw-progress",String(a)),e.style.clipPath=le(v==="reverse"?1-a:a),be?.(a),h<1&&(g=false);}else x.forEach((h,a)=>{let S=a*k*t,H=Math.min(1,Math.max(0,(c-S)/t)),C=ae(H);h.style.strokeDashoffset=v==="reverse"?`${d[a]*C}`:`${d[a]*(1-C)}`,$&&(h.style.opacity=v==="reverse"?`${1-C}`:`${C}`),B&&L?h.style.stroke=Ie(B,L,C):L&&(h.style.stroke=L),O!==null&&P!==null?h.style.strokeWidth=`${O+(P-O)*C}`:P!==null&&(h.style.strokeWidth=`${P}`),R!==null&&D!==null?h.style.fillOpacity=`${R+(D-R)*C}`:D!==null&&(h.style.fillOpacity=`${D}`),N&&h.tagName.toLowerCase()==="path"&&_[a]&&h.setAttribute("d",je(_[a],N,C)),a===0&&(U=C,be?.(C),e.style.setProperty("--scroll-draw-progress",String(C))),H<1&&(g=false);});if(oe){let h=Math.min(1,Math.max(0,c/t)),a=ae(h);for(let S in oe){let H=parseFloat(S);a>=H&&!Z.has(H)&&(Z.add(H),oe[S]?.());}}return g}function j(c){if(T)return;let g=c-s;G||(G=true,Ae?.());let h=z(g);if(h&&!M){M=true,z(t*(1+Math.max(0,x.length-1)*k)),ce?.(),Q<(ie==="infinite"?1/0:ie??0)&&(Q++,K=setTimeout(()=>{s=performance.now(),G=false,M=false,Z.clear(),De(),I=requestAnimationFrame(j);},Ve));return}h||(I=requestAnimationFrame(j));}function q(){cancelAnimationFrame(I),clearTimeout(K),s=performance.now(),l=0,T=false,G=false,M=false,Q=0,E=true,U=0,Z.clear(),De(),I=requestAnimationFrame(j);}let f=new IntersectionObserver(c=>{c.forEach(g=>{g.isIntersecting&&!(te&&M)?q():!g.isIntersecting&&!te&&!M&&(cancelAnimationFrame(I),clearTimeout(K),E=false);});},{root:W??null,threshold:Qe,rootMargin:Xe}),p;function A(){clearTimeout(p),p=setTimeout(()=>{x.forEach((c,g)=>{d[g]=de(c),c.style.strokeDasharray=`${d[g]}`;});},150);}return window.addEventListener("resize",A),window.addEventListener("orientationchange",A),ye>0?setTimeout(()=>f.observe(e),ye):f.observe(e),{destroy(){cancelAnimationFrame(I),clearTimeout(K),f.disconnect(),window.removeEventListener("resize",A),window.removeEventListener("orientationchange",A),clearTimeout(p);},replay(){Q=0,q();},pause(){T||!E||(T=true,l=performance.now()-s,cancelAnimationFrame(I));},resume(){T&&(T=false,E=true,s=performance.now()-l,I=requestAnimationFrame(j));},seek(c){let g=Math.min(1,Math.max(0,c));U=g,T=true,l=g*t,s=performance.now()-l,cancelAnimationFrame(I),z(l);},getProgress(){return U},refresh(){clearTimeout(p),x.forEach((c,g)=>{d[g]=de(c),c.style.strokeDasharray=`${d[g]}`;});}}}if(Ot)return We(zt());lt();function ct(){if(T||!pe)return;let t=performance.now(),s=Pe();if(!ee&&he===false&&s===st){Ge(s);return}ee=false,st=s;let l=b;if(he!==false){let f=t-ot,p=f>0?Math.abs(s-(Le<0?s:Le))/f:0;l=b*Math.max(.2,1+p*(typeof he=="number"?he:1)*.04);}Le=s,ot=t;let E=Te?ke===-1||s>=ke?"forward":"reverse":v;ke=s;let z=V-F,j=true,q=z===0?0:(s-F)/z;if(isNaN(me)||(me<=0&&q>0?Ye?.():me>0&&q<=0&&Ze?.(),me<1&&q>=1?Je?.():me>=1&&q<1&&Ke?.()),me=q,Y){let f=ae(ue(s,F,V,l));te&&!Te&&(J=Math.max(J,f),f=J),U=f,e.style.setProperty("--scroll-draw-progress",String(f));let p=E==="reverse"?1-f:f;e.style.clipPath=le(p),be?.(f),!G&&ue(s,F,V,l)>0&&(G=true,Ae?.()),f>=1&&!M?(M=true,ce?.(),Q<(ie==="infinite"?1/0:ie??0)&&(Q++,K=setTimeout(()=>{J=-1,G=false,M=false,e.style.clipPath=le(0);},Ve))):f<1&&!te&&(M=false),Ge(s);return}if(x.forEach((f,p)=>{let A=p*Me*z,c=ae(ue(s,F+A,V+A,l));te&&!Te&&(c=we[p]=Math.max(we[p]??J,c)),f.style.strokeDashoffset=E==="reverse"?`${d[p]*c}`:`${d[p]*(1-c)}`,$&&(f.style.opacity=E==="reverse"?`${1-c}`:`${c}`),B&&L?f.style.stroke=Ie(B,L,c):L&&(f.style.stroke=L),O!==null&&P!==null?f.style.strokeWidth=`${O+(P-O)*c}`:P!==null&&(f.style.strokeWidth=`${P}`),R!==null&&D!==null?f.style.fillOpacity=`${R+(D-R)*c}`:D!==null&&(f.style.fillOpacity=`${D}`),N&&f.tagName.toLowerCase()==="path"&&_[p]&&f.setAttribute("d",je(_[p],N,c)),p===0&&(U=c,be?.(c),e.style.setProperty("--scroll-draw-progress",String(c))),c<1&&(j=false);}),oe){let f=ae(ue(s,F,V,l));for(let p in oe){let A=parseFloat(p);f>=A&&!Z.has(A)&&(Z.add(A),oe[p]?.());}}!G&&ue(s,F,V,l)>0&&(G=true,Ae?.()),j&&!M?(M=true,ce?.(),Q<(ie==="infinite"?1/0:ie??0)&&(Q++,K=setTimeout(()=>{J=-1,we=[],G=false,M=false,Z.clear(),De(),ee=true;},Ve))):!j&&!te&&(M=false),Ge(s);}function ft(t){return t>=V&&t<rt}function Ge(t){fe||ft(t)?I=requestAnimationFrame(ct):pe=false;}let pe=false;function Ce(){pe||(pe=true,I=requestAnimationFrame(function(){ct();}));}function Oe(){pe=false,cancelAnimationFrame(I);}let qe=new IntersectionObserver(t=>{t.forEach(s=>{fe=s.isIntersecting,fe&&!T?(ee=true,Ce()):pe&&!T&&ft(Pe())||Oe();});},{root:W??null,threshold:Qe,rootMargin:Xe});function mt(){x.forEach((t,s)=>{d[s]=de(t),t.style.strokeDasharray=`${d[s]}`;}),lt(),ee=true;}let Re;function ve(){clearTimeout(Re),Re=setTimeout(mt,150);}window.addEventListener("resize",ve),window.addEventListener("orientationchange",ve);let Ht=At([e],ve);return ye>0?setTimeout(()=>qe.observe(e),ye):qe.observe(e),We({destroy(){cancelAnimationFrame(I),clearTimeout(K),Oe(),qe.disconnect(),Ht(),window.removeEventListener("resize",ve),window.removeEventListener("orientationchange",ve),clearTimeout(Re),nt();},replay(){J=-1,we=[],ke=-1,Le=-1,G=false,M=false,Q=0,T=false,U=0,Z.clear(),clearTimeout(K),De(),ee=true,fe&&Ce();},pause(){T=true,Oe();},resume(){T&&(T=false,ee=true,fe&&Ce());},seek(t){let s=Math.min(1,Math.max(0,t));U=s,J=s,we=[],T=true,Oe(),_t(s,v),ee=true;},getProgress(){return U},refresh(){clearTimeout(Re),mt(),fe&&!T&&Ce();}},()=>({tStart:F,tEnd:V}))}if(typeof HTMLElement<"u"&&typeof customElements<"u"&&!customElements.get("scroll-draw")){let e=["speed","easing","stagger","direction","selector","fade","once"];class r extends HTMLElement{constructor(){super(...arguments);this.instance=null;this.key="";}connectedCallback(){this.build();}attributeChangedCallback(){this.instance&&this.build();}build(){let i=JSON.stringify(e.map(k=>this.getAttribute(k)));if(this.instance&&i===this.key)return;this.instance?.destroy(),this.key=i;let u={},m=this.getAttribute("speed"),b=this.getAttribute("easing"),$=this.getAttribute("stagger"),y=this.getAttribute("direction"),w=this.getAttribute("selector");m&&(u.speed=parseFloat(m)),b&&(u.easing=b),$&&(u.stagger=parseFloat($)),y&&(u.direction=y),w&&(u.selector=w),this.hasAttribute("fade")&&(u.fade=this.getAttribute("fade")!=="false"),this.hasAttribute("once")&&(u.once=this.getAttribute("once")!=="false"),this.instance=Dt(this,u);}disconnectedCallback(){this.instance?.destroy(),this.instance=null;}}r.observedAttributes=e,customElements.define("scroll-draw",r);}
+      <div style="position:absolute;${$?`left:${b}px;top:0;bottom:0;border-left:2px dashed #ef4444;`:`top:${b}px;left:0;right:0;border-top:2px dashed #ef4444;`}padding:2px 6px;color:#ef4444;background:rgba(0,0,0,.6)">\u25A0 end</div>`;}return document.body.appendChild(o),window.addEventListener("scroll",i,{passive:true}),i(),{el:o,destroy(){window.removeEventListener("scroll",i),o.remove();}}}var Pt=/[-+]?(?:\d*\.)?\d+(?:[eE][-+]?\d+)?/g,Dt=/[MmLlHhVvCcSsQqTtAaZz]/g;function er(e,r,n){if(!Se)return;let o=(e.match(Dt)??[]).join("").toUpperCase(),i=(r.match(Dt)??[]).join("").toUpperCase(),u=(e.match(Pt)??[]).length,m=(r.match(Pt)??[]).length;if(o!==i){de(`morphTo: command sequence differs (${o||"\u2205"} \u2192 ${i||"\u2205"}). Interpolation is coordinate-for-coordinate, so the result will not reach the target shape. Redraw both paths with the same commands.`,n);return}u!==m&&de(`morphTo: coordinate count differs (${u} \u2192 ${m}). Extra coordinates are ignored and missing ones hold their start value, so the result will not reach the target shape.`,n);}function Xe(e,r,n){let o=(r.match(/[-+]?(?:\d*\.)?\d+(?:[eE][-+]?\d+)?/g)??[]).map(Number),i=0;return e.replace(/[-+]?(?:\d*\.)?\d+(?:[eE][-+]?\d+)?/g,u=>{let m=parseFloat(u),b=o[i++]??m;return String(+(m+(b-m)*n).toFixed(4))})}function Ct(e,r={}){if(typeof window>"u")return {destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>0};let{preset:n,...o}=r,i=n?{...wt[n],...o}:o,u=window.matchMedia("(prefers-reduced-motion: reduce)").matches,{selector:m="path, polyline, line, polygon, rect, circle",speed:b=1,fade:$=false,easing:y="linear",trigger:w={},stagger:k=0,direction:v="forward",once:te=false,debug:Ot=false,axis:X="y",scrollContainer:Fe,autoReverse:Te=false,delay:ge=0,strokeColor:re,strokeWidth:ne,fillOpacity:se,waypoints:oe,velocityScale:ye=false,threshold:Ye=0,rootMargin:Je="0px",repeat:ie=0,repeatDelay:Ve=0,morphTo:N,clip:ze,autoplay:Rt=false,duration:It=1e3,native:Nt=true,onProgress:he,onStart:Ae,onComplete:ce,onEnter:Ke,onLeave:Ze,onEnterBack:et,onLeaveBack:tt}=i,Y=ze===true?"left":typeof ze=="string"?ze:false,ae=typeof y=="function"?y:Ee[y]??Ee.linear,rt=je(w.start??"top bottom"),nt=je(w.end??"bottom top"),W=typeof Fe=="string"?document.querySelector(Fe):Fe??null,B=Array.isArray(re)?re[0]:null,L=Array.isArray(re)?re[1]:typeof re=="string"?re:null,O=Array.isArray(ne)?ne[0]:null,P=Array.isArray(ne)?ne[1]:typeof ne=="number"?ne:null,R=Array.isArray(se)?se[0]:null,D=Array.isArray(se)?se[1]:typeof se=="number"?se:null;function le(t){let s=t*100;switch(Y){case "right":return `inset(0 0 0 ${100-s}%)`;case "top":return `inset(0 0 ${100-s}% 0)`;case "bottom":return `inset(${100-s}% 0 0 0)`;case "center":return `circle(${t*150}% at 50% 50%)`;default:return `inset(0 ${100-s}% 0 0)`}}let x=Y?[]:Array.from(e.querySelectorAll(m)),d=[],_=[],F=0,V=0,Me=k,st=0,M=false,G=false,I=0,ke=false,J=-1,be=[],Le=-1,T=false,U=0,Q=0,K,He=null;function ot(){He?.destroy(),He=null;}let Z=new Set,it=NaN,ee=true,Pe=-1,at=performance.now(),fe=NaN;function we(){return W?X==="x"?W.scrollLeft:W.scrollTop:X==="x"?window.scrollX:window.scrollY}function lt(){return W?X==="x"?W.clientWidth:W.clientHeight:X==="x"?window.innerWidth:window.innerHeight}function ut(){let t=ht(e,W,X);return Qe(t,t.scroll,lt(),rt,nt)}function _t(){let t=V-F,s=x.length-1,l=W??document.documentElement,E=X==="x"?"Width":"Height";if(Me=k,k>0&&s>0&&t>0){let z=l[`scroll${E}`]-l[`client${E}`]-1-F-t/b;z>=0&&(Me=Math.min(k,z/(s*t)));}st=V+s*Me*t;}function ct(){(({tStart:F,tEnd:V}=ut())),_t(),Ot&&Se&&(ot(),He=Zt(F,V,X));}function We(t,s=ut){$t(e,{type:"draw",getProgress:()=>t.getProgress(),getTrigger:s});let l=t.destroy;return t.destroy=()=>{l.call(t),Tt(e);},t}function Ft(t,s){if(e.style.setProperty("--scroll-draw-progress",String(t)),Y){let l=s==="reverse"?1-t:t;e.style.clipPath=le(l);return}x.forEach((l,E)=>{l.style.strokeDashoffset=s==="reverse"?`${d[E]*t}`:`${d[E]*(1-t)}`,$&&(l.style.opacity=s==="reverse"?`${1-t}`:`${t}`),B&&L?l.style.stroke=Ie(B,L,t):L&&(l.style.stroke=L),O!==null&&P!==null?l.style.strokeWidth=`${O+(P-O)*t}`:P!==null&&(l.style.strokeWidth=`${P}`),R!==null&&D!==null?l.style.fillOpacity=`${R+(D-R)*t}`:D!==null&&(l.style.fillOpacity=`${D}`),N&&l.tagName.toLowerCase()==="path"&&_[E]&&l.setAttribute("d",Xe(_[E],N,t));});}function De(){if(e.style.setProperty("--scroll-draw-progress","0"),Y){e.style.clipPath=le(0);return}x.forEach((t,s)=>{t.style.strokeDasharray=`${d[s]}`,t.style.strokeDashoffset=v==="reverse"?"0":`${d[s]}`,$?t.style.opacity=v==="reverse"?"1":"0":t.style.opacity="",B&&(t.style.stroke=B),O!==null&&(t.style.strokeWidth=`${O}`),R!==null&&(t.style.fillOpacity=`${R}`),N&&t.tagName.toLowerCase()==="path"&&_[s]&&t.setAttribute("d",_[s]);});}if(x.forEach(t=>{Kt(t);let s=pe(t);d.push(s);let l=t.tagName.toLowerCase()==="path";l?_.push(t.getAttribute("d")??""):_.push(""),N&&(l?er(_[_.length-1],N,t):de(`morphTo only applies to <path> elements \u2014 ignored on <${t.tagName}>.`,t)),u?(t.style.strokeDasharray=`${s}`,t.style.strokeDashoffset=v==="reverse"?`${s}`:"0",$&&(t.style.opacity="1"),L&&(t.style.stroke=L),P!==null&&(t.style.strokeWidth=`${P}`),D!==null&&(t.style.fillOpacity=`${D}`),N&&t.tagName.toLowerCase()==="path"&&t.setAttribute("d",N)):(t.style.strokeDasharray=`${s}`,t.style.strokeDashoffset=v==="reverse"?"0":`${s}`,$?t.style.opacity=v==="reverse"?"1":"0":t.style.opacity="",B&&(t.style.stroke=B),O!==null&&(t.style.strokeWidth=`${O}`),R!==null&&(t.style.fillOpacity=`${R}`));}),Y){if(u)return e.style.clipPath=le(1),ce?.(),{destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>1};e.style.clipPath=le(0);}else if(u)return ce?.(),{destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>1};let ft=typeof y=="string"?Et(y):null;function Vt(){return !(Nt===false||!Jt()||!x.length||!ft||Y||X!=="y"||W||b!==1||k!==0||te||Te||ye!==false||N||oe||ie||ge>0||he||Ae||ce||Ke||Ze||et||tt||re!=null||ne!=null||se!=null||(w.start??"top bottom").trim()!=="top bottom"||(w.end??"bottom top").trim()!=="bottom top")}function zt(){let t=++Yt,s=`svg-scroll-draw-${t}`,l=`svg-scroll-draw-host-${t}`,E=`--svg-scroll-draw-${t}`,z=v==="reverse"?"0":"var(--ssd-len)",j=v==="reverse"?"var(--ssd-len)":"0",q=`stroke-dashoffset:${z};`,f=`stroke-dashoffset:${j};`;$&&(q+=`opacity:${v==="reverse"?1:0};`,f+=`opacity:${v==="reverse"?0:1};`);let p=document.createElement("style");p.setAttribute("data-svg-scroll-draw",""),p.textContent=`@keyframes ${s}{from{${q}}to{${f}}}.${l}{view-timeline-name:${E};view-timeline-axis:block;}.${s}{animation-name:${s};animation-duration:auto;animation-timing-function:${ft};animation-fill-mode:both;animation-timeline:${E};animation-range:cover 0% cover 100%;}`,document.head.appendChild(p),e.classList.add(l);function A(a,S){a.style.setProperty("--ssd-len",String(d[S])),a.style.strokeDasharray=`${d[S]}`,a.style.strokeDashoffset="",a.style.opacity="",a.style.animationPlayState="",a.classList.add(s);}x.forEach(A);let c=false,g=-1;function h(){if(g>=0)return g;let a=e.getBoundingClientRect(),{tStart:S,tEnd:H}=Qe({top:a.top,height:a.height},we(),lt(),rt,nt);return ae(ue(we(),S,H,b))}return {destroy(){e.classList.remove(l),x.forEach(a=>{a.classList.remove(s),a.style.removeProperty("--ssd-len"),a.style.animationPlayState="";}),p.remove();},replay(){c=false,g=-1,x.forEach(A);},pause(){c=true,x.forEach(a=>{a.style.animationPlayState="paused";});},resume(){c&&(c=false,x.forEach(a=>{a.style.animationPlayState="running";}));},seek(a){let S=Math.min(1,Math.max(0,a));g=S,c=true,x.forEach((H,C)=>{H.classList.remove(s),H.style.strokeDashoffset=v==="reverse"?`${d[C]*S}`:`${d[C]*(1-S)}`,$&&(H.style.opacity=v==="reverse"?`${1-S}`:`${S}`);});},getProgress(){return h()},refresh(){x.forEach((a,S)=>{d[S]=pe(a),a.style.setProperty("--ssd-len",String(d[S])),a.style.strokeDasharray=`${d[S]}`;});}}}if(Vt())return We(zt());function Ht(){let t=Math.max(1,It),s=0,l=0,E=false;function z(c){let g=true;if(Y){let h=Math.min(1,Math.max(0,c/t)),a=ae(h);U=a,e.style.setProperty("--scroll-draw-progress",String(a)),e.style.clipPath=le(v==="reverse"?1-a:a),he?.(a),h<1&&(g=false);}else x.forEach((h,a)=>{let S=a*k*t,H=Math.min(1,Math.max(0,(c-S)/t)),C=ae(H);h.style.strokeDashoffset=v==="reverse"?`${d[a]*C}`:`${d[a]*(1-C)}`,$&&(h.style.opacity=v==="reverse"?`${1-C}`:`${C}`),B&&L?h.style.stroke=Ie(B,L,C):L&&(h.style.stroke=L),O!==null&&P!==null?h.style.strokeWidth=`${O+(P-O)*C}`:P!==null&&(h.style.strokeWidth=`${P}`),R!==null&&D!==null?h.style.fillOpacity=`${R+(D-R)*C}`:D!==null&&(h.style.fillOpacity=`${D}`),N&&h.tagName.toLowerCase()==="path"&&_[a]&&h.setAttribute("d",Xe(_[a],N,C)),a===0&&(U=C,he?.(C),e.style.setProperty("--scroll-draw-progress",String(C))),H<1&&(g=false);});if(oe){let h=Math.min(1,Math.max(0,c/t)),a=ae(h);for(let S in oe){let H=parseFloat(S);a>=H&&!Z.has(H)&&(Z.add(H),oe[S]?.());}}return g}function j(c){if(T)return;let g=c-s;G||(G=true,Ae?.());let h=z(g);if(h&&!M){M=true,z(t*(1+Math.max(0,x.length-1)*k)),ce?.(),Q<(ie==="infinite"?1/0:ie??0)&&(Q++,K=setTimeout(()=>{s=performance.now(),G=false,M=false,Z.clear(),De(),I=requestAnimationFrame(j);},Ve));return}h||(I=requestAnimationFrame(j));}function q(){cancelAnimationFrame(I),clearTimeout(K),s=performance.now(),l=0,T=false,G=false,M=false,Q=0,E=true,U=0,Z.clear(),De(),I=requestAnimationFrame(j);}let f=new IntersectionObserver(c=>{c.forEach(g=>{g.isIntersecting&&!(te&&M)?q():!g.isIntersecting&&!te&&!M&&(cancelAnimationFrame(I),clearTimeout(K),E=false);});},{root:W??null,threshold:Ye,rootMargin:Je}),p;function A(){clearTimeout(p),p=setTimeout(()=>{x.forEach((c,g)=>{d[g]=pe(c),c.style.strokeDasharray=`${d[g]}`;});},150);}return window.addEventListener("resize",A),window.addEventListener("orientationchange",A),ge>0?setTimeout(()=>f.observe(e),ge):f.observe(e),{destroy(){cancelAnimationFrame(I),clearTimeout(K),f.disconnect(),window.removeEventListener("resize",A),window.removeEventListener("orientationchange",A),clearTimeout(p);},replay(){Q=0,q();},pause(){T||!E||(T=true,l=performance.now()-s,cancelAnimationFrame(I));},resume(){T&&(T=false,E=true,s=performance.now()-l,I=requestAnimationFrame(j));},seek(c){let g=Math.min(1,Math.max(0,c));U=g,T=true,l=g*t,s=performance.now()-l,cancelAnimationFrame(I),z(l);},getProgress(){return U},refresh(){clearTimeout(p),x.forEach((c,g)=>{d[g]=pe(c),c.style.strokeDasharray=`${d[g]}`;});}}}if(Rt)return We(Ht());ct();function mt(){if(T||!me)return;let t=performance.now(),s=we();if(!ee&&ye===false&&s===it){qe(s);return}ee=false,it=s;let l=b;if(ye!==false){let f=t-at,p=f>0?Math.abs(s-(Pe<0?s:Pe))/f:0;l=b*Math.max(.2,1+p*(typeof ye=="number"?ye:1)*.04);}Pe=s,at=t;let E=Te?Le===-1||s>=Le?"forward":"reverse":v;Le=s;let z=V-F,j=true,q=z===0?0:(s-F)/z;if(isNaN(fe)||(fe<=0&&q>0?Ke?.():fe>0&&q<=0&&tt?.(),fe<1&&q>=1?Ze?.():fe>=1&&q<1&&et?.()),fe=q,Y){let f=ae(ue(s,F,V,l));te&&!Te&&(J=Math.max(J,f),f=J),U=f,e.style.setProperty("--scroll-draw-progress",String(f));let p=E==="reverse"?1-f:f;e.style.clipPath=le(p),he?.(f),!G&&ue(s,F,V,l)>0&&(G=true,Ae?.()),f>=1&&!M?(M=true,ce?.(),Q<(ie==="infinite"?1/0:ie??0)&&(Q++,K=setTimeout(()=>{J=-1,G=false,M=false,e.style.clipPath=le(0);},Ve))):f<1&&!te&&(M=false),qe(s);return}if(x.forEach((f,p)=>{let A=p*Me*z,c=ae(ue(s,F+A,V+A,l));te&&!Te&&(c=be[p]=Math.max(be[p]??J,c)),f.style.strokeDashoffset=E==="reverse"?`${d[p]*c}`:`${d[p]*(1-c)}`,$&&(f.style.opacity=E==="reverse"?`${1-c}`:`${c}`),B&&L?f.style.stroke=Ie(B,L,c):L&&(f.style.stroke=L),O!==null&&P!==null?f.style.strokeWidth=`${O+(P-O)*c}`:P!==null&&(f.style.strokeWidth=`${P}`),R!==null&&D!==null?f.style.fillOpacity=`${R+(D-R)*c}`:D!==null&&(f.style.fillOpacity=`${D}`),N&&f.tagName.toLowerCase()==="path"&&_[p]&&f.setAttribute("d",Xe(_[p],N,c)),p===0&&(U=c,he?.(c),e.style.setProperty("--scroll-draw-progress",String(c))),c<1&&(j=false);}),oe){let f=ae(ue(s,F,V,l));for(let p in oe){let A=parseFloat(p);f>=A&&!Z.has(A)&&(Z.add(A),oe[p]?.());}}!G&&ue(s,F,V,l)>0&&(G=true,Ae?.()),j&&!M?(M=true,ce?.(),Q<(ie==="infinite"?1/0:ie??0)&&(Q++,K=setTimeout(()=>{J=-1,be=[],G=false,M=false,Z.clear(),De(),ee=true;},Ve))):!j&&!te&&(M=false),qe(s);}function Ge(t){return t>=V&&t<st}function qe(t){ke||Ge(t)?I=requestAnimationFrame(mt):me=false;}function Be(){return ke||Ge(we())}let me=false;function Ce(){me||(me=true,I=requestAnimationFrame(function(){mt();}));}function Oe(){me=false,cancelAnimationFrame(I);}let Ue=new IntersectionObserver(t=>{t.forEach(s=>{ke=s.isIntersecting,ke&&!T?(ee=true,Ce()):me&&!T&&Ge(we())||Oe();});},{root:W??null,threshold:Ye,rootMargin:Je});function pt(){x.forEach((t,s)=>{d[s]=pe(t),t.style.strokeDasharray=`${d[s]}`;}),ct(),ee=true;}let Re;function ve(){clearTimeout(Re),Re=setTimeout(pt,150);}window.addEventListener("resize",ve),window.addEventListener("orientationchange",ve);let Wt=Mt([e],ve);return ge>0?setTimeout(()=>Ue.observe(e),ge):Ue.observe(e),We({destroy(){cancelAnimationFrame(I),clearTimeout(K),Oe(),Ue.disconnect(),Wt(),window.removeEventListener("resize",ve),window.removeEventListener("orientationchange",ve),clearTimeout(Re),ot();},replay(){J=-1,be=[],Le=-1,Pe=-1,G=false,M=false,Q=0,T=false,U=0,Z.clear(),clearTimeout(K),De(),ee=true,Be()&&Ce();},pause(){T=true,Oe();},resume(){T&&(T=false,ee=true,Be()&&Ce());},seek(t){let s=Math.min(1,Math.max(0,t));U=s,J=s,be=[],T=true,Oe(),Ft(s,v),ee=true;},getProgress(){return U},refresh(){clearTimeout(Re),pt(),Be()&&!T&&Ce();}},()=>({tStart:F,tEnd:V}))}if(typeof HTMLElement<"u"&&typeof customElements<"u"&&!customElements.get("scroll-draw")){let e=["speed","easing","stagger","direction","selector","fade","once"];class r extends HTMLElement{constructor(){super(...arguments);this.instance=null;this.key="";}connectedCallback(){this.build();}attributeChangedCallback(){this.instance&&this.build();}build(){let i=JSON.stringify(e.map(k=>this.getAttribute(k)));if(this.instance&&i===this.key)return;this.instance?.destroy(),this.key=i;let u={},m=this.getAttribute("speed"),b=this.getAttribute("easing"),$=this.getAttribute("stagger"),y=this.getAttribute("direction"),w=this.getAttribute("selector");m&&(u.speed=parseFloat(m)),b&&(u.easing=b),$&&(u.stagger=parseFloat($)),y&&(u.direction=y),w&&(u.selector=w),this.hasAttribute("fade")&&(u.fade=this.getAttribute("fade")!=="false"),this.hasAttribute("once")&&(u.once=this.getAttribute("once")!=="false"),this.instance=Ct(this,u);}disconnectedCallback(){this.instance?.destroy(),this.instance=null;}}r.observedAttributes=e,customElements.define("scroll-draw",r);}

package/dist/web-component/index.mjs

@@ -1 +1 @@
-import {b}from'../chunk-LQBXJRFY.mjs';import'../chunk-OJFWQ6CU.mjs';import'../chunk-YWKPTYSG.mjs';import'../chunk-YZV4Z3EQ.mjs';import'../chunk-A4JCC3QQ.mjs';import'../chunk-DM6EDKWH.mjs';import'../chunk-4DOJSIEQ.mjs';import'../chunk-BCV4RAIX.mjs';import'../chunk-LFSU6LR3.mjs';if(typeof HTMLElement<"u"&&typeof customElements<"u"&&!customElements.get("scroll-draw")){let e=["speed","easing","stagger","direction","selector","fade","once"];class s extends HTMLElement{constructor(){super(...arguments);this.instance=null;this.key="";}connectedCallback(){this.build();}attributeChangedCallback(){this.instance&&this.build();}build(){let i=JSON.stringify(e.map(d=>this.getAttribute(d)));if(this.instance&&i===this.key)return;this.instance?.destroy(),this.key=i;let t={},n=this.getAttribute("speed"),r=this.getAttribute("easing"),a=this.getAttribute("stagger"),c=this.getAttribute("direction"),o=this.getAttribute("selector");n&&(t.speed=parseFloat(n)),r&&(t.easing=r),a&&(t.stagger=parseFloat(a)),c&&(t.direction=c),o&&(t.selector=o),this.hasAttribute("fade")&&(t.fade=this.getAttribute("fade")!=="false"),this.hasAttribute("once")&&(t.once=this.getAttribute("once")!=="false"),this.instance=b(this,t);}disconnectedCallback(){this.instance?.destroy(),this.instance=null;}}s.observedAttributes=e,customElements.define("scroll-draw",s);}
+import {b}from'../chunk-ENACACPZ.mjs';import'../chunk-OJFWQ6CU.mjs';import'../chunk-YWKPTYSG.mjs';import'../chunk-YZV4Z3EQ.mjs';import'../chunk-A4JCC3QQ.mjs';import'../chunk-DM6EDKWH.mjs';import'../chunk-4DOJSIEQ.mjs';import'../chunk-BCV4RAIX.mjs';import'../chunk-LFSU6LR3.mjs';if(typeof HTMLElement<"u"&&typeof customElements<"u"&&!customElements.get("scroll-draw")){let e=["speed","easing","stagger","direction","selector","fade","once"];class s extends HTMLElement{constructor(){super(...arguments);this.instance=null;this.key="";}connectedCallback(){this.build();}attributeChangedCallback(){this.instance&&this.build();}build(){let i=JSON.stringify(e.map(d=>this.getAttribute(d)));if(this.instance&&i===this.key)return;this.instance?.destroy(),this.key=i;let t={},n=this.getAttribute("speed"),r=this.getAttribute("easing"),a=this.getAttribute("stagger"),c=this.getAttribute("direction"),o=this.getAttribute("selector");n&&(t.speed=parseFloat(n)),r&&(t.easing=r),a&&(t.stagger=parseFloat(a)),c&&(t.direction=c),o&&(t.selector=o),this.hasAttribute("fade")&&(t.fade=this.getAttribute("fade")!=="false"),this.hasAttribute("once")&&(t.once=this.getAttribute("once")!=="false"),this.instance=b(this,t);}disconnectedCallback(){this.instance?.destroy(),this.instance=null;}}s.observedAttributes=e,customElements.define("scroll-draw",s);}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svg-scroll-draw",
-  "version": "2.20.0",
+  "version": "2.21.0",
   "description": "Scroll-driven animation for the web — draw SVG paths, reveal elements, pin sections, scrub video. Zero dependencies, native CSS fast path, works with React, Vue, Svelte, Solid, Angular, Astro and vanilla JS",
   "keywords": [
     "svg",

package/dist/chunk-I45LCJUP.mjs

@@ -1 +0,0 @@
-import {a,d as d$1,c,b as b$2}from'./chunk-A4JCC3QQ.mjs';import {d}from'./chunk-DM6EDKWH.mjs';import {a as a$1,b as b$1}from'./chunk-BCV4RAIX.mjs';import {b}from'./chunk-LFSU6LR3.mjs';function B(n){let o=n.textContent??"";return n.textContent="",o.split(/(\s+)/).filter(Boolean).map(t=>{let e=document.createElement("span");return e.setAttribute("aria-hidden","true"),/^\s+$/.test(t)?(e.textContent=t,e.style.whiteSpace="pre"):(e.textContent=t,e.style.display="inline-block"),n.appendChild(e),/^\s+$/.test(t)?null:e}).filter(t=>t!==null)}function K(n){let o=n.textContent??"";return n.textContent="",o.split("").map(t=>{let e=document.createElement("span");return e.setAttribute("aria-hidden","true"),e.textContent=t,t===" "?e.style.whiteSpace="pre":e.style.display="inline-block",n.appendChild(e),t===" "?null:e}).filter(t=>t!==null)}function D(n){let o=B(n),t=new Map;for(let s of o){let i=s.offsetTop;t.has(i)||t.set(i,[]),t.get(i).push(s);}let e=[],c=Array.from(t.keys()).sort((s,i)=>s-i);for(let s of c){let i=t.get(s),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.style.display="inline-block",i.forEach((y,T)=>{let m=y.nextElementSibling;l.appendChild(y),T<i.length-1&&m&&m.style.whiteSpace==="pre"&&l.appendChild(m);}),e.push(l);}return n.textContent="",e.forEach((s,i)=>{n.appendChild(s),i<e.length-1&&n.appendChild(document.createTextNode(" "));}),e}function Q(n,o,t,e){if(t<=1||e===0)return n;let c=(t-1)*e,s=o*e,i=s+(1-c);return i<=s?n>=s?1:0:Math.min(1,Math.max(0,(n-s)/(i-s)))}function Z(n,o){let t=[];if(o?.y!==void 0&&t.push(`translateY(${o.y*(1-n)}px)`),o?.x!==void 0&&t.push(`translateX(${o.x*(1-n)}px)`),o?.rotate!==void 0&&t.push(`rotate(${o.rotate*(1-n)}deg)`),o?.scale!==void 0){let e=o.scale+(1-o.scale)*n;t.push(`scale(${e})`);}return t.join(" ")||""}var R={destroy:()=>{},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>0};function ie(n,o={}){if(typeof window>"u")return R;let t=typeof n=="string"?document.querySelector(n):n;if(!t)return b("scrollText: element not found:",n),R;let e=t,{split:c$1="words",stagger:s=.04,easing:i="ease-out",from:l={opacity:0,y:24},trigger:y={},once:T=true,onComplete:m}=o,Y=window.matchMedia("(prefers-reduced-motion: reduce)").matches,_=typeof i=="function"?i:d[i]??d["ease-out"],j=a(y.start??"top 85%"),G=a(y.end??"top 40%"),S=e.innerHTML;e.setAttribute("aria-label",e.textContent??"");let d$2;c$1==="chars"?d$2=K(e):c$1==="lines"?d$2=D(e):d$2=B(e);let U=d$2.length;function V(r,a){l?.opacity!==void 0&&(r.style.opacity=String(l.opacity+(1-l.opacity)*a));let x=Z(a,l);x&&(r.style.transform=x);}function f(r){e.style.setProperty("--scroll-draw-progress",String(r)),d$2.forEach((a,x)=>{let J=_(Q(r,x,U,s));V(a,J);});}if(Y)return f(1),m?.(),{destroy(){e.innerHTML=S,e.removeAttribute("aria-label");},replay:()=>{},pause:()=>{},resume:()=>{},seek:()=>{},getProgress:()=>1};f(0);let C=0,M=0,p=0,w=false,u=false,b$3=-1,g=0,E=false,I=()=>window.scrollY,W=()=>window.innerHeight;function F(){let r=e.getBoundingClientRect(),a=c({top:r.top,height:r.height},I(),W(),j,G);C=a.tStart,M=a.tEnd;}function L(){if(!w||u)return;let r=b$2(I(),C,M,1);T&&(b$3=Math.max(b$3,r),r=b$3),g=r,f(r),r>=1&&!E?(E=true,m?.()):r<1&&!T&&(E=false),p=requestAnimationFrame(L);}F();let P=new IntersectionObserver(r=>{r.forEach(a=>{w=a.isIntersecting,w&&!u?p=requestAnimationFrame(L):cancelAnimationFrame(p);});}),v;function h(){clearTimeout(v),v=setTimeout(()=>{if(c$1==="lines"){let r=g;e.innerHTML=S,e.setAttribute("aria-label",e.textContent??""),d$2=D(e),f(r);}F();},150);}window.addEventListener("resize",h),window.addEventListener("orientationchange",h);let X=d$1([e],h);return P.observe(e),a$1(e,{type:"text",getProgress:()=>g,getTrigger:()=>({tStart:C,tEnd:M})}),{destroy(){cancelAnimationFrame(p),P.disconnect(),window.removeEventListener("resize",h),window.removeEventListener("orientationchange",h),X(),clearTimeout(v),e.innerHTML=S,e.removeAttribute("aria-label"),b$1(e);},replay(){b$3=-1,E=false,g=0,u=false,f(0);},pause(){u=true,cancelAnimationFrame(p);},resume(){u&&(u=false,w&&(p=requestAnimationFrame(L)));},seek(r){let a=Math.min(1,Math.max(0,r));g=a,b$3=a,u=true,cancelAnimationFrame(p),f(a);},getProgress(){return g}}}export{ie as a};