motion-plus-vue 1.2.0 → 1.3.0

package/dist/cjs/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),a=require("motion-v");function ke(o,{locales:t,format:n},r,i){const l=new Intl.NumberFormat(t,n).formatToParts(Number(o));r&&l.unshift({type:"prefix",value:r}),i&&l.push({type:"suffix",value:i});const d=[],g=[],w=[],h=[],u={},m=c=>`${c}:${u[c]=(u[c]??-1)+1}`;let y="",k=!1,x=!1,f=0;for(const c of l){y+=c.value;const p=c.type==="minusSign"||c.type==="plusSign"?"sign":c.type;switch(p){case"integer":k=!0,g.push(...c.value.split("").map(C=>({type:p,value:parseInt(C)})));break;case"group":g.push({type:p,value:c.value});break;case"decimal":x=!0,w.push({type:p,value:c.value,key:m(p),originalIndex:f++});break;case"fraction":w.push(...c.value.split("").map(C=>({type:p,value:parseInt(C),key:m(p),originalIndex:f++})));break;default:(k||x?h:d).push({type:p,value:c.value,key:m(p),originalIndex:f++})}}const v=[];for(let c=g.length-1;c>=0;c--){const p=m(g[c].type);v.unshift({...g[c],key:p,originalIndex:c})}return{pre:d,integer:v,fraction:w,post:h,formatted:y}}const[Se,Be]=a.createContext("SectionContext");function me(){const o={current:!0};return e.onMounted(()=>{o.current=!1}),o}function X(o){const{width:t,fontSize:n}=getComputedStyle(o);return`${parseFloat(t)/parseFloat(n)}em`}const E="var(--mask-height, 0.15em)",U="var(--mask-width, 0.5em)",V=`calc(${U} / var(--invert-x, 1))`,F="#000 0, transparent 71%",Ce=`linear-gradient(to right, transparent 0, #000 ${V}, #000 calc(100% - ${V}), transparent),linear-gradient(to bottom, transparent 0, #000 ${E}, #000 calc(100% - ${E}), transparent 100%),radial-gradient(at bottom right, ${F}),radial-gradient(at bottom left, ${F}), radial-gradient(at top left, ${F}), radial-gradient(at top right, ${F})`,ze=`100% calc(100% - ${E} * 2),calc(100% - ${V} * 2) 100%,${V} ${E},${V} ${E},${V} ${E},${V} ${E}`;a.addScaleCorrector({"--invert-x":{correct:(o,{treeScale:t,projectionDelta:n})=>n.x.scale*t.x}});const oe={display:"flex",flexDirection:"column",alignItems:"center",position:"absolute",width:"100%"};function ye(o){const t=e.ref();function n(i){t.value=i==null?void 0:i.$el}e.watch(()=>o.isPresent,i=>{var s;t.value&&((s=a.mountedStates.get(t.value))==null||s.setActive("exit",!i))});function r(i){var s;i.detail.isExit&&!o.isPresent&&((s=o.onRemove)==null||s.call(o,o.partKey,i.target))}return{root:t,getRoot:n,handleComplete:r}}const be=e.defineComponent({__name:"NumberSymbol",props:{partKey:{},type:{},value:{},isPresent:{type:Boolean},onRemove:{type:Function},style:{},layoutDependency:{},preInitial:{type:Boolean}},setup(o){const t=o,{justify:n}=Se(),{getRoot:r,handleComplete:i}=ye(t);return(s,l)=>(e.openBlock(),e.createBlock(e.unref(a.motion).span,{ref:e.unref(r),layout:"position","layout-dependency":s.layoutDependency,"data-state":s.isPresent?void 0:"exiting",style:e.normalizeStyle({display:"inline-flex",justifyContent:e.unref(n),padding:`calc(${e.unref(E)}/2) 0`,position:"relative",pointerEvents:s.isPresent?void 0:"none"}),"aria-hidden":!s.isPresent,onMotioncomplete:e.unref(i)},{default:e.withCtx(()=>[e.createVNode(e.unref(a.AnimatePresence),{mode:"popLayout","anchor-x":e.unref(n),initial:s.preInitial},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.unref(a.motion).span,{key:s.value,layout:e.unref(n)==="right"?"position":!1,"layout-dependency":s.layoutDependency,initial:{opacity:0,left:e.unref(n)==="right"&&s.preInitial===void 0?"-100%":void 0},animate:{opacity:[null,1],left:0},exit:{opacity:[null,0],transition:{opacity:{duration:.4}}},style:{display:"inline-block",whiteSpace:"pre",position:"relative"}},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(s.value),1)]),_:1},8,["layout","layout-dependency","initial"]))]),_:1},8,["anchor-x","initial"])]),_:1},8,["layout-dependency","data-state","style","aria-hidden","onMotioncomplete"]))}}),Pe=new WeakMap,Ie=e.defineComponent({__name:"NumberDigit",props:{value:{},initialValue:{default:void 0},isPresent:{type:Boolean},partKey:{},onRemove:{},style:{},layoutDependency:{}},setup(o){const t=o,n=t.initialValue??t.value,r=me(),i=a.useMotionConfig(),s=e.ref(),l=e.ref(Array(10).fill(null)),d=e.ref(),{getRoot:g,handleComplete:w,root:h}=ye(t);let u=n;const m=e.ref(n);e.watch([()=>t.value,()=>t.isPresent],([f,v])=>{if(!v)return m.value=0;if(r.current)return e.nextTick(()=>{m.value=f});m.value=f},{immediate:!0});function y(f){var C;if(!s.value||f===u)return;const v=s.value.getBoundingClientRect(),c=(C=h.value)==null?void 0:C.getBoundingClientRect(),p=v.height*(f-u)+(v.top-(c?c.top||0:v.top));a.animate(s.value,{y:[p,0]},i.value.transition)}function k(f){if(r.current&&n===f||!l.value[f])return;const v=X(l.value[f]);h.value&&(Pe.set(h.value,v),h.value.style.width=v),d.value=v}e.watch(m,f=>{k(f)},{immediate:!0,flush:"sync"}),e.watch(m,async(f,v,c)=>{await e.nextTick(),y(f),c(()=>{u=f})},{immediate:!0,flush:"sync"});function x(f){return()=>e.createVNode("span",{key:f,style:{display:"inline-block",padding:`calc(${E}/2) 0`},ref:v=>{l.value[f]=v}},[f])}return(f,v)=>(e.openBlock(),e.createBlock(e.unref(a.motion).span,{ref:e.unref(g),layout:"position","layout-dependency":f.layoutDependency,"data-state":f.isPresent?void 0:"exiting","data-key":f.partKey,style:e.normalizeStyle({display:"inline-flex",justifyContent:"center",width:d.value,pointerEvents:f.isPresent?void 0:"none"}),"aria-hidden":!f.isPresent,onMotioncomplete:e.unref(w)},{default:e.withCtx(()=>[e.createElementVNode("span",{ref_key:"scope",ref:s,style:{display:"inline-flex",justifyContent:"center",flexDirection:"column",alignItems:"center",position:"relative"}},[m.value!==0?(e.openBlock(),e.createElementBlock("span",{key:0,style:e.normalizeStyle({...e.unref(oe),bottom:"100%",left:0})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m.value,c=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(x(c-1)),{key:c-1}))),128))],4)):e.createCommentVNode("",!0),(e.openBlock(),e.createBlock(e.resolveDynamicComponent(x(m.value)))),m.value!==9?(e.openBlock(),e.createElementBlock("span",{key:1,style:e.normalizeStyle({...e.unref(oe),top:"100%",left:0})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(9-m.value,c=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(x(m.value+c)),{key:m.value+c}))),128))],4)):e.createCommentVNode("",!0)],512)]),_:1},8,["layout-dependency","data-state","data-key","style","aria-hidden","onMotioncomplete"]))}}),O=e.defineComponent({__name:"NumberSection",props:{parts:{},justify:{default:"left"},mode:{},name:{},style:{},layoutDependency:{}},setup(o){var h;const t=o,n=e.ref(),r=a.useDomRef(),i=e.ref(),s=me(),l=e.ref(t.parts);let d=t.name==="pre"&&!((h=t.parts)!=null&&h.length)?void 0:!1;e.watch(()=>t.parts,u=>{const m=new Map(u.map(x=>[x.key,{...x,isPresent:!0}])),y=l.value.filter(x=>!m.get(x.key)).map(x=>({...x,isPresent:!1})),k=u.sort((x,f)=>x.originalIndex-f.originalIndex);l.value=y.concat(k)},{flush:"pre"}),e.watch(()=>{var u;return(u=t.parts)==null?void 0:u.map(m=>m.value).join("")},async(u,m)=>{if(await e.nextTick(),d=!1,!i.value)return;if(s.current){r.value&&(r.value.style.width=X(i.value));return}const y=Array.from(i.value.children).map(x=>{if(x instanceof HTMLElement&&x.dataset.state==="exiting"){const f=x.nextSibling;return x.remove(),()=>{i.value&&i.value.insertBefore(x,f)}}}),k=X(i.value);n.value=k;for(let x=y.length-1;x>=0;x--){const f=y[x];f&&f()}},{flush:"post"});const g=e.toRef(t,"justify");Be({justify:g});function w(u,m){var y;l.value=l.value.filter(k=>k.key!==u),(y=m==null?void 0:m.parentElement)==null||y.removeChild(m)}return(u,m)=>(e.openBlock(),e.createBlock(e.unref(a.motion).span,{ref:e.unref(r),class:e.normalizeClass(`number-section-${u.name}`),style:e.normalizeStyle({...u.style,display:"inline-flex",justifyContent:g.value,width:n.value}),layout:"position","layout-dependency":u.layoutDependency},{default:e.withCtx(()=>[e.createElementVNode("span",{ref_key:"measuredRef",ref:i,style:{display:"inline-flex",justifyContent:"inherit",position:"relative"}},[m[0]||(m[0]=e.createTextVNode(" ​ ")),e.createVNode(e.unref(a.AnimatePresence),{mode:u.mode,"anchor-x":g.value,initial:!1},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,y=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:y.key},[y.type==="integer"||y.type==="fraction"?(e.openBlock(),e.createBlock(Ie,{key:y.key,"part-key":y.key,initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},value:y.value,"is-present":y.isPresent??!0,"initial-value":e.unref(s).current?void 0:0,"layout-dependency":u.layoutDependency,onRemove:w},null,8,["part-key","value","is-present","initial-value","layout-dependency"])):(e.openBlock(),e.createBlock(be,{key:y.type==="literal"?`${y.key}:${y.value}`:y.key,type:y.type,"part-key":y.key,initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},value:y.value,"is-present":y.isPresent??!0,"pre-initial":e.unref(d),"layout-dependency":u.layoutDependency,onRemove:w},null,8,["type","part-key","value","is-present","pre-initial","layout-dependency"]))],64))),128))]),_:1},8,["mode","anchor-x"])],512)]),_:1},8,["class","style","layout-dependency"]))}}),Ee=e.defineComponent({__name:"Mask",props:{layoutDependency:{}},setup(o){return(t,n)=>(e.openBlock(),e.createBlock(e.unref(a.motion).span,{layout:"","layout-dependency":t.layoutDependency,"aria-hidden":!0,style:e.normalizeStyle({display:"inline-flex","--invert-x":1,margin:`0 calc(-1*${e.unref(U)})`,padding:`calc(${e.unref(E)}/2) ${e.unref(U)}`,position:"relative",zIndex:-1,overflow:"clip",webkitMaskImage:e.unref(Ce),webkitMaskSize:e.unref(ze),webkitMaskPosition:"center, center, top left, top right, bottom right, bottom left",webkitMaskRepeat:"no-repeat"})},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},8,["layout-dependency","style"]))}}),Te=e.defineComponent({name:"AnimateNumber",inheritAttrs:!1,__name:"AnimateNumber",props:{locales:{},format:{},transition:{},suffix:{},prefix:{},value:{},style:{},layoutDependency:{}},setup(o){const t={opacity:{duration:1,ease:a.easeOut},layout:{type:"spring",duration:1,bounce:0},y:{type:"spring",duration:1,bounce:0}},n=o,r=e.computed(()=>{const g=n.value;return ke(g,{locales:n.locales,format:n.format},n.prefix,n.suffix)}),i=a.useMotionConfig(),s=e.computed(()=>n.transition??i.value.transition??t);function l(){const{format:g,prefix:w,suffix:h,locales:u,value:m,layoutDependency:y,...k}=n;return k}const d=e.computed(()=>{if(n.layoutDependency!==void 0)return{layoutDependency:n.layoutDependency,value:n.value}});return(g,w)=>(e.openBlock(),e.createBlock(e.unref(a.LayoutGroup),null,{default:e.withCtx(()=>[e.createVNode(e.unref(a.MotionConfig),{transition:s.value},{default:e.withCtx(()=>[e.createVNode(e.unref(a.motion).div,e.mergeProps({...g.$attrs,...l()},{layout:"","layout-dependency":d.value,style:{lineHeight:"1",...g.style,display:"inline-flex",isolation:"isolate",whiteSpace:"nowrap"}}),{default:e.withCtx(()=>[e.createVNode(e.unref(a.motion).div,{layout:"","layout-dependency":d.value,"aria-label":r.value.formatted,style:{display:"inline-flex",direction:"ltr",isolation:"isolate",position:"relative",zIndex:-1}},{default:e.withCtx(()=>[e.createVNode(O,{"layout-dependency":d.value,style:e.normalizeStyle({padding:`calc(${e.unref(E)}/2) 0`}),"aria-hidden":!0,justify:"right",mode:"popLayout",parts:r.value.pre,name:"pre"},null,8,["layout-dependency","style","parts"]),e.createVNode(Ee,{"layout-dependency":d.value},{default:e.withCtx(()=>[e.createVNode(O,{"layout-dependency":d.value,justify:"right",parts:r.value.integer,name:"integer",mode:"popLayout"},null,8,["layout-dependency","parts"]),e.createVNode(O,{"layout-dependency":d.value,layout:"position",parts:r.value.fraction,name:"fraction",mode:"popLayout"},null,8,["layout-dependency","parts"])]),_:1},8,["layout-dependency"]),e.createVNode(O,{"layout-dependency":d.value,style:e.normalizeStyle({padding:`calc(${e.unref(E)}/2) 0`}),"aria-hidden":!0,layout:"position",mode:"popLayout",parts:r.value.post,name:"post"},null,8,["layout-dependency","style","parts"])]),_:1},8,["layout-dependency","aria-label"])]),_:1},16,["layout-dependency","style"])]),_:1},8,["transition"])]),_:1}))}}),$e=Te;function Le(){const o=document.createElement("style");return o.textContent=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),r=require("motion-v");function Be(n,{locales:t,format:o},i,l){const s=new Intl.NumberFormat(t,o).formatToParts(Number(n));i&&s.unshift({type:"prefix",value:i}),l&&s.push({type:"suffix",value:l});const c=[],v=[],h=[],x=[],u={},f=m=>`${m}:${u[m]=(u[m]??-1)+1}`;let p="",B=!1,w=!1,y=0;for(const m of s){p+=m.value;const d=m.type==="minusSign"||m.type==="plusSign"?"sign":m.type;switch(d){case"integer":B=!0,v.push(...m.value.split("").map(b=>({type:d,value:parseInt(b)})));break;case"group":v.push({type:d,value:m.value});break;case"decimal":w=!0,h.push({type:d,value:m.value,key:f(d),originalIndex:y++});break;case"fraction":h.push(...m.value.split("").map(b=>({type:d,value:parseInt(b),key:f(d),originalIndex:y++})));break;default:(B||w?x:c).push({type:d,value:m.value,key:f(d),originalIndex:y++})}}const k=[];for(let m=v.length-1;m>=0;m--){const d=f(v[m].type);k.unshift({...v[m],key:d,originalIndex:m})}return{pre:c,integer:k,fraction:h,post:x,formatted:p}}const[Ce,be]=r.createContext("SectionContext");function ve(){const n={current:!0};return e.onMounted(()=>{n.current=!1}),n}function G(n){const{width:t,fontSize:o}=getComputedStyle(n);return`${parseFloat(t)/parseFloat(o)}em`}const T="var(--mask-height, 0.15em)",U="var(--mask-width, 0.5em)",O=`calc(${U} / var(--invert-x, 1))`,j="#000 0, transparent 71%",Se=`linear-gradient(to right, transparent 0, #000 ${O}, #000 calc(100% - ${O}), transparent),linear-gradient(to bottom, transparent 0, #000 ${T}, #000 calc(100% - ${T}), transparent 100%),radial-gradient(at bottom right, ${j}),radial-gradient(at bottom left, ${j}), radial-gradient(at top left, ${j}), radial-gradient(at top right, ${j})`,Ie=`100% calc(100% - ${T} * 2),calc(100% - ${O} * 2) 100%,${O} ${T},${O} ${T},${O} ${T},${O} ${T}`;r.addScaleCorrector({"--invert-x":{correct:(n,{treeScale:t,projectionDelta:o})=>o.x.scale*t.x}});const ae={display:"flex",flexDirection:"column",alignItems:"center",position:"absolute",width:"100%"};function ge(n){const t=e.ref();function o(l){t.value=l==null?void 0:l.$el}e.watch(()=>n.isPresent,l=>{var a;t.value&&((a=r.mountedStates.get(t.value))==null||a.setActive("exit",!l))});function i(l){var a;l.detail.isExit&&!n.isPresent&&((a=n.onRemove)==null||a.call(n,n.partKey,l.target))}return{root:t,getRoot:o,handleComplete:i}}const Le=e.defineComponent({__name:"NumberSymbol",props:{partKey:{},type:{},value:{},isPresent:{type:Boolean},onRemove:{type:Function},style:{},layoutDependency:{},preInitial:{type:Boolean}},setup(n){const t=n,{justify:o}=Ce(),{getRoot:i,handleComplete:l}=ge(t);return(a,s)=>(e.openBlock(),e.createBlock(e.unref(r.motion).span,{ref:e.unref(i),layout:"position","layout-dependency":a.layoutDependency,"data-state":a.isPresent?void 0:"exiting",style:e.normalizeStyle({display:"inline-flex",justifyContent:e.unref(o),padding:`calc(${e.unref(T)}/2) 0`,position:"relative",pointerEvents:a.isPresent?void 0:"none"}),"aria-hidden":!a.isPresent,onMotioncomplete:e.unref(l)},{default:e.withCtx(()=>[e.createVNode(e.unref(r.AnimatePresence),{mode:"popLayout","anchor-x":e.unref(o),initial:a.preInitial},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.unref(r.motion).span,{key:a.value,layout:e.unref(o)==="right"?"position":!1,"layout-dependency":a.layoutDependency,initial:{opacity:0,left:e.unref(o)==="right"&&a.preInitial===void 0?"-100%":void 0},animate:{opacity:[null,1],left:0},exit:{opacity:[null,0],transition:{opacity:{duration:.4}}},style:{display:"inline-block",whiteSpace:"pre",position:"relative"}},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.value),1)]),_:1},8,["layout","layout-dependency","initial"]))]),_:1},8,["anchor-x","initial"])]),_:1},8,["layout-dependency","data-state","style","aria-hidden","onMotioncomplete"]))}}),ze=new WeakMap,Ee=e.defineComponent({__name:"NumberDigit",props:{value:{},initialValue:{default:void 0},isPresent:{type:Boolean},partKey:{},onRemove:{},style:{},layoutDependency:{}},setup(n){const t=n,o=t.initialValue??t.value,i=ve(),l=r.useMotionConfig(),a=e.ref(),s=e.ref(Array(10).fill(null)),c=e.ref(),{getRoot:v,handleComplete:h,root:x}=ge(t);let u=o;const f=e.ref(o);e.watch([()=>t.value,()=>t.isPresent],([y,k])=>{if(!k)return f.value=0;if(i.current)return e.nextTick(()=>{f.value=y});f.value=y},{immediate:!0});function p(y){var b;if(!a.value||y===u)return;const k=a.value.getBoundingClientRect(),m=(b=x.value)==null?void 0:b.getBoundingClientRect(),d=k.height*(y-u)+(k.top-(m?m.top||0:k.top));r.animate(a.value,{y:[d,0]},l.value.transition)}function B(y){if(i.current&&o===y||!s.value[y])return;const k=G(s.value[y]);x.value&&(ze.set(x.value,k),x.value.style.width=k),c.value=k}e.watch(f,y=>{B(y)},{immediate:!0,flush:"sync"}),e.watch(f,async(y,k,m)=>{await e.nextTick(),p(y),m(()=>{u=y})},{immediate:!0,flush:"sync"});function w(y){return()=>e.createVNode("span",{key:y,style:{display:"inline-block",padding:`calc(${T}/2) 0`},ref:k=>{s.value[y]=k}},[y])}return(y,k)=>(e.openBlock(),e.createBlock(e.unref(r.motion).span,{ref:e.unref(v),layout:"position","layout-dependency":y.layoutDependency,"data-state":y.isPresent?void 0:"exiting","data-key":y.partKey,style:e.normalizeStyle({display:"inline-flex",justifyContent:"center",width:c.value,pointerEvents:y.isPresent?void 0:"none"}),"aria-hidden":!y.isPresent,onMotioncomplete:e.unref(h)},{default:e.withCtx(()=>[e.createElementVNode("span",{ref_key:"scope",ref:a,style:{display:"inline-flex",justifyContent:"center",flexDirection:"column",alignItems:"center",position:"relative"}},[f.value!==0?(e.openBlock(),e.createElementBlock("span",{key:0,style:e.normalizeStyle({...e.unref(ae),bottom:"100%",left:0})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,m=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(w(m-1)),{key:m-1}))),128))],4)):e.createCommentVNode("",!0),(e.openBlock(),e.createBlock(e.resolveDynamicComponent(w(f.value)))),f.value!==9?(e.openBlock(),e.createElementBlock("span",{key:1,style:e.normalizeStyle({...e.unref(ae),top:"100%",left:0})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(9-f.value,m=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(w(f.value+m)),{key:f.value+m}))),128))],4)):e.createCommentVNode("",!0)],512)]),_:1},8,["layout-dependency","data-state","data-key","style","aria-hidden","onMotioncomplete"]))}}),H=e.defineComponent({__name:"NumberSection",props:{parts:{},justify:{default:"left"},mode:{},name:{},style:{},layoutDependency:{}},setup(n){var x;const t=n,o=e.ref(),i=r.useDomRef(),l=e.ref(),a=ve(),s=e.ref(t.parts);let c=t.name==="pre"&&!((x=t.parts)!=null&&x.length)?void 0:!1;e.watch(()=>t.parts,u=>{const f=new Map(u.map(w=>[w.key,{...w,isPresent:!0}])),p=s.value.filter(w=>!f.get(w.key)).map(w=>({...w,isPresent:!1})),B=u.sort((w,y)=>w.originalIndex-y.originalIndex);s.value=p.concat(B)},{flush:"pre"}),e.watch(()=>{var u;return(u=t.parts)==null?void 0:u.map(f=>f.value).join("")},async(u,f)=>{if(await e.nextTick(),c=!1,!l.value)return;if(a.current){i.value&&(i.value.style.width=G(l.value));return}const p=Array.from(l.value.children).map(w=>{if(w instanceof HTMLElement&&w.dataset.state==="exiting"){const y=w.nextSibling;return w.remove(),()=>{l.value&&l.value.insertBefore(w,y)}}}),B=G(l.value);o.value=B;for(let w=p.length-1;w>=0;w--){const y=p[w];y&&y()}},{flush:"post"});const v=e.toRef(t,"justify");be({justify:v});function h(u,f){var p;s.value=s.value.filter(B=>B.key!==u),(p=f==null?void 0:f.parentElement)==null||p.removeChild(f)}return(u,f)=>(e.openBlock(),e.createBlock(e.unref(r.motion).span,{ref:e.unref(i),class:e.normalizeClass(`number-section-${u.name}`),style:e.normalizeStyle({...u.style,display:"inline-flex",justifyContent:v.value,width:o.value}),layout:"position","layout-dependency":u.layoutDependency},{default:e.withCtx(()=>[e.createElementVNode("span",{ref_key:"measuredRef",ref:l,style:{display:"inline-flex",justifyContent:"inherit",position:"relative"}},[f[0]||(f[0]=e.createTextVNode(" ​ ")),e.createVNode(e.unref(r.AnimatePresence),{mode:u.mode,"anchor-x":v.value,initial:!1},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,p=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:p.key},[p.type==="integer"||p.type==="fraction"?(e.openBlock(),e.createBlock(Ee,{key:p.key,"part-key":p.key,initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},value:p.value,"is-present":p.isPresent??!0,"initial-value":e.unref(a).current?void 0:0,"layout-dependency":u.layoutDependency,onRemove:h},null,8,["part-key","value","is-present","initial-value","layout-dependency"])):(e.openBlock(),e.createBlock(Le,{key:p.type==="literal"?`${p.key}:${p.value}`:p.key,type:p.type,"part-key":p.key,initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},value:p.value,"is-present":p.isPresent??!0,"pre-initial":e.unref(c),"layout-dependency":u.layoutDependency,onRemove:h},null,8,["type","part-key","value","is-present","pre-initial","layout-dependency"]))],64))),128))]),_:1},8,["mode","anchor-x"])],512)]),_:1},8,["class","style","layout-dependency"]))}}),Pe=e.defineComponent({__name:"Mask",props:{layoutDependency:{}},setup(n){return(t,o)=>(e.openBlock(),e.createBlock(e.unref(r.motion).span,{layout:"","layout-dependency":t.layoutDependency,"aria-hidden":!0,style:e.normalizeStyle({display:"inline-flex","--invert-x":1,margin:`0 calc(-1*${e.unref(U)})`,padding:`calc(${e.unref(T)}/2) ${e.unref(U)}`,position:"relative",zIndex:-1,overflow:"clip",webkitMaskImage:e.unref(Se),webkitMaskSize:e.unref(Ie),webkitMaskPosition:"center, center, top left, top right, bottom right, bottom left",webkitMaskRepeat:"no-repeat"})},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},8,["layout-dependency","style"]))}}),Te=e.defineComponent({name:"AnimateNumber",inheritAttrs:!1,__name:"AnimateNumber",props:{locales:{},format:{},transition:{},suffix:{},prefix:{},value:{},style:{},layoutDependency:{}},setup(n){const t={opacity:{duration:1,ease:r.easeOut},layout:{type:"spring",duration:1,bounce:0},y:{type:"spring",duration:1,bounce:0}},o=n,i=e.computed(()=>{const v=o.value;return Be(v,{locales:o.locales,format:o.format},o.prefix,o.suffix)}),l=r.useMotionConfig(),a=e.computed(()=>o.transition??l.value.transition??t);function s(){const{format:v,prefix:h,suffix:x,locales:u,value:f,layoutDependency:p,...B}=o;return B}const c=e.computed(()=>{if(o.layoutDependency!==void 0)return{layoutDependency:o.layoutDependency,value:o.value}});return(v,h)=>(e.openBlock(),e.createBlock(e.unref(r.LayoutGroup),null,{default:e.withCtx(()=>[e.createVNode(e.unref(r.MotionConfig),{transition:a.value},{default:e.withCtx(()=>[e.createVNode(e.unref(r.motion).div,e.mergeProps({...v.$attrs,...s()},{layout:"","layout-dependency":c.value,style:{lineHeight:"1",...v.style,display:"inline-flex",isolation:"isolate",whiteSpace:"nowrap"}}),{default:e.withCtx(()=>[e.createVNode(e.unref(r.motion).div,{layout:"","layout-dependency":c.value,"aria-label":i.value.formatted,style:{display:"inline-flex",direction:"ltr",isolation:"isolate",position:"relative",zIndex:-1}},{default:e.withCtx(()=>[e.createVNode(H,{"layout-dependency":c.value,style:e.normalizeStyle({padding:`calc(${e.unref(T)}/2) 0`}),"aria-hidden":!0,justify:"right",mode:"popLayout",parts:i.value.pre,name:"pre"},null,8,["layout-dependency","style","parts"]),e.createVNode(Pe,{"layout-dependency":c.value},{default:e.withCtx(()=>[e.createVNode(H,{"layout-dependency":c.value,justify:"right",parts:i.value.integer,name:"integer",mode:"popLayout"},null,8,["layout-dependency","parts"]),e.createVNode(H,{"layout-dependency":c.value,layout:"position",parts:i.value.fraction,name:"fraction",mode:"popLayout"},null,8,["layout-dependency","parts"])]),_:1},8,["layout-dependency"]),e.createVNode(H,{"layout-dependency":c.value,style:e.normalizeStyle({padding:`calc(${e.unref(T)}/2) 0`}),"aria-hidden":!0,layout:"position",mode:"popLayout",parts:i.value.post,name:"post"},null,8,["layout-dependency","style","parts"])]),_:1},8,["layout-dependency","aria-label"])]),_:1},16,["layout-dependency","style"])]),_:1},8,["transition"])]),_:1}))}}),$e=Te;function Me(){const n=document.createElement("style");return n.textContent=`
       * {
           cursor: none !important;
       }
@@ -6,4 +6,4 @@
       [data-motion-cursor="pointer"] {
           background-color: #333;
       }
-    `,document.head.appendChild(o),()=>{document.head.removeChild(o)}}function Me(o){e.watch(o,(t,n,r)=>{const i=t?Le():a.noop;return r(()=>{i()})},{immediate:!0,flush:"post"})}function q(o){return t=>{t.pointerType==="mouse"&&o(t)}}function ie(o){return q(t=>{t.button===0&&o(t)})}let A,Y;function Ve(){A=a.motionValue(0),Y=a.motionValue(0);let o=0,t=0;function n(){A.set(o),Y.set(t)}typeof window<"u"&&window.addEventListener("pointermove",q(r=>{o=r.clientX,t=r.clientY,a.frame.update(n)}))}function G(){return A||Ve(),{x:A,y:Y}}function Re(o,t){return{x:a.useTransform(()=>o.x.get()+t.value.x),y:a.useTransform(()=>o.y.get()+t.value.y)}}function De(o){return o.closest("[data-cursor]")}function Ne(o){return o.closest('a, button, input[type="button"]:not(:disabled)')}function Fe(o){return window.getComputedStyle(o).userSelect==="none"?null:o.closest("p, textarea:not(:disabled), input[type='text']:not(:disabled), h1, h2, h3, h4, h5, h6")}function Oe(o){let t=De(o);return t?[t.dataset.cursor,t]:(t=Ne(o),t?["pointer",t]:(t=Fe(o),t?["text",t]:["default",null]))}let K=null,I={type:"default",isPressed:!1,fontSize:null,targetBoundingBox:null,target:null,zone:null};function _e(o){let t=null;if("closest"in o){const n=o.closest("[data-cursor-zone]");n instanceof HTMLElement&&(t=n.dataset.cursorZone||null)}return t}function Ae(){if(typeof window>"u")return{onChange:()=>()=>{}};const o=new Set;function t(d){I={...I,...d},o.forEach(g=>g(I))}const n=ie(()=>{I.isPressed||t({isPressed:!0})}),r=ie(()=>{I.isPressed&&t({isPressed:!1})}),i=q(({target:d})=>{if(!d)return;const[g,w]=Oe(d);let h=!1;const u={target:w,zone:_e(d)};g!==I.type&&(u.type=g,h=!0),u.zone!==I.zone&&(I.zone=u.zone,h=!0);const m=g==="pointer"&&w?w.getBoundingClientRect():null;if(m!==I.targetBoundingBox&&(u.targetBoundingBox=m,h=!0),g==="text"){const{fontSize:y}=window.getComputedStyle(d),k=y?parseInt(y):null;k!==I.fontSize&&(u.fontSize=k,h=!0)}else I.fontSize&&(u.fontSize=null,h=!0);h&&t(u)});function s(){typeof window>"u"||(window.addEventListener("pointerover",i),window.addEventListener("pointerdown",n),window.addEventListener("pointerup",r))}function l(){window.removeEventListener("pointerover",i),window.removeEventListener("pointerdown",n),window.removeEventListener("pointerup",r)}return{onChange:d=>(o.size||s(),o.add(d),()=>{o.delete(d),o.size||l()})}}function je(){return K||(K=Ae()),K}function Z(){const o=e.ref({...I});return e.watch(o,()=>je().onChange(t=>{o.value=t}),{immediate:!0,flush:"post"}),o}let W=null;function He(){const o=new Set;function t(){o.forEach(s=>s.show())}function n(){o.forEach(s=>s.hide())}function r(){document.body.addEventListener("mouseenter",t),document.body.addEventListener("mouseleave",n)}function i(){document.body.removeEventListener("mouseenter",t),document.body.removeEventListener("mouseleave",n)}return{on:s=>typeof window>"u"?a.noop:(o.size||r(),o.add(s),()=>{o.delete(s),o.size===0&&i()})}}function Ke(){return W||(W=He()),W}function ve(o){const t=e.ref(!0);return e.watch(t,()=>Ke().on({show:()=>{t.value||(o(),t.value=!0)},hide:()=>t.value=!1}),{immediate:!0}),t}const re={x:0,y:0},We={x:.5,y:.5},Xe={duration:0},Ue={stiffness:1e3,damping:100},Ye={duration:.15,ease:[.38,.12,.29,1]},ae={magneticOptions:{morph:!0,padding:5,snap:.8}},se=17,ue=31,le=4,qe=20;function _(o,t,n){const r={width:(n==null?void 0:n.width)??o,height:(n==null?void 0:n.height)??t};return typeof r.width=="number"&&(r.width=`${r.width}px`),typeof r.height=="number"&&(r.height=`${r.height}px`),r}function Ge({type:o,state:t,hasChildren:n,style:r,isMagnetic:i,magneticOptions:s,matchTextSize:l}){const d=i&&t.targetBoundingBox;if(n&&!d)return _("auto","auto",r);const{padding:g,morph:w}=s;switch(o){case"pointer":if(i&&w&&t.targetBoundingBox){const{width:h,height:u}=t.targetBoundingBox;return{width:`${h+g*2}px`,height:`${u+g*2}px`}}return _(ue,ue,r);case"text":return l&&t.fontSize?{width:`${le}px`,height:`${t.fontSize}px`}:_(le,qe,r);default:return _(se,se,r)}}function Ze({x:o,y:t},n){const r=e.ref(o.prev!==void 0||t.prev!==void 0);return e.watch(r,()=>{if(r.value)return;const i=()=>{r.value=!0,n(),s()},s=a.pipe(o.on("change",i),t.on("change",i));return()=>s()},{immediate:!0}),r}function Je(o,t,n){return a.useTransform(()=>a.mix(o.value.get(),t.get(),n.get()))}function ce(o,t,n){const r=a.useSpring(0,{stiffness:600,damping:50}),i=a.useMotionValue(0),s=Je(o,r,i);return e.watch(()=>n==null?void 0:n.value,(l,d)=>{l?(!d&&!i.isAnimating()?r.jump(l):r.set(l),a.animate(i,t.value||0)):a.animate(i,0)},{immediate:!0,flush:"sync"}),s}function Qe(o,t,n,r){const i=ce(e.computed(()=>o.value.x),r,e.computed(()=>n.value.targetBoundingBox?n.value.targetBoundingBox.left+n.value.targetBoundingBox.width/2:void 0)),s=ce(e.computed(()=>o.value.y),r,e.computed(()=>n.value.targetBoundingBox?n.value.targetBoundingBox.top+n.value.targetBoundingBox.height/2:void 0));return e.computed(()=>t.value?{x:i,y:s}:o.value)}const et=e.defineComponent({name:"Cursor",inheritAttrs:!1,__name:"Cursor",props:{follow:{type:Boolean,default:!1},center:{default:({follow:o})=>o?re:We},offset:{default:()=>re},spring:{type:[Boolean,Object],default:({follow:o})=>o?Ue:!1},matchTextSize:{type:Boolean,default:!0},magnetic:{type:[Boolean,Object],default:!1},transition:{},variants:{},style:{},show:{type:Boolean,default:!0}},setup(o){const t=o,{offset:n,magnetic:r}=e.toRefs(t),i=a.useReducedMotion();Me(()=>!i.value&&!t.follow);const s=G(),l=Re(s,n),d=a.useSpring(l.x,t.spring||void 0),g=a.useSpring(l.y,t.spring||void 0),w=e.computed(()=>typeof t.magnetic=="object"?{...ae.magneticOptions,...t.magnetic}:ae.magneticOptions);function h(){const p=l.x.on("change",b=>{d.jump(b),p()}),C=l.y.on("change",b=>{g.jump(b),C()})}const u=Z(),m=ve(h),y=Qe(e.computed(()=>t.spring?{x:d,y:g}:s),e.computed(()=>!!r.value),u,e.computed(()=>w.value&&w.value.snap)),k=e.useSlots(),x=e.computed(()=>{var b,T;const p=(T=(b=k.default)==null?void 0:b.call(k))==null?void 0:T.filter($=>$.type!==Symbol.for("v-cmt"));return Ge({type:u.value.type,state:u.value,hasChildren:!!(p!=null&&p.length),isMagnetic:!!t.magnetic,style:t.style,magneticOptions:w.value,matchTextSize:t.matchTextSize})}),f=Ze(s,h);function v(p){return(C,b)=>`translate(-${p.x*100}%, -${p.y*100}%) ${b}`}function c(){const{follow:p,center:C,offset:b,spring:T,matchTextSize:$,magnetic:R,...B}=t;return B}return(p,C)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body"},[e.unref(f)?(e.openBlock(),e.createBlock(e.unref(a.LayoutGroup),{key:0},{default:e.withCtx(()=>[e.createVNode(e.unref(a.MotionConfig),{transition:e.unref(i)?e.unref(Xe):p.transition||e.unref(Ye)},{default:e.withCtx(()=>{var b,T;return[e.createVNode(e.unref(a.motion).div,e.mergeProps({layout:"","data-motion-cursor":p.follow?"follow":"pointer","data-framer-portal-id":"motion-cursor",initial:"exit",exit:"exit"},{...p.$attrs,...c()},{variants:{pressed:p.follow?{}:{scale:.9},...p.variants,default:{opacity:1,scale:1,...(b=p.variants)==null?void 0:b.default},exit:{opacity:0,scale:0,...(T=p.variants)==null?void 0:T.exit}},animate:["default",e.unref(u).type,e.unref(r)&&e.unref(u).targetBoundingBox?"magnetic":"",!e.unref(m)||!p.show?"exit":e.unref(u).isPressed?"pressed":""],"transform-template":v(p.center),style:{borderRadius:p.follow?0:20,zIndex:p.follow?99998:99999,willChange:"transform",contain:"layout",originX:p.center.x,originY:p.center.y,...p.style,width:x.value.width,height:x.value.height,x:e.unref(y).x,y:e.unref(y).y,top:0,left:0,position:"fixed",pointerEvents:"none"}}),{default:e.withCtx(()=>[e.createVNode(e.unref(a.AnimatePresence),null,{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3})]),_:3},16,["data-motion-cursor","variants","animate","transform-template","style"])]}),_:3},8,["transition"])]),_:3})):e.createCommentVNode("",!0)]))}});function de(o,t,n){const r=a.useMotionValue(0),i=a.useMotionValue(0),s=a.useMotionValue(0);return e.watch(()=>n==null?void 0:n.value,l=>{if(typeof l=="number"){a.animate(s,1);const d=()=>{i.set(t*(o.get()-l))};return d(),o.on("change",d)}else a.animate(s,0)},{immediate:!0,flush:"post"}),a.useTransform(()=>a.mix(r.get(),i.get(),s.get()))}function tt(o,t=.1){const n=Z(),r=G(),i=e.computed(()=>n.value.targetBoundingBox&&n.value.target===o.value),s=de(r.x,t,e.computed(()=>i.value?n.value.targetBoundingBox.left+n.value.targetBoundingBox.width/2:void 0)),l=de(r.y,t,e.computed(()=>i.value?n.value.targetBoundingBox.top+n.value.targetBoundingBox.height/2:void 0));return{x:s,y:l}}const[nt,ot]=a.createContext("TickerItemContext"),fe=e.defineComponent({__name:"TickerItem",props:{offset:{},axis:{},listSize:{},containerPaddingStart:{},bounds:{},itemIndex:{},cloneIndex:{}},setup(o){const t=o,n=a.useMotionValue(0);a.useTransform(()=>{const i=t.offset.get(),{start:s,end:l}=t.bounds;return!s&&!l||!t.listSize?n.set(0):i+l<=-t.containerPaddingStart?n.set(t.listSize):n.set(0)});const r=a.useMotionValue(0);return a.useTransform(()=>{const{offset:i,listSize:s,bounds:l}=t,{start:d,end:g}=l,w=i.get(),h=n.get();return!d&&!g||!s?r.set(0):r.set(w+d+h)}),ot({offset:r}),(i,s)=>(e.openBlock(),e.createBlock(e.unref(a.motion).li,e.mergeProps(i.$attrs,{class:i.cloneIndex===void 0?"ticker-item":"clone-item","aria-hidden":i.cloneIndex!==void 0?!0:void 0,style:{flexShrink:0,flexGrow:0,x:i.axis==="x"?e.unref(n):0,y:i.axis==="y"?e.unref(n):0}}),{default:e.withCtx(()=>[e.renderSlot(i.$slots,"default")]),_:3},16,["class","aria-hidden","style"]))}});function ge(o,t,n){let r=!1;e.onMounted(()=>{const i=o.value;if(!i)return;const s=t.value==="x"?"scrollLeft":"scrollTop",l=t.value==="x"?"offsetLeft":"offsetTop",d=t.value==="x"?"ArrowLeft":"ArrowUp",g=t.value==="x"?"ArrowRight":"ArrowDown";let w=[],h=0;const u=()=>{const v=w[h];v.focus(),n.set(-v[l]),i[s]=0,a.frame.render(()=>{i[s]=0})},m=v=>{if(v.key==="Tab"){v.preventDefault(),x();const c=Array.from(document.querySelectorAll('a, button, input, textarea, select, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]')).filter(a.isHTMLElement);c.sort(it);const p=c[v.shiftKey?0:c.length-1],C=v.shiftKey?c.length-1:0;if(i.contains(p)){c[C].focus();return}else{const b=c.indexOf(w[h]),T=v.shiftKey?-1:1;for(let $=b;$<c.length&&$>=0;$+=T){const R=c[$];if(!i.contains(R)){R.focus();return}}}return}else v.key===d?h--:v.key===g&&h++;h=a.wrap(0,w.length,h),u()},y=()=>{r||(r=!0,w=Array.from(i.querySelectorAll('.ticker-item a, .ticker-item button, .ticker-item input, .ticker-item textarea, .ticker-item select, .ticker-item [tabindex]:not([tabindex="-1"]), .ticker-item [contenteditable="true"]')).filter(a.isHTMLElement),h=0,u(),window.addEventListener("focus",k,!0),window.addEventListener("blur",k,!0),i.addEventListener("keydown",m))},k=v=>{(!v.target||!(v.target instanceof HTMLElement)||!i.contains(v.target))&&x()},x=()=>{r&&(r=!1,window.removeEventListener("focus",k,!0),window.removeEventListener("blur",k,!0),i.removeEventListener("keydown",m))},f=v=>{const{target:c}=v;a.isHTMLElement(c)&&(r||y())};i.addEventListener("focus",f,!0),e.onUnmounted(()=>{i.removeEventListener("focus",f),x()})})}function it(o,t){return o.tabIndex>=1&&t.tabIndex>=1?o.tabIndex-t.tabIndex:o.tabIndex>=1&&t.tabIndex<=0?-1:t.tabIndex>=1&&o.tabIndex<=0?1:0}const pe={start:0,end:0};function he(o=[]){const t=[];for(const n of o)n.type!==e.Comment&&(n.type===e.Fragment&&Array.isArray(n.children)?t.push(...he(n.children)):t.push(n));return t}function rt(o){return typeof o=="function"||Object.prototype.toString.call(o)==="[object Object]"&&!e.isVNode(o)}const at=e.defineComponent({__name:"Ticker",props:{axis:{default:"x"},style:{},velocity:{default:50},hoverFactor:{default:1},gap:{default:10},align:{default:"center"},offset:{}},setup(o){const t=o,n=e.reactive({listSize:0,containerSize:0,containerPaddingStart:0,containerPaddingEnd:0,itemSizes:[]}),r=e.ref(!1),i=a.useMotionValue(1),s=a.useMotionValue(0),l=e.computed(()=>t.offset??s),d=a.useMotionValue(0);a.useTransform(()=>(d.set(a.wrap(-n.listSize-t.gap-n.containerPaddingStart,-n.containerPaddingStart,l.value.get())),d.get()));const g=a.useMotionValue(0),w=e.computed(()=>r.value?g:d),h=e.computed(()=>t.align==="start"?"flex-start":t.align==="center"?"center":"flex-end"),u=a.useDomRef(),m=a.useDomRef(),y=a.useInView(u,{margin:"100px"}),k=a.useReducedMotion();function x(){if(!u.value||!m.value)return;const{axis:B}=t,S=B==="x"?"offsetWidth":"offsetHeight",z=B==="x"?"offsetLeft":"offsetTop",P=B==="x"?"paddingLeft":"paddingTop",D=B==="x"?"paddingRight":"paddingBottom",N=u.value,j=m.value.querySelectorAll(".ticker-item");if(!j.length)return;let Q=!1;const M=[];for(let L=0;L<j.length;L++){const H=j[L];M.push({start:H[z],end:H[z]+H[S]}),(!n.itemSizes[L]||M[L].start!==n.itemSizes[L].start||M[L].end!==n.itemSizes[L].end)&&(Q=!0)}const ee=N[S],te=M[M.length-1].end-M[0].start,ne=window.getComputedStyle(N),xe=parseInt(ne[P]??0),we=parseInt(ne[D]??0);(te!==n.listSize||ee!==n.containerSize||Q)&&(n.listSize=te,n.containerSize=ee,n.containerPaddingStart=xe,n.containerPaddingEnd=we,n.itemSizes=M)}const f=e.useSlots(),v=e.computed(()=>{var B;return he((B=f.default)==null?void 0:B.call(f))});e.watch([v,y,u],(B,S,z)=>{if(!y.value||!u.value)return;x();const P=a.resize(u.value,x);z(P)},{immediate:!0,flush:"sync"});const c=e.computed(()=>n.containerSize>0&&n.listSize>0);a.useAnimationFrame((B,S)=>{if(c.value&&y.value&&l.value===s&&!k.value){const z=S/1e3*(t.velocity*i.get());l.value.set(l.value.get()-z)}});const p=e.computed(()=>{let B=0;if(!c.value||!n.containerSize)return 0;let S=0;const z=Math.max(...n.itemSizes.map(P=>P.end-P.start));for(;S<n.containerSize+n.containerPaddingStart;)S=(n.listSize+t.gap)*(B+1)-z,B++;return Math.max(B-1,0)}),C=e.computed(()=>n.listSize===0?0:(n.listSize+t.gap)*(p.value+1)),b=e.computed(()=>{const B=[];for(let S=0;S<p.value;S++)v.value.forEach((z,P)=>{const D=n.itemSizes[P],N=(n.listSize+t.gap)*(S+1),J=D?{start:D.start+N,end:D.end+N}:pe;B.push(e.createVNode(fe,{key:`clone-${S}-${P}`,offset:w.value,axis:t.axis,listSize:C.value,cloneIndex:P,bounds:J,containerPaddingStart:n.containerPaddingStart},rt(z)?z:{default:()=>[z]}))});return B}),T=e.toRef(t,"axis");ge(u,T,g);const $={display:"flex",position:"relative",overflow:"hidden"},R=e.computed(()=>({display:"flex",position:"relative",willChange:"transform",listStyleType:"none",padding:0,margin:0,justifyContent:"flex-start",flexDirection:t.axis==="x"?"row":"column",gap:`${t.gap}px`,alignItems:h.value,x:t.axis==="x"?w.value:0,y:t.axis==="y"?w.value:0,opacity:c.value?1:0}));return(B,S)=>(e.openBlock(),e.createBlock(e.unref(a.motion).div,e.mergeProps({...B.$attrs},{ref_key:"containerRef",ref:u,"data-size":n.listSize,style:{...$,...t.style},onFocusCapture:S[0]||(S[0]=()=>{r.value=!0}),onBlurCapture:S[1]||(S[1]=()=>{r.value=!1,l.value.set(e.unref(g).get())}),onPointerenter:S[2]||(S[2]=()=>{e.unref(a.animate)(e.unref(i),B.hoverFactor)}),onPointerleave:S[3]||(S[3]=()=>{e.unref(a.animate)(e.unref(i),1)})}),{default:e.withCtx(()=>[e.createVNode(e.unref(a.motion).ul,{ref_key:"listRef",ref:m,style:e.normalizeStyle(R.value)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(z,P)=>(e.openBlock(),e.createBlock(fe,{key:`original-${P}`,axis:T.value,offset:w.value,"list-size":C.value,"item-index":P,bounds:n.itemSizes[P]??e.unref(pe),"container-padding-start":n.containerPaddingStart},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(z),{index:P},null,8,["index"]))]),_:2},1032,["axis","offset","list-size","item-index","bounds","container-padding-start"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(b.value,z=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(z),{key:z.key}))),128))]),_:1},8,["style"])]),_:1},16,["data-size","style"]))}});function st(){const o=nt(null);return a.invariant(!!o,"useItemOffset must be used within a TickerItem"),o==null?void 0:o.offset}const ut=at;exports.AnimateNumber=$e;exports.Cursor=et;exports.Ticker=ut;exports.useCursorIsInView=ve;exports.useCursorState=Z;exports.useItemOffset=st;exports.useKeyboardFocus=ge;exports.useMagneticPull=tt;exports.usePointerPosition=G;
+    `,document.head.appendChild(n),()=>{document.head.removeChild(n)}}function Ve(n){e.watch(n,(t,o,i)=>{const l=t?Me():r.noop;return i(()=>{l()})},{immediate:!0,flush:"post"})}function ee(n){return t=>{t.pointerType==="mouse"&&n(t)}}function se(n){return ee(t=>{t.button===0&&n(t)})}let K,Z;function Ne(){K=r.motionValue(0),Z=r.motionValue(0);let n=0,t=0;function o(){K.set(n),Z.set(t)}typeof window<"u"&&window.addEventListener("pointermove",ee(i=>{n=i.clientX,t=i.clientY,r.frame.update(o)}))}function te(){return K||Ne(),{x:K,y:Z}}function Re(n,t){return{x:r.useTransform(()=>n.x.get()+t.value.x),y:r.useTransform(()=>n.y.get()+t.value.y)}}function De(n){return n.closest("[data-cursor]")}function Oe(n){return n.closest('a, button, input[type="button"]:not(:disabled)')}function Ae(n){return window.getComputedStyle(n).userSelect==="none"?null:n.closest("p, textarea:not(:disabled), input[type='text']:not(:disabled), h1, h2, h3, h4, h5, h6")}function Fe(n){let t=De(n);return t?[t.dataset.cursor,t]:(t=Oe(n),t?["pointer",t]:(t=Ae(n),t?["text",t]:["default",null]))}let Y=null,P={type:"default",isPressed:!1,fontSize:null,targetBoundingBox:null,target:null,zone:null};function _e(n){let t=null;if("closest"in n){const o=n.closest("[data-cursor-zone]");o instanceof HTMLElement&&(t=o.dataset.cursorZone||null)}return t}function je(){if(typeof window>"u")return{onChange:()=>()=>{}};const n=new Set;function t(c){P={...P,...c},n.forEach(v=>v(P))}const o=se(()=>{P.isPressed||t({isPressed:!0})}),i=se(()=>{P.isPressed&&t({isPressed:!1})}),l=ee(({target:c})=>{if(!c)return;const[v,h]=Fe(c);let x=!1;const u={target:h,zone:_e(c)};v!==P.type&&(u.type=v,x=!0),u.zone!==P.zone&&(P.zone=u.zone,x=!0);const f=v==="pointer"&&h?h.getBoundingClientRect():null;if(f!==P.targetBoundingBox&&(u.targetBoundingBox=f,x=!0),v==="text"){const{fontSize:p}=window.getComputedStyle(c),B=p?parseInt(p):null;B!==P.fontSize&&(u.fontSize=B,x=!0)}else P.fontSize&&(u.fontSize=null,x=!0);x&&t(u)});function a(){typeof window>"u"||(window.addEventListener("pointerover",l),window.addEventListener("pointerdown",o),window.addEventListener("pointerup",i))}function s(){window.removeEventListener("pointerover",l),window.removeEventListener("pointerdown",o),window.removeEventListener("pointerup",i)}return{onChange:c=>(n.size||a(),n.add(c),()=>{n.delete(c),n.size||s()})}}function He(){return Y||(Y=je()),Y}function ne(){const n=e.ref({...P});return e.watch(n,()=>He().onChange(t=>{n.value=t}),{immediate:!0,flush:"post"}),n}let q=null;function We(){const n=new Set;function t(){n.forEach(a=>a.show())}function o(){n.forEach(a=>a.hide())}function i(){document.body.addEventListener("mouseenter",t),document.body.addEventListener("mouseleave",o)}function l(){document.body.removeEventListener("mouseenter",t),document.body.removeEventListener("mouseleave",o)}return{on:a=>typeof window>"u"?r.noop:(n.size||i(),n.add(a),()=>{n.delete(a),n.size===0&&l()})}}function Ke(){return q||(q=We()),q}function he(n){const t=e.ref(!0);return e.watch(t,()=>Ke().on({show:()=>{t.value||(n(),t.value=!0)},hide:()=>t.value=!1}),{immediate:!0}),t}const le={x:0,y:0},Xe={x:.5,y:.5},Ye={duration:0},qe={stiffness:1e3,damping:100},Ge={duration:.15,ease:[.38,.12,.29,1]},ue={magneticOptions:{morph:!0,padding:5,snap:.8}},ce=17,de=31,fe=4,Ue=20;function W(n,t,o){const i={width:(o==null?void 0:o.width)??n,height:(o==null?void 0:o.height)??t};return typeof i.width=="number"&&(i.width=`${i.width}px`),typeof i.height=="number"&&(i.height=`${i.height}px`),i}function Ze({type:n,state:t,hasChildren:o,style:i,isMagnetic:l,magneticOptions:a,matchTextSize:s}){const c=l&&t.targetBoundingBox;if(o&&!c)return W("auto","auto",i);const{padding:v,morph:h}=a;switch(n){case"pointer":if(l&&h&&t.targetBoundingBox){const{width:x,height:u}=t.targetBoundingBox;return{width:`${x+v*2}px`,height:`${u+v*2}px`}}return W(de,de,i);case"text":return s&&t.fontSize?{width:`${fe}px`,height:`${t.fontSize}px`}:W(fe,Ue,i);default:return W(ce,ce,i)}}function Je({x:n,y:t},o){const i=e.ref(n.prev!==void 0||t.prev!==void 0);return e.watch(i,()=>{if(i.value)return;const l=()=>{i.value=!0,o(),a()},a=r.pipe(n.on("change",l),t.on("change",l));return()=>a()},{immediate:!0}),i}function Qe(n,t,o){return r.useTransform(()=>r.mix(n.value.get(),t.get(),o.get()))}function pe(n,t,o){const i=r.useSpring(0,{stiffness:600,damping:50}),l=r.useMotionValue(0),a=Qe(n,i,l);return e.watch(()=>o==null?void 0:o.value,(s,c)=>{s?(!c&&!l.isAnimating()?i.jump(s):i.set(s),r.animate(l,t.value||0)):r.animate(l,0)},{immediate:!0,flush:"sync"}),a}function et(n,t,o,i){const l=pe(e.computed(()=>n.value.x),i,e.computed(()=>o.value.targetBoundingBox?o.value.targetBoundingBox.left+o.value.targetBoundingBox.width/2:void 0)),a=pe(e.computed(()=>n.value.y),i,e.computed(()=>o.value.targetBoundingBox?o.value.targetBoundingBox.top+o.value.targetBoundingBox.height/2:void 0));return e.computed(()=>t.value?{x:l,y:a}:n.value)}const tt=e.defineComponent({name:"Cursor",inheritAttrs:!1,__name:"Cursor",props:{follow:{type:Boolean,default:!1},center:{default:({follow:n})=>n?le:Xe},offset:{default:()=>le},spring:{type:[Boolean,Object],default:({follow:n})=>n?qe:!1},matchTextSize:{type:Boolean,default:!0},magnetic:{type:[Boolean,Object],default:!1},transition:{},variants:{},style:{},show:{type:Boolean,default:!0}},setup(n){const t=n,{offset:o,magnetic:i}=e.toRefs(t),l=r.useReducedMotion();Ve(()=>!l.value&&!t.follow);const a=te(),s=Re(a,o),c=r.useSpring(s.x,t.spring||void 0),v=r.useSpring(s.y,t.spring||void 0),h=e.computed(()=>typeof t.magnetic=="object"?{...ue.magneticOptions,...t.magnetic}:ue.magneticOptions);function x(){const d=s.x.on("change",L=>{c.jump(L),d()}),b=s.y.on("change",L=>{v.jump(L),b()})}const u=ne(),f=he(x),p=et(e.computed(()=>t.spring?{x:c,y:v}:a),e.computed(()=>!!i.value),u,e.computed(()=>h.value&&h.value.snap)),B=e.useSlots(),w=e.computed(()=>{var L,z;const d=(z=(L=B.default)==null?void 0:L.call(B))==null?void 0:z.filter(V=>V.type!==Symbol.for("v-cmt"));return Ze({type:u.value.type,state:u.value,hasChildren:!!(d!=null&&d.length),isMagnetic:!!t.magnetic,style:t.style,magneticOptions:h.value,matchTextSize:t.matchTextSize})}),y=Je(a,x);function k(d){return(b,L)=>`translate(-${d.x*100}%, -${d.y*100}%) ${L}`}function m(){const{follow:d,center:b,offset:L,spring:z,matchTextSize:V,magnetic:A,...F}=t;return F}return(d,b)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body"},[e.unref(y)?(e.openBlock(),e.createBlock(e.unref(r.LayoutGroup),{key:0},{default:e.withCtx(()=>[e.createVNode(e.unref(r.MotionConfig),{transition:e.unref(l)?e.unref(Ye):d.transition||e.unref(Ge)},{default:e.withCtx(()=>{var L,z;return[e.createVNode(e.unref(r.motion).div,e.mergeProps({layout:"","data-motion-cursor":d.follow?"follow":"pointer","data-framer-portal-id":"motion-cursor",initial:"exit",exit:"exit"},{...d.$attrs,...m()},{variants:{pressed:d.follow?{}:{scale:.9},...d.variants,default:{opacity:1,scale:1,...(L=d.variants)==null?void 0:L.default},exit:{opacity:0,scale:0,...(z=d.variants)==null?void 0:z.exit}},animate:["default",e.unref(u).type,e.unref(i)&&e.unref(u).targetBoundingBox?"magnetic":"",!e.unref(f)||!d.show?"exit":e.unref(u).isPressed?"pressed":""],"transform-template":k(d.center),style:{borderRadius:d.follow?0:20,zIndex:d.follow?99998:99999,willChange:"transform",contain:"layout",originX:d.center.x,originY:d.center.y,...d.style,width:w.value.width,height:w.value.height,x:e.unref(p).x,y:e.unref(p).y,top:0,left:0,position:"fixed",pointerEvents:"none"}}),{default:e.withCtx(()=>[e.createVNode(e.unref(r.AnimatePresence),null,{default:e.withCtx(()=>[e.renderSlot(d.$slots,"default")]),_:3})]),_:3},16,["data-motion-cursor","variants","animate","transform-template","style"])]}),_:3},8,["transition"])]),_:3})):e.createCommentVNode("",!0)]))}});function me(n,t,o){const i=r.useMotionValue(0),l=r.useMotionValue(0),a=r.useMotionValue(0);return e.watch(()=>o==null?void 0:o.value,s=>{if(typeof s=="number"){r.animate(a,1);const c=()=>{l.set(t*(n.get()-s))};return c(),n.on("change",c)}else r.animate(a,0)},{immediate:!0,flush:"post"}),r.useTransform(()=>r.mix(i.get(),l.get(),a.get()))}function nt(n,t=.1){const o=ne(),i=te(),l=e.computed(()=>o.value.targetBoundingBox&&o.value.target===n.value),a=me(i.x,t,e.computed(()=>l.value?o.value.targetBoundingBox.left+o.value.targetBoundingBox.width/2:void 0)),s=me(i.y,t,e.computed(()=>l.value?o.value.targetBoundingBox.top+o.value.targetBoundingBox.height/2:void 0));return{x:a,y:s}}const[ot,it]=r.createContext("TickerItemContext"),J=e.defineComponent({__name:"TickerItem",props:{offset:{},axis:{},listSize:{},inset:{},bounds:{},itemIndex:{},cloneIndex:{},alignItems:{},itemSize:{default:"auto"}},setup(n){const t=n,o=r.useTransform(()=>{const s=t.offset.get(),{start:c,end:v}=t.bounds;return!c&&!v||!t.listSize?0:s+v<=-t.inset?t.listSize:0}),i=r.useTransform(()=>{const{start:s,end:c}=t.bounds,v=t.offset.get(),h=o.get();return!s&&!c||!t.listSize?0:v+s+h}),l=e.computed(()=>t.alignItems==="stretch"?"100%":"fit-content"),a=e.computed(()=>t.cloneIndex!==void 0);return it({offset:i}),(s,c)=>(e.openBlock(),e.createBlock(e.unref(r.motion).li,e.mergeProps(s.$attrs,{class:s.cloneIndex===void 0?"ticker-item":"clone-item","aria-hidden":a.value?!0:void 0,style:{flexGrow:0,flexShrink:0,flexBasis:s.itemSize==="fill"?"100%":void 0,display:s.itemSize==="fill"?"flex":void 0,height:s.axis==="x"?l.value:void 0,width:s.axis==="y"?l.value:void 0,x:s.axis==="x"?e.unref(o):0,y:s.axis==="y"?e.unref(o):0}}),{default:e.withCtx(()=>[e.renderSlot(s.$slots,"default")]),_:3},16,["class","aria-hidden","style"]))}});function rt(n,t,o,i,l){let a=!1;e.watch(n,(s,c,v)=>{if(!s)return;let h=!1;const x=new AbortController,u={signal:x.signal},f={...u,capture:!0},p=t.value==="x"?"scrollLeft":"scrollTop",B=t.value==="x"?"offsetLeft":"offsetTop",w=t.value==="x"?"ArrowLeft":"ArrowUp",y=t.value==="x"?"ArrowRight":"ArrowDown";let k=[],m=0;const d=async()=>{const g=k[m];g.focus(),await e.nextTick(),o.set(-g[B]),s[p]=0},b=g=>{if(g.key==="Tab"){g.preventDefault(),V();const C=Array.from(document.querySelectorAll('a, button, input, textarea, select, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]')).filter(r.isHTMLElement);C.sort(at);const I=C[g.shiftKey?0:C.length-1],E=g.shiftKey?C.length-1:0;if(s.contains(I)){C[E].focus();return}else{const N=C.indexOf(k[m]),$=g.shiftKey?-1:1;for(let M=N;M<C.length&&M>=0;M+=$){const R=C[M];if(!s.contains(R)){R.focus();return}}}return}else g.key===w?m--:g.key===y&&m++;m=r.wrap(0,k.length,m),d()},L=()=>{a||(l(!0),a=!0,k=Array.from(s.querySelectorAll('.ticker-item a, .ticker-item button, .ticker-item input, .ticker-item textarea, .ticker-item select, .ticker-item [tabindex]:not([tabindex="-1"]), .ticker-item [contenteditable="true"]')).filter(r.isHTMLElement),m=0,d(),window.addEventListener("focus",z,f),window.addEventListener("blur",z,f),s.addEventListener("keydown",b,u))},z=g=>{(!g.target||!(g.target instanceof HTMLElement)||!s.contains(g.target))&&V()},V=()=>{a&&(a=!1,l(!1),i.value.set(o.get()),window.removeEventListener("focus",z),window.removeEventListener("blur",z),s.removeEventListener("keydown",b))},A=g=>{const{target:C}=g;r.isHTMLElement(C)&&(a||L())},F=()=>{h||(h=!0,s.addEventListener("focus",A,f),window.addEventListener("pointermove",_,u))},_=()=>{h&&(h=!1,s.removeEventListener("focus",A,!0),window.removeEventListener("pointermove",_,u))},S=g=>{const I=g.target.closest('[aria-hidden="true"]');I&&I.removeAttribute("aria-hidden")};window.addEventListener("keydown",F,u),s.addEventListener("pointerdown",S,u),v(()=>{x.abort(),V()})},{flush:"post"})}function at(n,t){return n.tabIndex>=1&&t.tabIndex>=1?n.tabIndex-t.tabIndex:n.tabIndex>=1&&t.tabIndex<=0?-1:t.tabIndex>=1&&n.tabIndex<=0?1:0}const ye={start:0,end:0},st={start:"flex-start",end:"flex-end"};function lt(n){return n.end-n.start}function we(n){return n.length?n[n.length-1].end-n[0].start:0}function ut(n,t,o){const i=we(t),l=Math.max(...t.map(lt));let a=0,s=0;for(;s<n;)s=(i+o)*(a+1)-l,a++;return Math.max(a-1,0)}function ct(n=[]){const t=[];for(const o of n)o.type!==e.Comment&&t.push(o);return t}function Q(n){const t=[];for(const o of n)o.type===e.Fragment?t.push(...Q(o.children.default())):t.push(o);return t}function dt(n,t){let o=0,i=n;for(;i;)o+=t==="x"?i.offsetLeft:i.offsetTop,i=i.offsetParent;return o}function ft(n){return typeof n=="function"||Object.prototype.toString.call(n)==="[object Object]"&&!e.isVNode(n)}const pt=e.defineComponent({__name:"Ticker",props:{axis:{default:"x"},style:{},velocity:{default:50},hoverFactor:{default:1},gap:{default:10},align:{default:"center"},offset:{},itemSize:{default:"auto"},overflow:{type:Boolean,default:!1}},setup(n){const t=n,o=e.reactive({visibleLength:0,inset:0,totalItemLength:0,itemPositions:[]}),i=e.computed(()=>st[t.align]||t.align),l=e.useSlots(),a=e.computed(()=>{var S;return ct((S=l.default)==null?void 0:S.call(l))}),s=e.ref(!1),c=r.useMotionValue(1),v=r.useMotionValue(0),h=e.computed(()=>t.offset??v),x=r.useTransform(()=>r.wrap(-o.totalItemLength-t.gap-o.inset,-o.inset,h.value.get())),u=r.useMotionValue(0),f=e.computed(()=>s.value?u:x),p=r.useDomRef(),B=r.useDomRef(),w=r.useInView(p,{margin:"100px"}),y=r.usePageInView(),k=e.computed(()=>w.value&&y.value),m=r.useReducedMotion();function d(){if(!p.value||!B.value)return;const S=t.axis==="x"?"innerWidth":"innerHeight",g=t.axis==="x"?"offsetWidth":"offsetHeight",C=t.axis==="x"?"offsetLeft":"offsetTop",I=t.axis==="x"?"paddingLeft":"paddingTop",E=p.value,$=B.value.querySelectorAll(".ticker-item");if(!$.length)return;let M=!1;const R=[];for(let D=0;D<$.length;D++){const X=$[D];R.push({start:X[C],end:X[C]+X[g]}),(!o.itemPositions[D]||R[D].start!==o.itemPositions[D].start||R[D].end!==o.itemPositions[D].end)&&(M=!0)}const oe=t.overflow?window[S]:Math.min(E[g],window[S]),ie=we(R),xe=window.getComputedStyle(E),ke=parseInt(xe[I]??"0"),re=t.overflow?dt($[0],t.axis):ke;(oe!==o.visibleLength||ie!==o.totalItemLength||re!==o.inset||M)&&(o.visibleLength=oe,o.itemPositions=R,o.totalItemLength=ie,o.inset=re)}e.watch([a,k],(S,g,C)=>{if(!k.value||!p.value)return;d();const I=t.overflow?r.resize(d):void 0,E=r.resize(p.value,d);C(()=>{I==null||I(),E()})},{immediate:!0,flush:"post"});const b=e.computed(()=>o.totalItemLength>0);r.useAnimationFrame((S,g)=>{if(b.value&&k.value&&h.value===v&&!m.value){const C=g/1e3*(t.velocity*c.get());h.value.set(h.value.get()-C)}});const L=e.computed(()=>!b.value||!o.visibleLength?0:ut(o.visibleLength,o.itemPositions,t.gap)),z=e.computed(()=>o.totalItemLength===0?0:(o.totalItemLength+t.gap)*(L.value+1)),V=e.computed(()=>{const S=[];for(let g=0;g<L.value;g++)a.value.forEach((C,I)=>{let E;const N=o.itemPositions[I],$=(o.totalItemLength+t.gap)*(g+1),M=N?{start:N.start+$,end:N.end+$}:ye;S.push(e.createVNode(J,{key:`clone-${g}-${I}`,offset:f.value,axis:t.axis,listSize:z.value,cloneIndex:I,bounds:M,inset:o.inset,alignItems:i.value,itemSize:t.itemSize},ft(E=Q([C]))?E:{default:()=>[E]}))});return S}),A=e.toRef(t,"axis");rt(p,A,u,h,S=>{s.value=S});const F={display:"flex",position:"relative"},_=e.computed(()=>({display:"flex",position:"relative",willChange:b.value&&k.value?"transform":void 0,listStyleType:"none",padding:0,margin:0,justifyContent:"flex-start",flexDirection:t.axis==="x"?"row":"column",gap:`${t.gap}px`,alignItems:i.value,x:t.axis==="x"?f.value:0,y:t.axis==="y"?f.value:0,opacity:b.value?1:0,width:"100%",height:"100%",maxHeight:"100%",maxWidth:"100%"}));return(S,g)=>(e.openBlock(),e.createBlock(e.unref(r.motion).div,e.mergeProps(S.$attrs,{ref_key:"containerRef",ref:p,style:{...F,...t.style,overflow:t.overflow?"visible":"hidden"},onPointerenter:g[0]||(g[0]=()=>{e.unref(r.animate)(e.unref(c),S.hoverFactor)}),onPointerleave:g[1]||(g[1]=()=>{e.unref(r.animate)(e.unref(c),1)})}),{default:e.withCtx(()=>[e.createVNode(e.unref(r.motion).ul,{ref_key:"listRef",ref:B,style:e.normalizeStyle(_.value)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,(C,I)=>(e.openBlock(),e.createBlock(J,{key:`original-${I}`,axis:A.value,offset:f.value,"list-size":z.value,"item-index":I,bounds:o.itemPositions[I]??e.unref(ye),inset:o.inset,"align-items":i.value,"item-size":S.itemSize},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(Q)([C]),(E,N)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(E),{key:N}))),128))]),_:2},1032,["axis","offset","list-size","item-index","bounds","inset","align-items","item-size"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(V.value,C=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(C),{key:C.key}))),128))]),_:1},8,["style"])]),_:1},16,["style"]))}});function mt(){const n=ot(null);return r.invariant(!!n,"useItemOffset must be used within a TickerItem"),n==null?void 0:n.offset}const yt=pt;exports.AnimateNumber=$e;exports.Cursor=tt;exports.Ticker=yt;exports.TickerItem=J;exports.useCursorIsInView=he;exports.useCursorState=ne;exports.useItemOffset=mt;exports.useMagneticPull=nt;exports.usePointerPosition=te;

package/dist/components/Ticker/Ticker.d.ts

@@ -1,19 +1,51 @@
 import { CSSProperties } from 'vue';
 import { MotionValue } from 'motion-v';
+import { ItemSize } from './types';
+/**
+ * Props for the Ticker component.
+ */
 export interface TickerProps {
+    /**
+     * The axis along which the ticker scrolls. Defaults to "x".
+     */
     axis?: 'x' | 'y';
     style?: CSSProperties;
+    /**
+     * The velocity of the ticker scroll in pixels per second. Defaults to 50.
+     */
     velocity?: number;
+    /**
+     * Factor by which the velocity is multiplied when the ticker is hovered. Defaults to 1 (no change).
+     */
     hoverFactor?: number;
+    /**
+     * The gap between ticker items in pixels. Defaults to 10.
+     */
     gap?: number;
-    align?: 'start' | 'center' | 'end';
+    /**
+     * Alignment of items within the ticker. Defaults to "center".
+     */
+    align?: 'start' | 'center' | 'end' | 'stretch';
+    /**
+     * An optional MotionValue to control the ticker's offset externally.
+     */
     offset?: MotionValue<number>;
+    /**
+     * The size of the ticker items. Defaults to "auto".
+     */
+    itemSize?: ItemSize;
+    /**
+     * Show items that overflow the container.
+     */
+    overflow?: boolean;
 }
 declare const _default: import('vue').DefineComponent<TickerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TickerProps> & Readonly<{}>, {
     gap: number;
+    overflow: boolean;
     velocity: number;
     axis: "x" | "y";
+    itemSize: ItemSize;
     hoverFactor: number;
-    align: "start" | "center" | "end";
+    align: "start" | "center" | "end" | "stretch";
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/components/Ticker/TickerItem.d.ts

@@ -1,27 +1,38 @@
 import { MotionValue, motion } from 'motion-v';
-interface Props {
+import { ItemSize } from './types';
+export interface TickerItemProps {
     offset: MotionValue<number>;
     axis: 'x' | 'y';
     listSize: number;
-    containerPaddingStart: number;
+    inset: number;
     bounds: {
         start: number;
         end: number;
     };
     itemIndex?: number;
     cloneIndex?: number;
+    alignItems: 'flex-start' | 'center' | 'flex-end' | 'stretch';
+    itemSize?: ItemSize;
 }
 declare const transform: MotionValue<number>;
+declare const itemWrapperOffAxisSize: import('vue').ComputedRef<"100%" | "fit-content">;
+declare const isClone: import('vue').ComputedRef<boolean>;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_6: {};
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_6) => any;
 }>;
-declare const __VLS_self: import('vue').DefineComponent<Props, {
+declare const __VLS_self: import('vue').DefineComponent<TickerItemProps, {
     motion: typeof motion;
     transform: typeof transform;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+    itemWrapperOffAxisSize: typeof itemWrapperOffAxisSize;
+    isClone: typeof isClone;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TickerItemProps> & Readonly<{}>, {
+    itemSize: ItemSize;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<TickerItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TickerItemProps> & Readonly<{}>, {
+    itemSize: ItemSize;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/components/Ticker/const.d.ts

@@ -2,3 +2,7 @@ export declare const defaultBounds: {
     start: number;
     end: number;
 };
+export declare const alignAlias: {
+    readonly start: "flex-start";
+    readonly end: "flex-end";
+};

package/dist/components/Ticker/index.d.ts

@@ -1,6 +1,9 @@
 import { DefineComponent } from 'vue';
 import { TickerProps } from './Ticker';
 import { MotionProps } from 'motion-v';
+export { default as TickerItem } from './TickerItem';
+export type { TickerItemProps } from './TickerItem';
+export type { ItemPosition, TickerState, ItemSize } from './types';
 export { useItemOffset } from './use-item-offset';
-export { useKeyboardFocus } from './use-keyboard-focus';
 export declare const Ticker: DefineComponent<MotionProps<"div"> & TickerProps>;
+export type { TickerProps };

package/dist/components/Ticker/types.d.ts

@@ -0,0 +1,11 @@
+export interface ItemPosition {
+    start: number;
+    end: number;
+}
+export type ItemSize = 'auto' | 'fill';
+export interface TickerState {
+    visibleLength: number;
+    inset: number;
+    totalItemLength: number;
+    itemPositions: ItemPosition[];
+}

package/dist/components/Ticker/use-focus-navigation.d.ts

@@ -0,0 +1,3 @@
+import { MotionValue } from 'motion-v';
+import { Ref } from 'vue';
+export declare function useFocusNavigation(containerRef: Ref<HTMLElement | null>, axis: Ref<'x' | 'y'>, focusOffset: MotionValue<number>, offset: Ref<MotionValue<number>>, setHasFocus: (hasFocus: boolean) => void): void;

package/dist/components/Ticker/utils/calc-num-clones.d.ts

@@ -0,0 +1,2 @@
+import { ItemPosition } from '../types';
+export declare function calcNumClones(visibleLength: number, itemPositions: ItemPosition[], gap: number): number;

package/dist/components/Ticker/utils/calc-total-item-length.d.ts

@@ -0,0 +1,3 @@
+import { ItemPosition } from '../types';
+export declare function calcItemLength(itemPosition: ItemPosition): number;
+export declare function calcTotalItemLength(itemPositions: ItemPosition[]): number;

package/dist/components/Ticker/utils/get-cumulative-offset.d.ts

@@ -0,0 +1 @@
+export declare function getCumulativeOffset(element: HTMLElement, axis: 'x' | 'y'): number;

package/dist/es/components/Ticker/Ticker.vue.mjs

@@ -1,13 +1,16 @@
-import { defineComponent as ae, reactive as oe, ref as se, computed as s, useSlots as re, watch as le, createVNode as A, toRef as ue, createBlock as v, openBlock as d, unref as u, mergeProps as ce, withCtx as F, normalizeStyle as de, createElementBlock as N, Fragment as q, renderList as H, resolveDynamicComponent as K, isVNode as fe } from "vue";
-import { useMotionValue as z, useTransform as pe, wrap as me, useDomRef as W, useInView as ge, useReducedMotion as Se, resize as ve, useAnimationFrame as ze, motion as G, animate as J } from "motion-v";
+import { defineComponent as le, reactive as re, computed as l, useSlots as ue, ref as fe, watch as ce, createVNode as W, toRef as me, createBlock as I, openBlock as m, unref as u, mergeProps as de, withCtx as _, normalizeStyle as ve, createElementBlock as O, Fragment as R, renderList as V, resolveDynamicComponent as E, isVNode as ge } from "vue";
+import { useMotionValue as B, useTransform as pe, wrap as he, useDomRef as q, useInView as ye, usePageInView as xe, useReducedMotion as we, resize as G, useAnimationFrame as Ie, motion as J, animate as K } from "motion-v";
 import Q from "./TickerItem.vue.mjs";
-import { useKeyboardFocus as ye } from "./use-keyboard-focus.mjs";
-import { defaultBounds as U } from "./const.mjs";
-import { flattenSlots as xe } from "../../utils/flatten-slots.mjs";
-function Pe(f) {
-  return typeof f == "function" || Object.prototype.toString.call(f) === "[object Object]" && !fe(f);
+import { useFocusNavigation as Le } from "./use-focus-navigation.mjs";
+import { alignAlias as Se, defaultBounds as U } from "./const.mjs";
+import { calcNumClones as Pe } from "./utils/calc-num-clones.mjs";
+import { calcTotalItemLength as be } from "./utils/calc-total-item-length.mjs";
+import { flattenSlots as ze, renderVNode as X } from "../../utils/flatten-slots.mjs";
+import { getCumulativeOffset as ke } from "./utils/get-cumulative-offset.mjs";
+function Ce(v) {
+  return typeof v == "function" || Object.prototype.toString.call(v) === "[object Object]" && !ge(v);
 }
-const be = /* @__PURE__ */ ae({
+const Ne = /* @__PURE__ */ le({
   __name: "Ticker",
   props: {
     axis: {
@@ -26,158 +29,155 @@ const be = /* @__PURE__ */ ae({
     align: {
       default: "center"
     },
-    offset: {}
+    offset: {},
+    itemSize: {
+      default: "auto"
+    },
+    overflow: {
+      type: Boolean,
+      default: !1
+    }
   },
-  setup(f) {
-    const a = f, e = oe({
-      listSize: 0,
-      containerSize: 0,
-      containerPaddingStart: 0,
-      containerPaddingEnd: 0,
-      itemSizes: []
-    }), y = se(!1), x = z(1), O = z(0), p = s(() => a.offset ?? O), P = z(0);
-    pe(() => (P.set(me(-e.listSize - a.gap - e.containerPaddingStart, -e.containerPaddingStart, p.value.get())), P.get()));
-    const h = z(0), S = s(() => y.value ? h : P), X = s(() => a.align === "start" ? "flex-start" : a.align === "center" ? "center" : "flex-end"), r = W(), w = W(), k = ge(r, {
+  setup(v) {
+    const e = v, t = re({
+      visibleLength: 0,
+      inset: 0,
+      totalItemLength: 0,
+      itemPositions: []
+    }), L = l(() => Se[e.align] || e.align), S = ue(), P = l(() => {
+      var n;
+      return ze((n = S.default) == null ? void 0 : n.call(S));
+    }), F = fe(!1), b = B(1), M = B(0), g = l(() => e.offset ?? M), Y = pe(() => he(-t.totalItemLength - e.gap - t.inset, -t.inset, g.value.get())), T = B(0), h = l(() => F.value ? T : Y), f = q(), z = q(), Z = ye(f, {
       margin: "100px"
-    }), Y = Se();
-    function M() {
-      if (!r.value || !w.value) return;
-      const {
-        axis: n
-      } = a, t = n === "x" ? "offsetWidth" : "offsetHeight", i = n === "x" ? "offsetLeft" : "offsetTop", o = n === "x" ? "paddingLeft" : "paddingTop", m = n === "x" ? "paddingRight" : "paddingBottom", g = r.value, b = w.value.querySelectorAll(".ticker-item");
-      if (!b.length) return;
-      let T = !1;
-      const c = [];
-      for (let l = 0; l < b.length; l++) {
-        const B = b[l];
-        c.push({
-          start: B[i],
-          end: B[i] + B[t]
-        }), (!e.itemSizes[l] || c[l].start !== e.itemSizes[l].start || c[l].end !== e.itemSizes[l].end) && (T = !0);
+    }), ee = xe(), y = l(() => Z.value && ee.value), te = we();
+    function k() {
+      if (!f.value || !z.value) return;
+      const n = e.axis === "x" ? "innerWidth" : "innerHeight", o = e.axis === "x" ? "offsetWidth" : "offsetHeight", i = e.axis === "x" ? "offsetLeft" : "offsetTop", s = e.axis === "x" ? "paddingLeft" : "paddingTop", a = f.value, c = z.value.querySelectorAll(".ticker-item");
+      if (!c.length) return;
+      let w = !1;
+      const p = [];
+      for (let r = 0; r < c.length; r++) {
+        const C = c[r];
+        p.push({
+          start: C[i],
+          end: C[i] + C[o]
+        }), (!t.itemPositions[r] || p[r].start !== t.itemPositions[r].start || p[r].end !== t.itemPositions[r].end) && (w = !0);
       }
-      const j = g[t], L = c[c.length - 1].end - c[0].start, D = window.getComputedStyle(g), ne = parseInt(D[o] ?? 0), ie = parseInt(D[m] ?? 0);
-      (L !== e.listSize || j !== e.containerSize || T) && (e.listSize = L, e.containerSize = j, e.containerPaddingStart = ne, e.containerPaddingEnd = ie, e.itemSizes = c);
+      const A = e.overflow ? window[n] : Math.min(a[o], window[n]), D = be(p), se = window.getComputedStyle(a), ae = parseInt(se[s] ?? "0"), H = e.overflow ? ke(c[0], e.axis) : ae;
+      (A !== t.visibleLength || D !== t.totalItemLength || H !== t.inset || w) && (t.visibleLength = A, t.itemPositions = p, t.totalItemLength = D, t.inset = H);
     }
-    const C = re(), I = s(() => {
-      var n;
-      return xe((n = C.default) == null ? void 0 : n.call(C));
-    });
-    le([I, k, r], (n, t, i) => {
-      if (!k.value || !r.value) return;
-      M();
-      const o = ve(r.value, M);
-      i(o);
+    ce([P, y], (n, o, i) => {
+      if (!y.value || !f.value) return;
+      k();
+      const s = e.overflow ? G(k) : void 0, a = G(f.value, k);
+      i(() => {
+        s == null || s(), a();
+      });
     }, {
       immediate: !0,
-      flush: "sync"
+      flush: "post"
     });
-    const R = s(() => e.containerSize > 0 && e.listSize > 0);
-    ze((n, t) => {
-      if (R.value && k.value && p.value === O && !Y.value) {
-        const i = t / 1e3 * (a.velocity * x.get());
-        p.value.set(p.value.get() - i);
+    const x = l(() => t.totalItemLength > 0);
+    Ie((n, o) => {
+      if (x.value && y.value && g.value === M && !te.value) {
+        const i = o / 1e3 * (e.velocity * b.get());
+        g.value.set(g.value.get() - i);
       }
     });
-    const _ = s(() => {
-      let n = 0;
-      if (!R.value || !e.containerSize) return 0;
-      let t = 0;
-      const i = Math.max(...e.itemSizes.map((o) => o.end - o.start));
-      for (; t < e.containerSize + e.containerPaddingStart; )
-        t = (e.listSize + a.gap) * (n + 1) - i, n++;
-      return Math.max(n - 1, 0);
-    }), E = s(() => e.listSize === 0 ? 0 : (e.listSize + a.gap) * (_.value + 1)), Z = s(() => {
+    const $ = l(() => !x.value || !t.visibleLength ? 0 : Pe(t.visibleLength, t.itemPositions, e.gap)), N = l(() => t.totalItemLength === 0 ? 0 : (t.totalItemLength + e.gap) * ($.value + 1)), ne = l(() => {
       const n = [];
-      for (let t = 0; t < _.value; t++)
-        I.value.forEach((i, o) => {
-          const m = e.itemSizes[o], g = (e.listSize + a.gap) * (t + 1), $ = m ? {
-            start: m.start + g,
-            end: m.end + g
+      for (let o = 0; o < $.value; o++)
+        P.value.forEach((i, s) => {
+          let a;
+          const d = t.itemPositions[s], c = (t.totalItemLength + e.gap) * (o + 1), w = d ? {
+            start: d.start + c,
+            end: d.end + c
           } : U;
-          n.push(A(Q, {
-            key: `clone-${t}-${o}`,
-            offset: S.value,
-            axis: a.axis,
-            listSize: E.value,
-            cloneIndex: o,
-            bounds: $,
-            containerPaddingStart: e.containerPaddingStart
-          }, Pe(i) ? i : {
-            default: () => [i]
+          n.push(W(Q, {
+            key: `clone-${o}-${s}`,
+            offset: h.value,
+            axis: e.axis,
+            listSize: N.value,
+            cloneIndex: s,
+            bounds: w,
+            inset: t.inset,
+            alignItems: L.value,
+            itemSize: e.itemSize
+          }, Ce(a = X([i])) ? a : {
+            default: () => [a]
           }));
         });
       return n;
-    }), V = ue(a, "axis");
-    ye(r, V, h);
-    const ee = {
+    }), j = me(e, "axis");
+    Le(f, j, T, g, (n) => {
+      F.value = n;
+    });
+    const oe = {
       display: "flex",
-      position: "relative",
-      overflow: "hidden"
-    }, te = s(() => ({
+      position: "relative"
+    }, ie = l(() => ({
       display: "flex",
       position: "relative",
-      willChange: "transform",
+      willChange: x.value && y.value ? "transform" : void 0,
       listStyleType: "none",
       padding: 0,
       margin: 0,
       justifyContent: "flex-start",
-      flexDirection: a.axis === "x" ? "row" : "column",
-      gap: `${a.gap}px`,
-      alignItems: X.value,
-      x: a.axis === "x" ? S.value : 0,
-      y: a.axis === "y" ? S.value : 0,
-      opacity: R.value ? 1 : 0
+      flexDirection: e.axis === "x" ? "row" : "column",
+      gap: `${e.gap}px`,
+      alignItems: L.value,
+      x: e.axis === "x" ? h.value : 0,
+      y: e.axis === "y" ? h.value : 0,
+      opacity: x.value ? 1 : 0,
+      width: "100%",
+      height: "100%",
+      maxHeight: "100%",
+      maxWidth: "100%"
     }));
-    return (n, t) => (d(), v(u(G).div, ce({
-      ...n.$attrs
-    }, {
+    return (n, o) => (m(), I(u(J).div, de(n.$attrs, {
       ref_key: "containerRef",
-      ref: r,
-      "data-size": e.listSize,
+      ref: f,
       style: {
-        ...ee,
-        ...a.style
+        ...oe,
+        ...e.style,
+        overflow: e.overflow ? "visible" : "hidden"
       },
-      onFocusCapture: t[0] || (t[0] = () => {
-        y.value = !0;
-      }),
-      onBlurCapture: t[1] || (t[1] = () => {
-        y.value = !1, p.value.set(u(h).get());
-      }),
-      onPointerenter: t[2] || (t[2] = () => {
-        u(J)(u(x), n.hoverFactor);
+      onPointerenter: o[0] || (o[0] = () => {
+        u(K)(u(b), n.hoverFactor);
       }),
-      onPointerleave: t[3] || (t[3] = () => {
-        u(J)(u(x), 1);
+      onPointerleave: o[1] || (o[1] = () => {
+        u(K)(u(b), 1);
       })
     }), {
-      default: F(() => [A(u(G).ul, {
+      default: _(() => [W(u(J).ul, {
         ref_key: "listRef",
-        ref: w,
-        style: de(te.value)
+        ref: z,
+        style: ve(ie.value)
       }, {
-        default: F(() => [(d(!0), N(q, null, H(I.value, (i, o) => (d(), v(Q, {
-          key: `original-${o}`,
-          axis: V.value,
-          offset: S.value,
-          "list-size": E.value,
-          "item-index": o,
-          bounds: e.itemSizes[o] ?? u(U),
-          "container-padding-start": e.containerPaddingStart
+        default: _(() => [(m(!0), O(R, null, V(P.value, (i, s) => (m(), I(Q, {
+          key: `original-${s}`,
+          axis: j.value,
+          offset: h.value,
+          "list-size": N.value,
+          "item-index": s,
+          bounds: t.itemPositions[s] ?? u(U),
+          inset: t.inset,
+          "align-items": L.value,
+          "item-size": n.itemSize
         }, {
-          default: F(() => [(d(), v(K(i), {
-            index: o
-          }, null, 8, ["index"]))]),
+          default: _(() => [(m(!0), O(R, null, V(u(X)([i]), (a, d) => (m(), I(E(a), {
+            key: d
+          }))), 128))]),
           _: 2
-        }, 1032, ["axis", "offset", "list-size", "item-index", "bounds", "container-padding-start"]))), 128)), (d(!0), N(q, null, H(Z.value, (i) => (d(), v(K(i), {
+        }, 1032, ["axis", "offset", "list-size", "item-index", "bounds", "inset", "align-items", "item-size"]))), 128)), (m(!0), O(R, null, V(ne.value, (i) => (m(), I(E(i), {
           key: i.key
         }))), 128))]),
         _: 1
       }, 8, ["style"])]),
       _: 1
-    }, 16, ["data-size", "style"]));
+    }, 16, ["style"]));
   }
 });
 export {
-  be as default
+  Ne as default
 };

package/dist/es/components/Ticker/TickerItem.vue.mjs

@@ -1,46 +1,52 @@
-import { defineComponent as p, createBlock as x, openBlock as S, unref as i, mergeProps as g, withCtx as k, renderSlot as I } from "vue";
-import { useMotionValue as a, useTransform as d, motion as h } from "motion-v";
-import { provideTickerItemContext as v } from "./context.mjs";
-const b = /* @__PURE__ */ p({
+import { defineComponent as c, computed as f, createBlock as p, openBlock as x, unref as n, mergeProps as v, withCtx as S, renderSlot as h } from "vue";
+import { useTransform as l, motion as z } from "motion-v";
+import { provideTickerItemContext as I } from "./context.mjs";
+const C = /* @__PURE__ */ c({
   __name: "TickerItem",
   props: {
     offset: {},
     axis: {},
     listSize: {},
-    containerPaddingStart: {},
+    inset: {},
     bounds: {},
     itemIndex: {},
-    cloneIndex: {}
+    cloneIndex: {},
+    alignItems: {},
+    itemSize: { default: "auto" }
   },
-  setup(c) {
-    const t = c, r = a(0);
-    d(() => {
-      const e = t.offset.get(), { start: n, end: s } = t.bounds;
-      return !n && !s || !t.listSize ? r.set(0) : e + s <= -t.containerPaddingStart ? r.set(t.listSize) : r.set(0);
-    });
-    const o = a(0);
-    return d(() => {
-      const { offset: e, listSize: n, bounds: s } = t, { start: f, end: l } = s, u = e.get(), m = r.get();
-      return !f && !l || !n ? o.set(0) : o.set(u + f + m);
-    }), v({
-      offset: o
-    }), (e, n) => (S(), x(i(h).li, g(e.$attrs, {
+  setup(a) {
+    const t = a, o = l(() => {
+      const e = t.offset.get(), { start: i, end: s } = t.bounds;
+      return !i && !s || !t.listSize ? 0 : e + s <= -t.inset ? t.listSize : 0;
+    }), d = l(() => {
+      const { start: e, end: i } = t.bounds, s = t.offset.get(), u = o.get();
+      return !e && !i || !t.listSize ? 0 : s + e + u;
+    }), r = f(
+      () => t.alignItems === "stretch" ? "100%" : "fit-content"
+    ), m = f(() => t.cloneIndex !== void 0);
+    return I({
+      offset: d
+    }), (e, i) => (x(), p(n(z).li, v(e.$attrs, {
       class: e.cloneIndex === void 0 ? "ticker-item" : "clone-item",
-      "aria-hidden": e.cloneIndex !== void 0 ? !0 : void 0,
+      "aria-hidden": m.value ? !0 : void 0,
       style: {
-        flexShrink: 0,
         flexGrow: 0,
-        x: e.axis === "x" ? i(r) : 0,
-        y: e.axis === "y" ? i(r) : 0
+        flexShrink: 0,
+        flexBasis: e.itemSize === "fill" ? "100%" : void 0,
+        display: e.itemSize === "fill" ? "flex" : void 0,
+        height: e.axis === "x" ? r.value : void 0,
+        width: e.axis === "y" ? r.value : void 0,
+        x: e.axis === "x" ? n(o) : 0,
+        y: e.axis === "y" ? n(o) : 0
       }
     }), {
-      default: k(() => [
-        I(e.$slots, "default")
+      default: S(() => [
+        h(e.$slots, "default")
       ]),
       _: 3
     }, 16, ["class", "aria-hidden", "style"]));
   }
 });
 export {
-  b as default
+  C as default
 };

package/dist/es/components/Ticker/const.mjs

@@ -1,4 +1,8 @@
-const t = { start: 0, end: 0 };
+const t = { start: 0, end: 0 }, e = {
+  start: "flex-start",
+  end: "flex-end"
+};
 export {
+  e as alignAlias,
   t as defaultBounds
 };

package/dist/es/components/Ticker/use-focus-navigation.mjs

@@ -0,0 +1,108 @@
+import { isHTMLElement as b, wrap as D } from "motion-v";
+import { watch as N, nextTick as S } from "vue";
+function j(s, r, w, k, v) {
+  let a = !1;
+  N(s, (t, U, A) => {
+    if (!t)
+      return;
+    let l = !1;
+    const x = new AbortController(), i = {
+      signal: x.signal
+    }, m = {
+      ...i,
+      capture: !0
+    }, T = r.value === "x" ? "scrollLeft" : "scrollTop", I = r.value === "x" ? "offsetLeft" : "offsetTop", F = r.value === "x" ? "ArrowLeft" : "ArrowUp", C = r.value === "x" ? "ArrowRight" : "ArrowDown";
+    let c = [], o = 0;
+    const E = async () => {
+      const e = c[o];
+      e.focus(), await S(), w.set(-e[I]), t[T] = 0;
+    }, g = (e) => {
+      if (e.key === "Tab") {
+        e.preventDefault(), p();
+        const n = Array.from(
+          document.querySelectorAll(
+            'a, button, input, textarea, select, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]'
+          )
+        ).filter(b);
+        n.sort(R);
+        const u = n[e.shiftKey ? 0 : n.length - 1], M = e.shiftKey ? n.length - 1 : 0;
+        if (t.contains(u)) {
+          n[M].focus();
+          return;
+        } else {
+          const P = n.indexOf(
+            c[o]
+          ), q = e.shiftKey ? -1 : 1;
+          for (let f = P; f < n.length && f >= 0; f += q) {
+            const L = n[f];
+            if (!t.contains(L)) {
+              L.focus();
+              return;
+            }
+          }
+        }
+        return;
+      } else e.key === F ? o-- : e.key === C && o++;
+      o = D(0, c.length, o), E();
+    }, K = () => {
+      a || (v(!0), a = !0, c = Array.from(
+        t.querySelectorAll(
+          '.ticker-item a, .ticker-item button, .ticker-item input, .ticker-item textarea, .ticker-item select, .ticker-item [tabindex]:not([tabindex="-1"]), .ticker-item [contenteditable="true"]'
+        )
+      ).filter(b), o = 0, E(), window.addEventListener(
+        "focus",
+        d,
+        m
+      ), window.addEventListener(
+        "blur",
+        d,
+        m
+      ), t.addEventListener(
+        "keydown",
+        g,
+        i
+      ));
+    }, d = (e) => {
+      (!e.target || !(e.target instanceof HTMLElement) || !t.contains(e.target)) && p();
+    }, p = () => {
+      a && (a = !1, v(!1), k.value.set(w.get()), window.removeEventListener("focus", d), window.removeEventListener("blur", d), t.removeEventListener("keydown", g));
+    }, h = (e) => {
+      const { target: n } = e;
+      b(n) && (a || K());
+    }, O = () => {
+      l || (l = !0, t.addEventListener(
+        "focus",
+        h,
+        m
+      ), window.addEventListener(
+        "pointermove",
+        y,
+        i
+      ));
+    }, y = () => {
+      l && (l = !1, t.removeEventListener("focus", h, !0), window.removeEventListener(
+        "pointermove",
+        y,
+        i
+      ));
+    }, H = (e) => {
+      const u = e.target.closest('[aria-hidden="true"]');
+      u && u.removeAttribute("aria-hidden");
+    };
+    window.addEventListener("keydown", O, i), t.addEventListener(
+      "pointerdown",
+      H,
+      i
+    ), A(() => {
+      x.abort(), p();
+    });
+  }, {
+    flush: "post"
+  });
+}
+function R(s, r) {
+  return s.tabIndex >= 1 && r.tabIndex >= 1 ? s.tabIndex - r.tabIndex : s.tabIndex >= 1 && r.tabIndex <= 0 ? -1 : r.tabIndex >= 1 && s.tabIndex <= 0 ? 1 : 0;
+}
+export {
+  j as useFocusNavigation
+};

package/dist/es/components/Ticker/utils/calc-num-clones.mjs

@@ -0,0 +1,11 @@
+import { calcTotalItemLength as h, calcItemLength as o } from "./calc-total-item-length.mjs";
+function r(l, e, n) {
+  const c = h(e), m = Math.max(...e.map(o));
+  let t = 0, a = 0;
+  for (; a < l; )
+    a = (c + n) * (t + 1) - m, t++;
+  return Math.max(t - 1, 0);
+}
+export {
+  r as calcNumClones
+};

package/dist/es/components/Ticker/utils/calc-total-item-length.mjs

@@ -0,0 +1,10 @@
+function r(n) {
+  return n.end - n.start;
+}
+function t(n) {
+  return n.length ? n[n.length - 1].end - n[0].start : 0;
+}
+export {
+  r as calcItemLength,
+  t as calcTotalItemLength
+};

package/dist/es/components/Ticker/utils/get-cumulative-offset.mjs

@@ -0,0 +1,9 @@
+function l(f, o) {
+  let t = 0, e = f;
+  for (; e; )
+    t += o === "x" ? e.offsetLeft : e.offsetTop, e = e.offsetParent;
+  return t;
+}
+export {
+  l as getCumulativeOffset
+};

package/dist/es/index.mjs

@@ -1,20 +1,20 @@
 import { AnimateNumber as o } from "./components/AnimateNumber/index.mjs";
-import { Ticker as s } from "./components/Ticker/index.mjs";
-import { default as f } from "./components/Cursor/Cursor.vue.mjs";
-import { useCursorState as p } from "./components/Cursor/hooks/use-cursor-state/index.mjs";
-import { useCursorIsInView as i } from "./components/Cursor/hooks/use-cursor-in-view.mjs";
-import { usePointerPosition as n } from "./components/Cursor/hooks/use-pointer-position.mjs";
-import { useMagneticPull as l } from "./components/Cursor/magnetic/use-magnetic-pull.mjs";
-import { useItemOffset as I } from "./components/Ticker/use-item-offset.mjs";
-import { useKeyboardFocus as b } from "./components/Ticker/use-keyboard-focus.mjs";
+import { Ticker as f } from "./components/Ticker/index.mjs";
+import { default as s } from "./components/Cursor/Cursor.vue.mjs";
+import { default as p } from "./components/Ticker/TickerItem.vue.mjs";
+import { useCursorState as i } from "./components/Cursor/hooks/use-cursor-state/index.mjs";
+import { useCursorIsInView as n } from "./components/Cursor/hooks/use-cursor-in-view.mjs";
+import { usePointerPosition as I } from "./components/Cursor/hooks/use-pointer-position.mjs";
+import { useMagneticPull as C } from "./components/Cursor/magnetic/use-magnetic-pull.mjs";
+import { useItemOffset as d } from "./components/Ticker/use-item-offset.mjs";
 export {
   o as AnimateNumber,
-  f as Cursor,
-  s as Ticker,
-  i as useCursorIsInView,
-  p as useCursorState,
-  I as useItemOffset,
-  b as useKeyboardFocus,
-  l as useMagneticPull,
-  n as usePointerPosition
+  s as Cursor,
+  f as Ticker,
+  p as TickerItem,
+  n as useCursorIsInView,
+  i as useCursorState,
+  d as useItemOffset,
+  C as useMagneticPull,
+  I as usePointerPosition
 };

package/dist/es/utils/flatten-slots.mjs

@@ -1,10 +1,17 @@
-import { Comment as n, Fragment as o } from "vue";
-function i(r = []) {
-  const e = [];
-  for (const t of r)
-    t.type !== n && (t.type === o && Array.isArray(t.children) ? e.push(...i(t.children)) : e.push(t));
-  return e;
+import { Comment as o, Fragment as r } from "vue";
+function u(n = []) {
+  const t = [];
+  for (const e of n)
+    e.type !== o && t.push(e);
+  return t;
+}
+function f(n) {
+  const t = [];
+  for (const e of n)
+    e.type === r ? t.push(...f(e.children.default())) : t.push(e);
+  return t;
 }
 export {
-  i as flattenSlots
+  u as flattenSlots,
+  f as renderVNode
 };

package/dist/utils/flatten-slots.d.ts

@@ -1,2 +1,7 @@
 import { VNode } from 'vue';
 export declare function flattenSlots(slots?: VNode[]): VNode[];
+/**
+ * Recursively render a VNode, flattening Fragment nodes and skipping comments.
+ * Returns an array of rendered VNodes (can be used in render function).
+ */
+export declare function renderVNode(nodes: VNode[]): VNode[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "motion-plus-vue",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Motion Plus Vue",
   "author": "",
   "license": "ISC",
@@ -25,13 +25,9 @@
   ],
   "typings": "./dist/index.d.ts",
   "peerDependencies": {
-    "motion-v": ">=1.2.0",
+    "motion-v": "^1.5.0",
     "vue": ">=3.0.0"
   },
-  "devDependencies": {
-    "motion-v": "^1.2.0",
-    "vue": "^3.5.13"
-  },
   "size-limit": [
     {
       "path": "dist/es/components/AnimateNumber/index.mjs",

package/dist/components/Ticker/use-keyboard-focus.d.ts

@@ -1,3 +0,0 @@
-import { MotionValue } from 'motion-v';
-import { Ref } from 'vue';
-export declare function useKeyboardFocus(containerRef: Ref<HTMLElement | null>, axis: Ref<'x' | 'y'>, focusOffset: MotionValue<number>): void;

package/dist/es/components/Ticker/use-keyboard-focus.mjs

@@ -1,68 +0,0 @@
-import { isHTMLElement as f, frame as F, wrap as T } from "motion-v";
-import { onMounted as A, onUnmounted as K } from "vue";
-function D(s, r, w) {
-  let i = !1;
-  A(() => {
-    const t = s.value;
-    if (!t)
-      return;
-    const d = r.value === "x" ? "scrollLeft" : "scrollTop", y = r.value === "x" ? "offsetLeft" : "offsetTop", E = r.value === "x" ? "ArrowLeft" : "ArrowUp", L = r.value === "x" ? "ArrowRight" : "ArrowDown";
-    let c = [], o = 0;
-    const m = () => {
-      const e = c[o];
-      e.focus(), w.set(-e[y]), t[d] = 0, F.render(() => {
-        t[d] = 0;
-      });
-    }, b = (e) => {
-      if (e.key === "Tab") {
-        e.preventDefault(), u();
-        const n = Array.from(
-          document.querySelectorAll(
-            'a, button, input, textarea, select, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]'
-          )
-        ).filter(f);
-        n.sort(M);
-        const g = n[e.shiftKey ? 0 : n.length - 1], h = e.shiftKey ? n.length - 1 : 0;
-        if (t.contains(g)) {
-          n[h].focus();
-          return;
-        } else {
-          const v = n.indexOf(
-            c[o]
-          ), I = e.shiftKey ? -1 : 1;
-          for (let l = v; l < n.length && l >= 0; l += I) {
-            const p = n[l];
-            if (!t.contains(p)) {
-              p.focus();
-              return;
-            }
-          }
-        }
-        return;
-      } else e.key === E ? o-- : e.key === L && o++;
-      o = T(0, c.length, o), m();
-    }, k = () => {
-      i || (i = !0, c = Array.from(
-        t.querySelectorAll(
-          '.ticker-item a, .ticker-item button, .ticker-item input, .ticker-item textarea, .ticker-item select, .ticker-item [tabindex]:not([tabindex="-1"]), .ticker-item [contenteditable="true"]'
-        )
-      ).filter(f), o = 0, m(), window.addEventListener("focus", a, !0), window.addEventListener("blur", a, !0), t.addEventListener("keydown", b));
-    }, a = (e) => {
-      (!e.target || !(e.target instanceof HTMLElement) || !t.contains(e.target)) && u();
-    }, u = () => {
-      i && (i = !1, window.removeEventListener("focus", a, !0), window.removeEventListener("blur", a, !0), t.removeEventListener("keydown", b));
-    }, x = (e) => {
-      const { target: n } = e;
-      f(n) && (i || k());
-    };
-    t.addEventListener("focus", x, !0), K(() => {
-      t.removeEventListener("focus", x), u();
-    });
-  });
-}
-function M(s, r) {
-  return s.tabIndex >= 1 && r.tabIndex >= 1 ? s.tabIndex - r.tabIndex : s.tabIndex >= 1 && r.tabIndex <= 0 ? -1 : r.tabIndex >= 1 && s.tabIndex <= 0 ? 1 : 0;
-}
-export {
-  D as useKeyboardFocus
-};