@ssgoi/core 6.6.8 → 6.6.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/animation/animation.d.ts +2 -2
- package/dist/animation/frame-scheduler.d.ts +36 -0
- package/dist/animation/frame-scheduler.d.ts.map +1 -0
- package/dist/animation/multi-animation.d.ts +3 -2
- package/dist/animation/multi-animation.d.ts.map +1 -1
- package/dist/animation/web-animation.d.ts +14 -3
- package/dist/animation/web-animation.d.ts.map +1 -1
- package/dist/index.cjs +11 -11
- package/dist/index.js +1165 -958
- package/dist/internal.cjs +1 -1
- package/dist/internal.js +2 -2
- package/dist/multi-animation-6124HEke.cjs +1 -0
- package/dist/multi-animation-ZFZBDBGr.js +439 -0
- package/dist/transitions/hero/fit.d.ts +5 -0
- package/dist/transitions/hero/fit.d.ts.map +1 -0
- package/dist/transitions/hero/transition.d.ts +12 -1
- package/dist/transitions/hero/transition.d.ts.map +1 -1
- package/dist/transitions/hero/types.d.ts +2 -1
- package/dist/transitions/hero/types.d.ts.map +1 -1
- package/dist/transitions/media-geometry.d.ts +55 -0
- package/dist/transitions/media-geometry.d.ts.map +1 -0
- package/dist/transitions/zoom/transition.d.ts +5 -1
- package/dist/transitions/zoom/transition.d.ts.map +1 -1
- package/dist/transitions/zoom/types.d.ts +5 -0
- package/dist/transitions/zoom/types.d.ts.map +1 -1
- package/dist/transitions/zoom/zoom-element.d.ts +2 -2
- package/dist/transitions/zoom/zoom-element.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/multi-animation-BC5ihz8S.js +0 -367
- package/dist/multi-animation-CE9yYIGJ.cjs +0 -1
package/dist/internal.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var It=Object.defineProperty;var Ht=(t,n,e)=>n in t?It(t,n,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[n]=e;var F=(t,n,e)=>Ht(t,typeof n!="symbol"?n+"":n,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("./multi-animation-CE9yYIGJ.cjs");class Mt extends Q.Animation{constructor(){super(...arguments);F(this,"child",null);F(this,"_state","idle");F(this,"_settled",!1);F(this,"listeners",new Set)}attach(e){const s=this.child;if(this.child=e,this._settled=!1,s){const l=s.getPose();s.complete(),e.matchInto(l)}e.playbackRate=this.playbackRate;const o=e.onComplete;e.onComplete=()=>{o==null||o(),this.child===e&&(this.child=null,this._state="idle",this._settled=!0),this.notify()};const a=e.onUpdate;e.onUpdate=l=>{var u;a==null||a(l),(u=this.onUpdate)==null||u.call(this,l),this.notify()},this._state==="paused"?e.pause():this._state==="reversing"?e.reverse():(this._state="playing",e.play()),this.notify()}play(){var e;this._state="playing",this._settled=!1,(e=this.child)==null||e.play(),this.notify()}reverse(){var e;this._state="reversing",this._settled=!1,(e=this.child)==null||e.reverse(),this.notify()}pause(){var e;this._state="paused",(e=this.child)==null||e.pause(),this.notify()}complete(){var e;(e=this.child)==null||e.complete(),this.notify()}get isAnimating(){var e;return((e=this.child)==null?void 0:e.isAnimating)??!1}get isPaused(){return this._state==="paused"}get isComplete(){return this._settled&&!this.child}get isReversing(){var e;return((e=this.child)==null?void 0:e.isReversing)??this._state==="reversing"}get progress(){var e;return((e=this.child)==null?void 0:e.progress)??0}findTimeForProgress(e){var s;return((s=this.child)==null?void 0:s.findTimeForProgress(e))??null}get playbackRate(){return super.playbackRate}set playbackRate(e){super.playbackRate=e,this.child&&(this.child.playbackRate=e),this.notify()}getPose(){var e;return((e=this.child)==null?void 0:e.getPose())??[]}getTimeline(){var e;return((e=this.child)==null?void 0:e.getTimeline())??[]}matchInto(e){var s;(s=this.child)==null||s.matchInto(e)}get activeChild(){return this.child}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}notify(){for(const e of this.listeners)e()}}const Wt=(t,n)=>{var e;t.style.position="absolute",t.style.width="100%",t.style.top=`${-1*(((e=n==null?void 0:n.scrollOffset)==null?void 0:e.y)??0)}px`,t.style.left="0"},vt=new Set(["auto","scroll","overlay"]),zt=t=>{let n=t.parentElement;for(;n&&n!==document.body;){const e=window.getComputedStyle(n);if(vt.has(e.overflowY)||vt.has(e.overflowX))return n;n=n.parentElement}return document.documentElement},Bt=t=>{let n=t.parentElement;for(;n&&n!==document.body;){const e=window.getComputedStyle(n).position;if(e==="relative"||e==="absolute"||e==="fixed"||e==="sticky")return n;n=n.parentElement}return document.body};function Ft(t){const n=Object.keys(t);return Promise.all(n.map(e=>t[e])).then(e=>{const s={};return n.forEach((o,a)=>{s[o]=e[a]}),s})}function Kt(t){const n=t.filter(e=>e.symmetric).map(e=>({from:e.to,to:e.from,transition:e.transition}));return[...t,...n]}const Xt=1e6,bt=100,$t=10;function qt(t){const n=t.trim(),e=n.indexOf("#"),s=n.indexOf("?"),o=[e,s].filter(a=>a>=0).reduce((a,l)=>Math.min(a,l),n.length);return n.slice(0,o)}function ut(t){const n=qt(t);try{if(/^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(n))return ut(new URL(n).pathname)}catch{}const s=(n.startsWith("/")?n:`/${n}`).replace(/\/+/g,"/");return(s.length>1?s.replace(/\/+$/g,""):s)||"/"}function Ut(t){const n=t.trim();return n==="*"?"*":ut(n)}function rt(t){return t==="/"?[]:t.slice(1).split("/")}function Vt(t){return t.startsWith(":")||t.startsWith("[")&&t.endsWith("]")||t.startsWith("{")&&t.endsWith("}")}function ct(t,n){const e=ut(t),s=Ut(n);if(s==="*")return{matched:!0,specificity:0};if(e===s)return{matched:!0,specificity:Xt+rt(s).length*bt};const o=rt(e),a=rt(s);let l=0;for(let u=0;u<a.length;u++){const g=a[u],b=o[u],_=u===a.length-1;if(g===void 0)return{matched:!1,specificity:0};if((g==="*"||g==="**")&&_)return{matched:g==="**"?o.length>=u:o.length>u,specificity:l};if(b===void 0)return{matched:!1,specificity:0};if(g==="*"||Vt(g)){l+=$t;continue}if(g!==b)return{matched:!1,specificity:0};l+=bt}return{matched:o.length===a.length,specificity:l}}function Gt(t,n){return ct(t,n).matched}function Yt(t,n,e){let s;for(const o of e){const a=ct(t,o.from);if(!a.matched)continue;const l=ct(n,o.to);if(!l.matched)continue;const u=a.specificity+l.specificity;(!s||u>s.specificity)&&(s={transition:o.transition,specificity:u})}return(s==null?void 0:s.transition)??null}const Zt=768,jt=10,Qt=10;function Jt(t={}){const{preserveScroll:n=f=>f,resolvePath:e=f=>f}=t,s=typeof n=="function"?n:()=>n;let o=null,a=!1,l=!1;const u=()=>{const f=(o==null?void 0:o.clientWidth)??0,d=f>0?f:typeof window<"u"?window.innerWidth:0;return d>0&&d<Zt},g=()=>(l||(a=u(),l=!0),a),b=f=>{var R;const d=e(f),y=s(g());if(y===!1)return{preserves:!1,shared:!1,storageKey:`path:${d}`};if(y===!0)return{preserves:!0,shared:!1,storageKey:`path:${d}`};const E=((R=y.exclude)==null?void 0:R.some(C=>Gt(d,C)))??!1,P=!E&&!!y.key;return{preserves:!E,shared:P,storageKey:P?`shared:${y.key}`:`path:${d}`}},_=f=>b(f).preserves;let O=null;const T=new Map;let L=null,k=!1,W=0;const $=()=>{o&&L&&!k&&T.set(b(L).storageKey,{x:o.scrollLeft,y:o.scrollTop})},z=f=>{if(!o)return;const d=b(f);if(d.preserves&&d.shared&&!T.has(d.storageKey))return;const y=d.preserves&&T.has(d.storageKey)?T.get(d.storageKey):{x:0,y:0};let E=0;const P=()=>{if(!o)return;o.scrollTo({top:y.y,left:y.x}),!(Math.abs(o.scrollTop-y.y)<1&&Math.abs(o.scrollLeft-y.x)<1)&&E<jt&&(E++,requestAnimationFrame(P))};requestAnimationFrame(P)};return{initializeContext:(f,d)=>{k=!0;const y=++W;O=f,o||(o=zt(f),a=u(),l=!0,typeof ResizeObserver<"u"&&new ResizeObserver(()=>{a=u()}).observe(o),(o===document.documentElement?window:o).addEventListener("scroll",$,{passive:!0})),L=d,z(d);let E=0;const P=()=>{y===W&&(E++,E>=Qt?k=!1:requestAnimationFrame(P))};requestAnimationFrame(P)},calculateScrollOffset:(f,d)=>{const y=f?b(f).storageKey:null,E=y&&T.has(y)?T.get(y):{x:0,y:0},P=d?b(d):null,R=P!=null&&P.preserves?P.storageKey:null,C=R&&T.has(R)?T.get(R):{x:0,y:0};return{x:-C.x+E.x,y:-C.y+E.y}},evictScrollPosition:f=>{T.delete(b(f).storageKey)},shouldPreserve:_,getScrollContainer:()=>o,getPositionedParentElement:()=>O?Bt(O):document.body,getScrollPosition:f=>{const d=f?b(f).storageKey:null;return d&&T.has(d)?T.get(d):{x:0,y:0}},getIsMobile:g}}const St=30,Et=8,Tt=1.2,wt=30,te=600;function ee(){let t=null,n=!1,e=!1,s=null,o=null,a=!1;const l=(h,v)=>{for(let S=0;S<h.length;S++){const m=h.item(S);if(m&&m.identifier===v)return m}return null},u=()=>{s!==null&&(clearTimeout(s),s=null)},g=()=>{o!==null&&(clearTimeout(o),o=null)},b=()=>{n=!0,e=!0,u(),g(),s=setTimeout(()=>{n=!1,e=!1,s=null},te)},_=h=>{if(h.touches.length!==1){t=null;return}const v=h.touches.item(0);if(!v){t=null;return}const S=window.innerWidth,m=v.clientX<=St,w=v.clientX>=S-St;if(!m&&!w){t=null;return}t={identifier:v.identifier,startX:v.clientX,startY:v.clientY,fromLeftEdge:m,moved:!1}},O=h=>{if(!t)return;if(h.touches.length!==1){t=null;return}const v=l(h.touches,t.identifier);if(!v){t=null;return}const S=v.clientX-t.startX,m=v.clientY-t.startY,w=Math.abs(S),I=Math.abs(m);if(I>Et&&I>w*Tt){t=null;return}const f=t.fromLeftEdge?S>0:S<0;w>Et&&w>I*Tt&&f&&(t.moved=!0)},T=h=>{if(!t)return;const v=l(h.changedTouches,t.identifier);if(!v){t=null;return}const S=v.clientX-t.startX,m=t.fromLeftEdge?S>0:S<0;if(t.moved&&m&&Math.abs(S)>=wt){b(),t=null;return}t.moved&&Math.abs(S)>=wt&&b(),t=null},L=()=>{t&&(t.moved&&b(),t=null)};return{initialize:()=>{if(typeof window>"u"||a)return;a=!0;const h={passive:!0,capture:!0};window.addEventListener("touchstart",_,h),window.addEventListener("touchmove",O,h),window.addEventListener("touchend",T,h),window.addEventListener("touchcancel",L,h)},destroy:()=>{if(typeof window>"u"||!a)return;a=!1;const h={capture:!0};window.removeEventListener("touchstart",_,h),window.removeEventListener("touchmove",O,h),window.removeEventListener("touchend",T,h),window.removeEventListener("touchcancel",L,h),u(),g(),t=null,n=!1,e=!1},isSwipeBack:()=>{const h=n||e;return h&&u(),h},onPageEnter:()=>{n=!1,u(),g(),o=setTimeout(()=>{e=!1,o=null},0)}}}function ne(){let t=null;function n(){var s,o;t&&((s=t.outResolve)==null||s.call(t,null),(o=t.inResolve)==null||o.call(t,null),t=null)}function e(){if(t!=null&&t.from&&(t!=null&&t.to)&&(t!=null&&t.outResolve)&&(t!=null&&t.inResolve)){if(t.from===t.to){n();return}const s={from:t.from,to:t.to};t.outResolve(s),t.inResolve(s),t=null}}return{trigger(s,o){var l;o==="out"&&(t==null?void 0:t.to)===s&&!t.from&&((l=t.inResolve)==null||l.call(t,null),t={}),t&&(o==="out"&&t.from&&t.from!==s||o==="in"&&t.to&&t.to!==s)&&n(),t||(t={}),o==="out"?t.from=s:t.to=s},get(s){return new Promise(o=>{t||(t={}),s==="out"?t.outResolve=o:t.inResolve=o,e()})}}}const X=new Map;let Y=null,Pt=!1;function Rt(t,n){if(t instanceof HTMLElement&&X.has(t)&&!t.isConnected){const e=X.get(t);X.delete(t),queueMicrotask(()=>e(n))}for(const e of Array.from(t.childNodes))Rt(e,n)}function se(){if(Pt||typeof document>"u")return;Pt=!0,Y=new MutationObserver(n=>{for(const e of n){const s={parent:e.target,nextSibling:e.nextSibling};for(const o of Array.from(e.removedNodes))Rt(o,s)}});const t=()=>{Y==null||Y.observe(document.body,{childList:!0,subtree:!0})};document.body?t():document.addEventListener("DOMContentLoaded",t,{once:!0})}function ie(t,n){return se(),X.set(t,n),()=>{X.delete(t)}}const lt=new WeakMap;let Z=null;const j="none !important";function K(t){const n=t.style.getPropertyValue("display");return t.style.getPropertyPriority("display")?`${n} !important`:n}function oe(){return Z||(Z=new MutationObserver(t=>{for(const n of t){const e=n.target,s=lt.get(e);if(!s)continue;const o=K(e);o!==s.accounted&&(s.accounted=o,o===j?(s.reactHidden=!0,s.onHide()):o!=="none"&&s.reactHidden&&(s.reactHidden=!1,s.onShow()))}}),Z)}function re(t,n){const e=K(t),s={accounted:e,reactHidden:e===j,onHide:n.onHide,onShow:n.onShow};return lt.set(t,s),oe().observe(t,{attributes:!0,attributeFilter:["style"]}),{get isHidden(){return K(t)===j},setDisplay(o,a=!1){o===null?t.style.removeProperty("display"):t.style.setProperty("display",o,a?"important":""),s.accounted=K(t)},sync(){s.accounted=K(t),s.reactHidden=s.accounted===j},stop(){lt.delete(t)}}}function ce(t){return Array.isArray(t)}function Ct(t){const n=[];for(const e of t)ce(e)?n.push(...Ct(e)):n.push(e);return n}function le(t,n={}){const{transitions:e=[],middleware:s=(i,r)=>({from:i,to:r}),preserveScroll:o=i=>i}=t,a=n.host??new Mt,l=ne(),u=typeof e=="function"?e:()=>e,g=ee();g.initialize();const b=new Map,_=i=>{let r=b.get(i);return r===void 0&&(r=s(i,i).from,b.set(i,r)),r},{initializeContext:O,calculateScrollOffset:T,evictScrollPosition:L,shouldPreserve:k,getScrollContainer:W,getPositionedParentElement:$,getScrollPosition:z,getIsMobile:h}=Jt({preserveScroll:o,resolvePath:_}),v=new Map,S=()=>{const i=h();let r=v.get(i);return r||(r=Kt(Ct(u({isMobile:i}))),v.set(i,r)),r};let m=null,w=null;const I=new WeakMap,f=i=>{I.set(i,{parent:i.parentNode,nextSibling:i.nextSibling})},d=i=>{const r=I.get(i);return r||{parent:i.parentNode,nextSibling:i.nextSibling}},y=new WeakMap,E=new WeakMap;let P=0;const R=i=>{const r=typeof getComputedStyle<"u"?getComputedStyle(i).display:"";return r&&r!=="none"?r:"block"},C=(i,r)=>{r.visibleDisplay=i.style.getPropertyValue("display"),r.computedDisplay=R(i)},dt=(i,r)=>{if(E.get(i)!==r)return;E.delete(i);const c=y.get(i);c&&(c.savedCss!==null&&(i.style.cssText=c.savedCss,c.savedCss=null),c.intent==="hidden"?c.vis.setDisplay("none",!0):c.visibleDisplay?(c.vis.setDisplay(c.visibleDisplay,!1),C(i,c)):(c.vis.setDisplay(null),C(i,c)))},Ot=(i,r,c,p,A)=>{const M=p.element,D=A.element,N=(p.mode??"unmount")==="hidden",{parent:U,nextSibling:tt}=p.parent?{parent:p.parent,nextSibling:p.nextSibling}:d(M),V=T(r,c),et={scrollOffset:V,from:{scroll:z(r)},to:{scroll:z(c)},get scrollingElement(){return W()||document.documentElement},get positionedParent(){return $()}};let x;if(N){x=M,x.style.top=`${-1*((V==null?void 0:V.y)??0)}px`;const H=y.get(D);H&&H.savedCss===null&&(H.savedCss=D.style.cssText)}else x=M,Wt(x,et);k(r)||L(r);const G=N?++P:0;N&&(E.set(D,G),E.set(M,G));const yt=Promise.resolve(x),mt=Promise.resolve(D),gt=[],Nt={from:yt,to:mt,context:et,createElement:((H,nt="div")=>{const B=document.createElement(nt);return B.setAttribute("data-ssgoi-id",H),gt.push(B),B})},kt=Promise.resolve(i.prepare?i.prepare(Nt):{});Ft({from:yt,to:mt,extras:kt}).then(({from:H,to:nt,extras:B})=>{!N&&U&&(tt&&U.contains(tt)?U.insertBefore(x,tt):U.appendChild(x));const st=i.animation({from:H,to:nt,context:et,...B}),it=st.onComplete;st.onComplete=()=>{it==null||it(),N?(dt(M,G),dt(D,G)):x.parentNode&&x.parentNode.removeChild(x);for(const ot of gt)ot.parentNode&&ot.parentNode.removeChild(ot)},a.attach(st)})},q=(i,r)=>{const c=g.isSwipeBack();l.trigger(i,r),l.get(r).then(p=>{if(r==="in"&&g.onPageEnter(),!p)return;if(c){r==="out"&&p.from&&!k(p.from)&&L(p.from),m=null,w=null;return}if(r!=="in")return;const{from:A,to:M}=s(p.from,p.to),D=Yt(A,M,S()),J=m,N=w;m=null,w=null,!(!D||!J||!N)&&Ot(D,p.from,p.to,J,N)})},Lt=(i,r)=>{const c=y.get(i);if(!c)return;const p=c.intent==="hidden";if(c.intent="hidden",c.savedCss===null&&(c.savedCss=i.style.cssText),c.vis.setDisplay(c.computedDisplay||"block",!0),i.style.position="absolute",i.style.width="100%",i.style.left="0",p)return;const A=d(i);m={element:i,parent:A.parent,nextSibling:A.nextSibling,mode:"hidden"};const M=i.getAttribute("data-ssgoi-transition")??r;q(M,"out")},_t=(i,r)=>{const c=y.get(i);if(!c||c.intent==="visible")return;c.intent="visible",C(i,c),c.savedCss!==null&&(i.style.cssText=c.savedCss,c.visibleDisplay?c.vis.setDisplay(c.visibleDisplay,!1):c.vis.setDisplay(null)),O(i,r),w={element:i,parent:i.parentElement,nextSibling:i.nextElementSibling};const p=i.getAttribute("data-ssgoi-transition")??r;q(p,"in")},Dt=(i,r,c)=>{const p=y.get(i);if(p&&(p.vis.stop(),y.delete(i),E.delete(i),p.intent==="hidden")){(m==null?void 0:m.element)===i&&(m=null),(w==null?void 0:w.element)===i&&(w=null);return}const A=c??d(i);m={element:i,parent:A.parent,nextSibling:A.nextSibling,mode:"unmount"};const M=i.getAttribute("data-ssgoi-transition")??r;q(M,"out")},ft=new WeakSet,ht=(i,r)=>{if(ft.has(r))return;ft.add(r),f(r);const c=re(r,{onHide:()=>Lt(r,i),onShow:()=>_t(r,i)}),p={vis:c,savedCss:null,intent:c.isHidden?"hidden":"visible",visibleDisplay:"",computedDisplay:"block"};y.set(r,p),c.isHidden||(C(r,p),O(r,i),w={element:r,parent:r.parentElement,nextSibling:r.nextElementSibling},q(i,"in")),ie(r,A=>Dt(r,i,A))},pt=new Map;return{register:ht,refFor:i=>{let r=pt.get(i);return r||(r=c=>{c&&ht(i,c)},pt.set(i,r)),r}}}const xt="data-ssgoi-root",ae=`[${xt}]`,at="data-ssgoi-transition",At=`[${at}]`,ue="[data-ssgoi-clone]";function de(){return typeof MutationObserver<"u"&&typeof HTMLElement<"u"&&typeof Node<"u"}function fe(t){return t.nodeType===Node.ELEMENT_NODE}function he(t){return t instanceof HTMLElement}function pe(t,n){if(!de())return()=>{};t.setAttribute(xt,"");const e=l=>l.closest(ae)===t,s=l=>{if(!he(l)||!e(l)||l.closest(ue))return;const u=l.getAttribute(at);u!==null&&n.register(u,l)},o=l=>{if(fe(l)){l.matches(At)&&s(l);for(const u of l.querySelectorAll(At))s(u)}},a=new MutationObserver(l=>{for(const u of l){if(u.type==="attributes"){s(u.target);continue}for(const g of u.addedNodes)o(g)}});return a.observe(t,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[at]}),o(t),()=>a.disconnect()}exports.Animation=Q.Animation;exports.MultiAnimation=Q.MultiAnimation;exports.WebAnimation=Q.WebAnimation;exports.HostAnimation=Mt;exports.createSggoiTransitionContext=le;exports.observeSsgoiTransitions=pe;
|
|
1
|
+
"use strict";var It=Object.defineProperty;var Ht=(t,n,e)=>n in t?It(t,n,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[n]=e;var F=(t,n,e)=>Ht(t,typeof n!="symbol"?n+"":n,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("./multi-animation-6124HEke.cjs");class Mt extends Q.Animation{constructor(){super(...arguments);F(this,"child",null);F(this,"_state","idle");F(this,"_settled",!1);F(this,"listeners",new Set)}attach(e){const s=this.child;if(this.child=e,this._settled=!1,s){const l=s.getPose();s.complete(),e.matchInto(l)}e.playbackRate=this.playbackRate;const o=e.onComplete;e.onComplete=()=>{o==null||o(),this.child===e&&(this.child=null,this._state="idle",this._settled=!0),this.notify()};const a=e.onUpdate;e.onUpdate=l=>{var u;a==null||a(l),(u=this.onUpdate)==null||u.call(this,l),this.notify()},this._state==="paused"?e.pause():this._state==="reversing"?e.reverse():(this._state="playing",e.play()),this.notify()}play(){var e;this._state="playing",this._settled=!1,(e=this.child)==null||e.play(),this.notify()}reverse(){var e;this._state="reversing",this._settled=!1,(e=this.child)==null||e.reverse(),this.notify()}pause(){var e;this._state="paused",(e=this.child)==null||e.pause(),this.notify()}complete(){var e;(e=this.child)==null||e.complete(),this.notify()}get isAnimating(){var e;return((e=this.child)==null?void 0:e.isAnimating)??!1}get isPaused(){return this._state==="paused"}get isComplete(){return this._settled&&!this.child}get isReversing(){var e;return((e=this.child)==null?void 0:e.isReversing)??this._state==="reversing"}get progress(){var e;return((e=this.child)==null?void 0:e.progress)??0}findTimeForProgress(e){var s;return((s=this.child)==null?void 0:s.findTimeForProgress(e))??null}get playbackRate(){return super.playbackRate}set playbackRate(e){super.playbackRate=e,this.child&&(this.child.playbackRate=e),this.notify()}getPose(){var e;return((e=this.child)==null?void 0:e.getPose())??[]}getTimeline(){var e;return((e=this.child)==null?void 0:e.getTimeline())??[]}matchInto(e){var s;(s=this.child)==null||s.matchInto(e)}get activeChild(){return this.child}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}notify(){for(const e of this.listeners)e()}}const Wt=(t,n)=>{var e;t.style.position="absolute",t.style.width="100%",t.style.top=`${-1*(((e=n==null?void 0:n.scrollOffset)==null?void 0:e.y)??0)}px`,t.style.left="0"},vt=new Set(["auto","scroll","overlay"]),zt=t=>{let n=t.parentElement;for(;n&&n!==document.body;){const e=window.getComputedStyle(n);if(vt.has(e.overflowY)||vt.has(e.overflowX))return n;n=n.parentElement}return document.documentElement},Bt=t=>{let n=t.parentElement;for(;n&&n!==document.body;){const e=window.getComputedStyle(n).position;if(e==="relative"||e==="absolute"||e==="fixed"||e==="sticky")return n;n=n.parentElement}return document.body};function Ft(t){const n=Object.keys(t);return Promise.all(n.map(e=>t[e])).then(e=>{const s={};return n.forEach((o,a)=>{s[o]=e[a]}),s})}function Kt(t){const n=t.filter(e=>e.symmetric).map(e=>({from:e.to,to:e.from,transition:e.transition}));return[...t,...n]}const Xt=1e6,bt=100,$t=10;function qt(t){const n=t.trim(),e=n.indexOf("#"),s=n.indexOf("?"),o=[e,s].filter(a=>a>=0).reduce((a,l)=>Math.min(a,l),n.length);return n.slice(0,o)}function ut(t){const n=qt(t);try{if(/^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(n))return ut(new URL(n).pathname)}catch{}const s=(n.startsWith("/")?n:`/${n}`).replace(/\/+/g,"/");return(s.length>1?s.replace(/\/+$/g,""):s)||"/"}function Ut(t){const n=t.trim();return n==="*"?"*":ut(n)}function rt(t){return t==="/"?[]:t.slice(1).split("/")}function Vt(t){return t.startsWith(":")||t.startsWith("[")&&t.endsWith("]")||t.startsWith("{")&&t.endsWith("}")}function ct(t,n){const e=ut(t),s=Ut(n);if(s==="*")return{matched:!0,specificity:0};if(e===s)return{matched:!0,specificity:Xt+rt(s).length*bt};const o=rt(e),a=rt(s);let l=0;for(let u=0;u<a.length;u++){const g=a[u],b=o[u],_=u===a.length-1;if(g===void 0)return{matched:!1,specificity:0};if((g==="*"||g==="**")&&_)return{matched:g==="**"?o.length>=u:o.length>u,specificity:l};if(b===void 0)return{matched:!1,specificity:0};if(g==="*"||Vt(g)){l+=$t;continue}if(g!==b)return{matched:!1,specificity:0};l+=bt}return{matched:o.length===a.length,specificity:l}}function Gt(t,n){return ct(t,n).matched}function Yt(t,n,e){let s;for(const o of e){const a=ct(t,o.from);if(!a.matched)continue;const l=ct(n,o.to);if(!l.matched)continue;const u=a.specificity+l.specificity;(!s||u>s.specificity)&&(s={transition:o.transition,specificity:u})}return(s==null?void 0:s.transition)??null}const Zt=768,jt=10,Qt=10;function Jt(t={}){const{preserveScroll:n=f=>f,resolvePath:e=f=>f}=t,s=typeof n=="function"?n:()=>n;let o=null,a=!1,l=!1;const u=()=>{const f=(o==null?void 0:o.clientWidth)??0,d=f>0?f:typeof window<"u"?window.innerWidth:0;return d>0&&d<Zt},g=()=>(l||(a=u(),l=!0),a),b=f=>{var R;const d=e(f),y=s(g());if(y===!1)return{preserves:!1,shared:!1,storageKey:`path:${d}`};if(y===!0)return{preserves:!0,shared:!1,storageKey:`path:${d}`};const E=((R=y.exclude)==null?void 0:R.some(C=>Gt(d,C)))??!1,P=!E&&!!y.key;return{preserves:!E,shared:P,storageKey:P?`shared:${y.key}`:`path:${d}`}},_=f=>b(f).preserves;let O=null;const T=new Map;let L=null,k=!1,W=0;const $=()=>{o&&L&&!k&&T.set(b(L).storageKey,{x:o.scrollLeft,y:o.scrollTop})},z=f=>{if(!o)return;const d=b(f);if(d.preserves&&d.shared&&!T.has(d.storageKey))return;const y=d.preserves&&T.has(d.storageKey)?T.get(d.storageKey):{x:0,y:0};let E=0;const P=()=>{if(!o)return;o.scrollTo({top:y.y,left:y.x}),!(Math.abs(o.scrollTop-y.y)<1&&Math.abs(o.scrollLeft-y.x)<1)&&E<jt&&(E++,requestAnimationFrame(P))};requestAnimationFrame(P)};return{initializeContext:(f,d)=>{k=!0;const y=++W;O=f,o||(o=zt(f),a=u(),l=!0,typeof ResizeObserver<"u"&&new ResizeObserver(()=>{a=u()}).observe(o),(o===document.documentElement?window:o).addEventListener("scroll",$,{passive:!0})),L=d,z(d);let E=0;const P=()=>{y===W&&(E++,E>=Qt?k=!1:requestAnimationFrame(P))};requestAnimationFrame(P)},calculateScrollOffset:(f,d)=>{const y=f?b(f).storageKey:null,E=y&&T.has(y)?T.get(y):{x:0,y:0},P=d?b(d):null,R=P!=null&&P.preserves?P.storageKey:null,C=R&&T.has(R)?T.get(R):{x:0,y:0};return{x:-C.x+E.x,y:-C.y+E.y}},evictScrollPosition:f=>{T.delete(b(f).storageKey)},shouldPreserve:_,getScrollContainer:()=>o,getPositionedParentElement:()=>O?Bt(O):document.body,getScrollPosition:f=>{const d=f?b(f).storageKey:null;return d&&T.has(d)?T.get(d):{x:0,y:0}},getIsMobile:g}}const St=30,Et=8,Tt=1.2,wt=30,te=600;function ee(){let t=null,n=!1,e=!1,s=null,o=null,a=!1;const l=(h,v)=>{for(let S=0;S<h.length;S++){const m=h.item(S);if(m&&m.identifier===v)return m}return null},u=()=>{s!==null&&(clearTimeout(s),s=null)},g=()=>{o!==null&&(clearTimeout(o),o=null)},b=()=>{n=!0,e=!0,u(),g(),s=setTimeout(()=>{n=!1,e=!1,s=null},te)},_=h=>{if(h.touches.length!==1){t=null;return}const v=h.touches.item(0);if(!v){t=null;return}const S=window.innerWidth,m=v.clientX<=St,w=v.clientX>=S-St;if(!m&&!w){t=null;return}t={identifier:v.identifier,startX:v.clientX,startY:v.clientY,fromLeftEdge:m,moved:!1}},O=h=>{if(!t)return;if(h.touches.length!==1){t=null;return}const v=l(h.touches,t.identifier);if(!v){t=null;return}const S=v.clientX-t.startX,m=v.clientY-t.startY,w=Math.abs(S),I=Math.abs(m);if(I>Et&&I>w*Tt){t=null;return}const f=t.fromLeftEdge?S>0:S<0;w>Et&&w>I*Tt&&f&&(t.moved=!0)},T=h=>{if(!t)return;const v=l(h.changedTouches,t.identifier);if(!v){t=null;return}const S=v.clientX-t.startX,m=t.fromLeftEdge?S>0:S<0;if(t.moved&&m&&Math.abs(S)>=wt){b(),t=null;return}t.moved&&Math.abs(S)>=wt&&b(),t=null},L=()=>{t&&(t.moved&&b(),t=null)};return{initialize:()=>{if(typeof window>"u"||a)return;a=!0;const h={passive:!0,capture:!0};window.addEventListener("touchstart",_,h),window.addEventListener("touchmove",O,h),window.addEventListener("touchend",T,h),window.addEventListener("touchcancel",L,h)},destroy:()=>{if(typeof window>"u"||!a)return;a=!1;const h={capture:!0};window.removeEventListener("touchstart",_,h),window.removeEventListener("touchmove",O,h),window.removeEventListener("touchend",T,h),window.removeEventListener("touchcancel",L,h),u(),g(),t=null,n=!1,e=!1},isSwipeBack:()=>{const h=n||e;return h&&u(),h},onPageEnter:()=>{n=!1,u(),g(),o=setTimeout(()=>{e=!1,o=null},0)}}}function ne(){let t=null;function n(){var s,o;t&&((s=t.outResolve)==null||s.call(t,null),(o=t.inResolve)==null||o.call(t,null),t=null)}function e(){if(t!=null&&t.from&&(t!=null&&t.to)&&(t!=null&&t.outResolve)&&(t!=null&&t.inResolve)){if(t.from===t.to){n();return}const s={from:t.from,to:t.to};t.outResolve(s),t.inResolve(s),t=null}}return{trigger(s,o){var l;o==="out"&&(t==null?void 0:t.to)===s&&!t.from&&((l=t.inResolve)==null||l.call(t,null),t={}),t&&(o==="out"&&t.from&&t.from!==s||o==="in"&&t.to&&t.to!==s)&&n(),t||(t={}),o==="out"?t.from=s:t.to=s},get(s){return new Promise(o=>{t||(t={}),s==="out"?t.outResolve=o:t.inResolve=o,e()})}}}const X=new Map;let Y=null,Pt=!1;function Rt(t,n){if(t instanceof HTMLElement&&X.has(t)&&!t.isConnected){const e=X.get(t);X.delete(t),queueMicrotask(()=>e(n))}for(const e of Array.from(t.childNodes))Rt(e,n)}function se(){if(Pt||typeof document>"u")return;Pt=!0,Y=new MutationObserver(n=>{for(const e of n){const s={parent:e.target,nextSibling:e.nextSibling};for(const o of Array.from(e.removedNodes))Rt(o,s)}});const t=()=>{Y==null||Y.observe(document.body,{childList:!0,subtree:!0})};document.body?t():document.addEventListener("DOMContentLoaded",t,{once:!0})}function ie(t,n){return se(),X.set(t,n),()=>{X.delete(t)}}const lt=new WeakMap;let Z=null;const j="none !important";function K(t){const n=t.style.getPropertyValue("display");return t.style.getPropertyPriority("display")?`${n} !important`:n}function oe(){return Z||(Z=new MutationObserver(t=>{for(const n of t){const e=n.target,s=lt.get(e);if(!s)continue;const o=K(e);o!==s.accounted&&(s.accounted=o,o===j?(s.reactHidden=!0,s.onHide()):o!=="none"&&s.reactHidden&&(s.reactHidden=!1,s.onShow()))}}),Z)}function re(t,n){const e=K(t),s={accounted:e,reactHidden:e===j,onHide:n.onHide,onShow:n.onShow};return lt.set(t,s),oe().observe(t,{attributes:!0,attributeFilter:["style"]}),{get isHidden(){return K(t)===j},setDisplay(o,a=!1){o===null?t.style.removeProperty("display"):t.style.setProperty("display",o,a?"important":""),s.accounted=K(t)},sync(){s.accounted=K(t),s.reactHidden=s.accounted===j},stop(){lt.delete(t)}}}function ce(t){return Array.isArray(t)}function Ct(t){const n=[];for(const e of t)ce(e)?n.push(...Ct(e)):n.push(e);return n}function le(t,n={}){const{transitions:e=[],middleware:s=(i,r)=>({from:i,to:r}),preserveScroll:o=i=>i}=t,a=n.host??new Mt,l=ne(),u=typeof e=="function"?e:()=>e,g=ee();g.initialize();const b=new Map,_=i=>{let r=b.get(i);return r===void 0&&(r=s(i,i).from,b.set(i,r)),r},{initializeContext:O,calculateScrollOffset:T,evictScrollPosition:L,shouldPreserve:k,getScrollContainer:W,getPositionedParentElement:$,getScrollPosition:z,getIsMobile:h}=Jt({preserveScroll:o,resolvePath:_}),v=new Map,S=()=>{const i=h();let r=v.get(i);return r||(r=Kt(Ct(u({isMobile:i}))),v.set(i,r)),r};let m=null,w=null;const I=new WeakMap,f=i=>{I.set(i,{parent:i.parentNode,nextSibling:i.nextSibling})},d=i=>{const r=I.get(i);return r||{parent:i.parentNode,nextSibling:i.nextSibling}},y=new WeakMap,E=new WeakMap;let P=0;const R=i=>{const r=typeof getComputedStyle<"u"?getComputedStyle(i).display:"";return r&&r!=="none"?r:"block"},C=(i,r)=>{r.visibleDisplay=i.style.getPropertyValue("display"),r.computedDisplay=R(i)},dt=(i,r)=>{if(E.get(i)!==r)return;E.delete(i);const c=y.get(i);c&&(c.savedCss!==null&&(i.style.cssText=c.savedCss,c.savedCss=null),c.intent==="hidden"?c.vis.setDisplay("none",!0):c.visibleDisplay?(c.vis.setDisplay(c.visibleDisplay,!1),C(i,c)):(c.vis.setDisplay(null),C(i,c)))},Ot=(i,r,c,p,A)=>{const M=p.element,D=A.element,N=(p.mode??"unmount")==="hidden",{parent:U,nextSibling:tt}=p.parent?{parent:p.parent,nextSibling:p.nextSibling}:d(M),V=T(r,c),et={scrollOffset:V,from:{scroll:z(r)},to:{scroll:z(c)},get scrollingElement(){return W()||document.documentElement},get positionedParent(){return $()}};let x;if(N){x=M,x.style.top=`${-1*((V==null?void 0:V.y)??0)}px`;const H=y.get(D);H&&H.savedCss===null&&(H.savedCss=D.style.cssText)}else x=M,Wt(x,et);k(r)||L(r);const G=N?++P:0;N&&(E.set(D,G),E.set(M,G));const yt=Promise.resolve(x),mt=Promise.resolve(D),gt=[],Nt={from:yt,to:mt,context:et,createElement:((H,nt="div")=>{const B=document.createElement(nt);return B.setAttribute("data-ssgoi-id",H),gt.push(B),B})},kt=Promise.resolve(i.prepare?i.prepare(Nt):{});Ft({from:yt,to:mt,extras:kt}).then(({from:H,to:nt,extras:B})=>{!N&&U&&(tt&&U.contains(tt)?U.insertBefore(x,tt):U.appendChild(x));const st=i.animation({from:H,to:nt,context:et,...B}),it=st.onComplete;st.onComplete=()=>{it==null||it(),N?(dt(M,G),dt(D,G)):x.parentNode&&x.parentNode.removeChild(x);for(const ot of gt)ot.parentNode&&ot.parentNode.removeChild(ot)},a.attach(st)})},q=(i,r)=>{const c=g.isSwipeBack();l.trigger(i,r),l.get(r).then(p=>{if(r==="in"&&g.onPageEnter(),!p)return;if(c){r==="out"&&p.from&&!k(p.from)&&L(p.from),m=null,w=null;return}if(r!=="in")return;const{from:A,to:M}=s(p.from,p.to),D=Yt(A,M,S()),J=m,N=w;m=null,w=null,!(!D||!J||!N)&&Ot(D,p.from,p.to,J,N)})},Lt=(i,r)=>{const c=y.get(i);if(!c)return;const p=c.intent==="hidden";if(c.intent="hidden",c.savedCss===null&&(c.savedCss=i.style.cssText),c.vis.setDisplay(c.computedDisplay||"block",!0),i.style.position="absolute",i.style.width="100%",i.style.left="0",p)return;const A=d(i);m={element:i,parent:A.parent,nextSibling:A.nextSibling,mode:"hidden"};const M=i.getAttribute("data-ssgoi-transition")??r;q(M,"out")},_t=(i,r)=>{const c=y.get(i);if(!c||c.intent==="visible")return;c.intent="visible",C(i,c),c.savedCss!==null&&(i.style.cssText=c.savedCss,c.visibleDisplay?c.vis.setDisplay(c.visibleDisplay,!1):c.vis.setDisplay(null)),O(i,r),w={element:i,parent:i.parentElement,nextSibling:i.nextElementSibling};const p=i.getAttribute("data-ssgoi-transition")??r;q(p,"in")},Dt=(i,r,c)=>{const p=y.get(i);if(p&&(p.vis.stop(),y.delete(i),E.delete(i),p.intent==="hidden")){(m==null?void 0:m.element)===i&&(m=null),(w==null?void 0:w.element)===i&&(w=null);return}const A=c??d(i);m={element:i,parent:A.parent,nextSibling:A.nextSibling,mode:"unmount"};const M=i.getAttribute("data-ssgoi-transition")??r;q(M,"out")},ft=new WeakSet,ht=(i,r)=>{if(ft.has(r))return;ft.add(r),f(r);const c=re(r,{onHide:()=>Lt(r,i),onShow:()=>_t(r,i)}),p={vis:c,savedCss:null,intent:c.isHidden?"hidden":"visible",visibleDisplay:"",computedDisplay:"block"};y.set(r,p),c.isHidden||(C(r,p),O(r,i),w={element:r,parent:r.parentElement,nextSibling:r.nextElementSibling},q(i,"in")),ie(r,A=>Dt(r,i,A))},pt=new Map;return{register:ht,refFor:i=>{let r=pt.get(i);return r||(r=c=>{c&&ht(i,c)},pt.set(i,r)),r}}}const xt="data-ssgoi-root",ae=`[${xt}]`,at="data-ssgoi-transition",At=`[${at}]`,ue="[data-ssgoi-clone]";function de(){return typeof MutationObserver<"u"&&typeof HTMLElement<"u"&&typeof Node<"u"}function fe(t){return t.nodeType===Node.ELEMENT_NODE}function he(t){return t instanceof HTMLElement}function pe(t,n){if(!de())return()=>{};t.setAttribute(xt,"");const e=l=>l.closest(ae)===t,s=l=>{if(!he(l)||!e(l)||l.closest(ue))return;const u=l.getAttribute(at);u!==null&&n.register(u,l)},o=l=>{if(fe(l)){l.matches(At)&&s(l);for(const u of l.querySelectorAll(At))s(u)}},a=new MutationObserver(l=>{for(const u of l){if(u.type==="attributes"){s(u.target);continue}for(const g of u.addedNodes)o(g)}});return a.observe(t,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[at]}),o(t),()=>a.disconnect()}exports.Animation=Q.Animation;exports.MultiAnimation=Q.MultiAnimation;exports.WebAnimation=Q.WebAnimation;exports.HostAnimation=Mt;exports.createSggoiTransitionContext=le;exports.observeSsgoiTransitions=pe;
|
package/dist/internal.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
var Nt = Object.defineProperty;
|
|
2
2
|
var kt = (t, n, e) => n in t ? Nt(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e;
|
|
3
3
|
var F = (t, n, e) => kt(t, typeof n != "symbol" ? n + "" : n, e);
|
|
4
|
-
import { A as It } from "./multi-animation-
|
|
5
|
-
import { M as Ee, W as we } from "./multi-animation-
|
|
4
|
+
import { A as It } from "./multi-animation-ZFZBDBGr.js";
|
|
5
|
+
import { M as Ee, W as we } from "./multi-animation-ZFZBDBGr.js";
|
|
6
6
|
class Ht extends It {
|
|
7
7
|
constructor() {
|
|
8
8
|
super(...arguments);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var F=Object.defineProperty;var b=(a,i,t)=>i in a?F(a,i,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[i]=t;var r=(a,i,t)=>b(a,typeof i!="symbol"?i+"":i,t);class d{constructor(){r(this,"_playbackRate",1);r(this,"onUpdate");r(this,"onComplete")}get playbackRate(){return this._playbackRate}set playbackRate(i){this._playbackRate=i}}const R=.01,T=.01,g=.05;function k(a){return new Promise(i=>{requestAnimationFrame(()=>{requestAnimationFrame(()=>{i()})})})}const w=1e3/60,y=1e3/30,C=y+1;class A{constructor(){r(this,"drivers",new Set);r(this,"observers",new Set);r(this,"frameRequest",null);r(this,"previousTimestamp",null);r(this,"tick",i=>{this.frameRequest=null;const t=this.previousTimestamp===null?w:Math.max(0,i-this.previousTimestamp);this.previousTimestamp=i;const e={delta:Math.min(t,y),rawDelta:t};this.runPhase(this.drivers,e),this.runPhase(this.observers,e),this.hasCallbacks()?this.requestFrame():this.previousTimestamp=null})}subscribe(i,t="drive"){const e=t==="drive"?this.drivers:this.observers;return e.add(i),this.requestFrame(),()=>{e.delete(i),this.stopIfIdle()}}requestFrame(){this.frameRequest!==null||!this.hasCallbacks()||(this.frameRequest=requestAnimationFrame(this.tick))}runPhase(i,t){for(const e of[...i])i.has(e)&&e(t)}hasCallbacks(){return this.drivers.size>0||this.observers.size>0}stopIfIdle(){this.hasCallbacks()||(this.frameRequest!==null&&typeof cancelAnimationFrame<"u"&&cancelAnimationFrame(this.frameRequest),this.frameRequest=null,this.previousTimestamp=null)}}const S=new A,p=1e3/60,P=2;class O extends d{constructor(t){super();r(this,"element");r(this,"integrator");r(this,"styleFn");r(this,"lowerBound");r(this,"upperBound");r(this,"currentValue");r(this,"currentVelocity",0);r(this,"frames",[]);r(this,"waapi",null);r(this,"runId",0);r(this,"waitingForStart",!1);r(this,"startReady",!1);r(this,"pendingFirstFrame");r(this,"stopStartupClock",null);r(this,"startupStableFrames",0);r(this,"running",!1);r(this,"paused",!1);r(this,"settled",!1);r(this,"reversing",!1);this.element=t.element,this.integrator=t.integrator,this.styleFn=t.style,this.lowerBound=t.lowerBound??0,this.upperBound=t.upperBound??1,this.currentValue=this.lowerBound,this.onUpdate=t.onUpdate,this.onComplete=t.onComplete}play(){if(this.reversing=!1,this.paused&&this.waapi){if(this.paused=!1,this.running=!0,this.waitingForStart){this.startReady&&this.startFramePacedPlayback(this.waapi);return}this.waapi.play();return}this.runToward(this.upperBound)}reverse(){this.reversing=!0,this.runToward(this.lowerBound)}pause(){var t,e;this.running&&(this.captureLiveState(),(t=this.waapi)==null||t.pause(),(e=this.stopStartupClock)==null||e.call(this),this.stopStartupClock=null,this.running=!1,this.paused=!0)}complete(){var t;this.clearWaapi(),this.running=!1,this.paused=!1,this.currentValue=this.upperBound,this.currentVelocity=0,this.applyStyleAt(this.currentValue),this.settled=!0,(t=this.onComplete)==null||t.call(this)}releaseFill(){this.clearWaapi()}get isAnimating(){return this.running}get isPaused(){return this.paused}get isComplete(){return this.settled}get isReversing(){return this.reversing}get progress(){this.running&&this.captureLiveState();const t=this.upperBound-this.lowerBound;if(t===0)return 0;const e=(this.currentValue-this.lowerBound)/t;return e<0?0:e>1?1:e}findTimeForProgress(t){if(this.frames.length<2)return null;const e=this.upperBound-this.lowerBound;if(e===0)return 0;for(const s of this.frames)if((s.position-this.lowerBound)/e>=t)return s.time;return this.frames[this.frames.length-1].time}get playbackRate(){return super.playbackRate}set playbackRate(t){super.playbackRate=t,this.waapi&&(this.waapi.playbackRate=t)}getPose(){return this.running&&this.captureLiveState(),[{element:this.element,value:this.currentValue,velocity:this.currentVelocity}]}getTimeline(){const t=this.frames.map(e=>{const s=e.position,n=this.lowerBound+this.upperBound-s;return{time:e.time,value:e.position,velocity:e.velocity,style:this.styleFn(s,n)}});return[{element:this.element,frames:t}]}matchInto(t){const e=t.find(s=>s.element===this.element);e&&(this.currentValue=e.value,this.currentVelocity=e.velocity)}runToward(t){var o;if(this.running&&this.captureLiveState(),this.clearWaapi(),this.running=!1,this.paused=!1,this.settled=!1,this.frames=B(this.integrator,this.currentValue,t,this.currentVelocity),this.frames.length===0){this.currentValue=t,this.currentVelocity=0,this.applyStyleAt(t),this.settled=!0,(o=this.onComplete)==null||o.call(this);return}const e=this.frames.map(c=>{const m=c.position,v=this.lowerBound+this.upperBound-m;return this.styleFn(m,v)}),s=e[0],n=this.frames[this.frames.length-1],h=n.time,u=++this.runId,l=this.element.animate(e,{duration:h,fill:"both",easing:"linear",composite:"replace"});l.playbackRate=this.playbackRate,l.currentTime=0,l.pause(),this.waapi=l,this.waitingForStart=!0,this.startReady=!1,this.pendingFirstFrame=s,this.running=!0,l.onfinish=()=>{var c;!this.running||this.waapi!==l||(this.running=!1,this.settled=!0,this.currentValue=n.position,this.currentVelocity=0,(c=this.onComplete)==null||c.call(this))},this.startWhenReady(l,u)}clearWaapi(){var t,e;this.runId++,(t=this.waapi)==null||t.cancel(),this.waapi=null,this.waitingForStart=!1,this.startReady=!1,this.pendingFirstFrame=void 0,(e=this.stopStartupClock)==null||e.call(this),this.stopStartupClock=null,this.startupStableFrames=0}captureLiveState(){if(this.frames.length===0)return;const t=f(this.waapi);if(t===null)return;const{position:e,velocity:s}=E(this.frames,t);this.currentValue=e,this.currentVelocity=s}async startWhenReady(t,e){try{await t.ready,typeof requestAnimationFrame<"u"&&await k(this.element)}catch{return}this.runId!==e||this.waapi!==t||(this.startReady=!0,!(!this.running||this.paused)&&this.startFramePacedPlayback(t))}startFramePacedPlayback(t){if(!(this.waapi!==t||!this.waitingForStart||!this.startReady||this.stopStartupClock)){if(this.pendingFirstFrame)for(const e of Object.keys(this.pendingFirstFrame))this.element.style[e]="";if(this.pendingFirstFrame=void 0,typeof requestAnimationFrame>"u"||this.playbackRate<0){this.handOffToWaapi(t);return}this.startupStableFrames=0,this.stopStartupClock=S.subscribe(e=>{this.advanceFramePacedStartup(t,e)})}}advanceFramePacedStartup(t,e){if(this.waapi!==t||!this.running||this.paused||!this.waitingForStart)return;const s=this.frames[this.frames.length-1];if(!s)return;const n=f(t)??0,h=Math.min(s.time,n+e.delta*Math.max(0,this.playbackRate));if(t.currentTime=h,this.captureLiveState(),h>=s.time){this.finishFramePacedRun(t,s);return}e.rawDelta<=C?this.startupStableFrames++:this.startupStableFrames=0,!(this.startupStableFrames<P)&&this.handOffToWaapi(t)}handOffToWaapi(t){var e;this.waapi!==t||!this.running||this.paused||((e=this.stopStartupClock)==null||e.call(this),this.stopStartupClock=null,this.waitingForStart=!1,this.startReady=!1,this.startupStableFrames=0,t.play())}finishFramePacedRun(t,e){var s,n;this.waapi!==t||!this.running||((s=this.stopStartupClock)==null||s.call(this),this.stopStartupClock=null,this.waitingForStart=!1,this.startReady=!1,this.startupStableFrames=0,this.running=!1,this.settled=!0,this.currentValue=e.position,this.currentVelocity=0,(n=this.onComplete)==null||n.call(this))}applyStyleAt(t){const e=this.lowerBound+this.upperBound-t,s=this.styleFn(t,e);for(const[n,h]of Object.entries(s))this.element.style[n]=typeof h=="number"?String(h):h}}function B(a,i,t,e){if(i===t&&e===0)return[];const s=600;let n={position:i,velocity:e},h=0;const u=[];for(let l=0;l<s;l++){const o=l*p;if(u.push({time:o,position:n.position,velocity:n.velocity}),n=a.step(n,t,p/1e3),a.isSettled(n,t)){if(h+=p/1e3,h>=g){u.push({time:(l+1)*p,position:t,velocity:0});break}}else h=0}return u}function E(a,i){if(a.length===0)return{position:0,velocity:0};const t=a[0],e=a[a.length-1];if(i<=0)return{position:t.position,velocity:t.velocity};if(i>=e.time)return{position:e.position,velocity:e.velocity};let s=0,n=a.length-1;for(;s<n-1;){const o=s+n>>1;a[o].time<=i?s=o:n=o}const h=a[s],u=a[n],l=(i-h.time)/(u.time-h.time);return{position:h.position+(u.position-h.position)*l,velocity:h.velocity+(u.velocity-h.velocity)*l}}function f(a){const i=a==null?void 0:a.currentTime;return typeof i=="number"?i:null}class _ extends d{constructor(t,e={}){super();r(this,"children");r(this,"startAt");r(this,"pendingComplete",0);r(this,"running",!1);r(this,"pendingStartObservers",[]);this.children=t,(e.mode??"parallel")==="sequence"?this.startAt=t.map((s,n)=>n===0?0:1):this.startAt=e.startAt??[]}play(){this.startRun("play")}reverse(){this.startRun("reverse")}pause(){this.running=!1,this.clearPendingStartObservers();for(const t of this.children)t.pause()}complete(){var t;this.running=!1,this.clearPendingStartObservers();for(const e of this.children)e.complete();(t=this.onComplete)==null||t.call(this)}get progress(){if(this.children.length===0)return 0;let t=0;for(const e of this.children)t+=e.progress;return t/this.children.length}getPose(){return this.children.flatMap(t=>t.getPose())}getTimeline(){return this.children.flatMap(t=>t.getTimeline())}matchInto(t){}get isAnimating(){return this.children.some(t=>t.isAnimating)}get isPaused(){return this.children.some(t=>t.isPaused)&&this.children.every(t=>t.isPaused||t.isComplete)}get isComplete(){return this.children.every(t=>t.isComplete)}get isReversing(){return this.children.some(t=>t.isReversing)}get playbackRate(){return super.playbackRate}set playbackRate(t){super.playbackRate=t;for(const e of this.children)e.playbackRate=t}startRun(t){if(this.running&&this.pause(),this.running=!0,this.pendingComplete=this.children.length,this.pendingComplete===0){this.handleFinished();return}for(const e of this.children){const s=e.onComplete;e.onComplete=()=>{s==null||s(),this.handleChildComplete()}}this.scheduleStart(0,t)}scheduleStart(t,e){if(!this.running||t>=this.children.length)return;this.children[t][e]();const s=t+1;if(s>=this.children.length)return;const n=this.startAt[s];if(n===void 0||n<=0){this.scheduleStart(s,e);return}const h=this.children[t];if(this.hasReachedThreshold(h,n,e)){this.scheduleStart(s,e);return}const u=S.subscribe(()=>{this.running&&this.hasReachedThreshold(h,n,e)&&(u(),this.pendingStartObservers=this.pendingStartObservers.filter(l=>l!==u),this.scheduleStart(s,e))},"observe");this.pendingStartObservers.push(u)}hasReachedThreshold(t,e,s){return t.isComplete?!0:(s==="play"?t.progress:1-t.progress)>=e}clearPendingStartObservers(){for(const t of this.pendingStartObservers)t();this.pendingStartObservers=[]}handleChildComplete(){this.pendingComplete--,this.pendingComplete<=0&&this.handleFinished()}handleFinished(){var t;this.running=!1,this.clearPendingStartObservers(),(t=this.onComplete)==null||t.call(this)}findTimeForProgress(t){return null}}exports.Animation=d;exports.MultiAnimation=_;exports.POSITION_THRESHOLD=R;exports.SETTLE_THRESHOLD=g;exports.VELOCITY_THRESHOLD=T;exports.WebAnimation=O;
|
|
@@ -0,0 +1,439 @@
|
|
|
1
|
+
var S = Object.defineProperty;
|
|
2
|
+
var F = (a, i, t) => i in a ? S(a, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[i] = t;
|
|
3
|
+
var r = (a, i, t) => F(a, typeof i != "symbol" ? i + "" : i, t);
|
|
4
|
+
class f {
|
|
5
|
+
constructor() {
|
|
6
|
+
/** Current playback rate (1 = realtime, 0 = paused, negative = backwards) */
|
|
7
|
+
r(this, "_playbackRate", 1);
|
|
8
|
+
/** Fired every frame with the most recent value. Optional. */
|
|
9
|
+
r(this, "onUpdate");
|
|
10
|
+
/** Fired once when the animation settles. */
|
|
11
|
+
r(this, "onComplete");
|
|
12
|
+
}
|
|
13
|
+
get playbackRate() {
|
|
14
|
+
return this._playbackRate;
|
|
15
|
+
}
|
|
16
|
+
set playbackRate(i) {
|
|
17
|
+
this._playbackRate = i;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
const O = 0.01, V = 0.01, b = 0.05;
|
|
21
|
+
function R(a) {
|
|
22
|
+
return new Promise((i) => {
|
|
23
|
+
requestAnimationFrame(() => {
|
|
24
|
+
requestAnimationFrame(() => {
|
|
25
|
+
i();
|
|
26
|
+
});
|
|
27
|
+
});
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
const T = 1e3 / 60, g = 1e3 / 30, k = g + 1;
|
|
31
|
+
class w {
|
|
32
|
+
constructor() {
|
|
33
|
+
r(this, "drivers", /* @__PURE__ */ new Set());
|
|
34
|
+
r(this, "observers", /* @__PURE__ */ new Set());
|
|
35
|
+
r(this, "frameRequest", null);
|
|
36
|
+
r(this, "previousTimestamp", null);
|
|
37
|
+
r(this, "tick", (i) => {
|
|
38
|
+
this.frameRequest = null;
|
|
39
|
+
const t = this.previousTimestamp === null ? T : Math.max(0, i - this.previousTimestamp);
|
|
40
|
+
this.previousTimestamp = i;
|
|
41
|
+
const e = {
|
|
42
|
+
delta: Math.min(t, g),
|
|
43
|
+
rawDelta: t
|
|
44
|
+
};
|
|
45
|
+
this.runPhase(this.drivers, e), this.runPhase(this.observers, e), this.hasCallbacks() ? this.requestFrame() : this.previousTimestamp = null;
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
subscribe(i, t = "drive") {
|
|
49
|
+
const e = t === "drive" ? this.drivers : this.observers;
|
|
50
|
+
return e.add(i), this.requestFrame(), () => {
|
|
51
|
+
e.delete(i), this.stopIfIdle();
|
|
52
|
+
};
|
|
53
|
+
}
|
|
54
|
+
requestFrame() {
|
|
55
|
+
this.frameRequest !== null || !this.hasCallbacks() || (this.frameRequest = requestAnimationFrame(this.tick));
|
|
56
|
+
}
|
|
57
|
+
runPhase(i, t) {
|
|
58
|
+
for (const e of [...i])
|
|
59
|
+
i.has(e) && e(t);
|
|
60
|
+
}
|
|
61
|
+
hasCallbacks() {
|
|
62
|
+
return this.drivers.size > 0 || this.observers.size > 0;
|
|
63
|
+
}
|
|
64
|
+
stopIfIdle() {
|
|
65
|
+
this.hasCallbacks() || (this.frameRequest !== null && typeof cancelAnimationFrame < "u" && cancelAnimationFrame(this.frameRequest), this.frameRequest = null, this.previousTimestamp = null);
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
const y = new w(), p = 1e3 / 60, C = 2;
|
|
69
|
+
class _ extends f {
|
|
70
|
+
constructor(t) {
|
|
71
|
+
super();
|
|
72
|
+
r(this, "element");
|
|
73
|
+
r(this, "integrator");
|
|
74
|
+
r(this, "styleFn");
|
|
75
|
+
r(this, "lowerBound");
|
|
76
|
+
r(this, "upperBound");
|
|
77
|
+
r(this, "currentValue");
|
|
78
|
+
r(this, "currentVelocity", 0);
|
|
79
|
+
r(this, "frames", []);
|
|
80
|
+
r(this, "waapi", null);
|
|
81
|
+
r(this, "runId", 0);
|
|
82
|
+
r(this, "waitingForStart", !1);
|
|
83
|
+
r(this, "startReady", !1);
|
|
84
|
+
r(this, "pendingFirstFrame");
|
|
85
|
+
r(this, "stopStartupClock", null);
|
|
86
|
+
r(this, "startupStableFrames", 0);
|
|
87
|
+
r(this, "running", !1);
|
|
88
|
+
r(this, "paused", !1);
|
|
89
|
+
r(this, "settled", !1);
|
|
90
|
+
r(this, "reversing", !1);
|
|
91
|
+
this.element = t.element, this.integrator = t.integrator, this.styleFn = t.style, this.lowerBound = t.lowerBound ?? 0, this.upperBound = t.upperBound ?? 1, this.currentValue = this.lowerBound, this.onUpdate = t.onUpdate, this.onComplete = t.onComplete;
|
|
92
|
+
}
|
|
93
|
+
play() {
|
|
94
|
+
if (this.reversing = !1, this.paused && this.waapi) {
|
|
95
|
+
if (this.paused = !1, this.running = !0, this.waitingForStart) {
|
|
96
|
+
this.startReady && this.startFramePacedPlayback(this.waapi);
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
this.waapi.play();
|
|
100
|
+
return;
|
|
101
|
+
}
|
|
102
|
+
this.runToward(this.upperBound);
|
|
103
|
+
}
|
|
104
|
+
reverse() {
|
|
105
|
+
this.reversing = !0, this.runToward(this.lowerBound);
|
|
106
|
+
}
|
|
107
|
+
pause() {
|
|
108
|
+
var t, e;
|
|
109
|
+
this.running && (this.captureLiveState(), (t = this.waapi) == null || t.pause(), (e = this.stopStartupClock) == null || e.call(this), this.stopStartupClock = null, this.running = !1, this.paused = !0);
|
|
110
|
+
}
|
|
111
|
+
complete() {
|
|
112
|
+
var t;
|
|
113
|
+
this.clearWaapi(), this.running = !1, this.paused = !1, this.currentValue = this.upperBound, this.currentVelocity = 0, this.applyStyleAt(this.currentValue), this.settled = !0, (t = this.onComplete) == null || t.call(this);
|
|
114
|
+
}
|
|
115
|
+
/**
|
|
116
|
+
* Drop the WAAPI forwards-fill after the run has settled, letting inline
|
|
117
|
+
* styles govern the resting visual. Call only from `onComplete` (the run is
|
|
118
|
+
* already finished) — otherwise it cancels mid-flight. Unlike `complete()`,
|
|
119
|
+
* it writes no final frame, so a caller can reset the element to its natural
|
|
120
|
+
* state without the lingering fill clobbering it.
|
|
121
|
+
*/
|
|
122
|
+
releaseFill() {
|
|
123
|
+
this.clearWaapi();
|
|
124
|
+
}
|
|
125
|
+
get isAnimating() {
|
|
126
|
+
return this.running;
|
|
127
|
+
}
|
|
128
|
+
get isPaused() {
|
|
129
|
+
return this.paused;
|
|
130
|
+
}
|
|
131
|
+
get isComplete() {
|
|
132
|
+
return this.settled;
|
|
133
|
+
}
|
|
134
|
+
get isReversing() {
|
|
135
|
+
return this.reversing;
|
|
136
|
+
}
|
|
137
|
+
get progress() {
|
|
138
|
+
this.running && this.captureLiveState();
|
|
139
|
+
const t = this.upperBound - this.lowerBound;
|
|
140
|
+
if (t === 0) return 0;
|
|
141
|
+
const e = (this.currentValue - this.lowerBound) / t;
|
|
142
|
+
return e < 0 ? 0 : e > 1 ? 1 : e;
|
|
143
|
+
}
|
|
144
|
+
findTimeForProgress(t) {
|
|
145
|
+
if (this.frames.length < 2) return null;
|
|
146
|
+
const e = this.upperBound - this.lowerBound;
|
|
147
|
+
if (e === 0) return 0;
|
|
148
|
+
for (const s of this.frames)
|
|
149
|
+
if ((s.position - this.lowerBound) / e >= t) return s.time;
|
|
150
|
+
return this.frames[this.frames.length - 1].time;
|
|
151
|
+
}
|
|
152
|
+
get playbackRate() {
|
|
153
|
+
return super.playbackRate;
|
|
154
|
+
}
|
|
155
|
+
set playbackRate(t) {
|
|
156
|
+
super.playbackRate = t, this.waapi && (this.waapi.playbackRate = t);
|
|
157
|
+
}
|
|
158
|
+
getPose() {
|
|
159
|
+
return this.running && this.captureLiveState(), [
|
|
160
|
+
{
|
|
161
|
+
element: this.element,
|
|
162
|
+
value: this.currentValue,
|
|
163
|
+
velocity: this.currentVelocity
|
|
164
|
+
}
|
|
165
|
+
];
|
|
166
|
+
}
|
|
167
|
+
getTimeline() {
|
|
168
|
+
const t = this.frames.map((e) => {
|
|
169
|
+
const s = e.position, n = this.lowerBound + this.upperBound - s;
|
|
170
|
+
return {
|
|
171
|
+
time: e.time,
|
|
172
|
+
value: e.position,
|
|
173
|
+
velocity: e.velocity,
|
|
174
|
+
style: this.styleFn(s, n)
|
|
175
|
+
};
|
|
176
|
+
});
|
|
177
|
+
return [{ element: this.element, frames: t }];
|
|
178
|
+
}
|
|
179
|
+
matchInto(t) {
|
|
180
|
+
const e = t.find((s) => s.element === this.element);
|
|
181
|
+
e && (this.currentValue = e.value, this.currentVelocity = e.velocity);
|
|
182
|
+
}
|
|
183
|
+
/* ───────────────────────────────────────────────────────── private */
|
|
184
|
+
runToward(t) {
|
|
185
|
+
var o;
|
|
186
|
+
if (this.running && this.captureLiveState(), this.clearWaapi(), this.running = !1, this.paused = !1, this.settled = !1, this.frames = A(
|
|
187
|
+
this.integrator,
|
|
188
|
+
this.currentValue,
|
|
189
|
+
t,
|
|
190
|
+
this.currentVelocity
|
|
191
|
+
), this.frames.length === 0) {
|
|
192
|
+
this.currentValue = t, this.currentVelocity = 0, this.applyStyleAt(t), this.settled = !0, (o = this.onComplete) == null || o.call(this);
|
|
193
|
+
return;
|
|
194
|
+
}
|
|
195
|
+
const e = this.frames.map((c) => {
|
|
196
|
+
const d = c.position, v = this.lowerBound + this.upperBound - d;
|
|
197
|
+
return this.styleFn(d, v);
|
|
198
|
+
}), s = e[0], n = this.frames[this.frames.length - 1], h = n.time, u = ++this.runId, l = this.element.animate(e, {
|
|
199
|
+
duration: h,
|
|
200
|
+
fill: "both",
|
|
201
|
+
easing: "linear",
|
|
202
|
+
composite: "replace"
|
|
203
|
+
});
|
|
204
|
+
l.playbackRate = this.playbackRate, l.currentTime = 0, l.pause(), this.waapi = l, this.waitingForStart = !0, this.startReady = !1, this.pendingFirstFrame = s, this.running = !0, l.onfinish = () => {
|
|
205
|
+
var c;
|
|
206
|
+
!this.running || this.waapi !== l || (this.running = !1, this.settled = !0, this.currentValue = n.position, this.currentVelocity = 0, (c = this.onComplete) == null || c.call(this));
|
|
207
|
+
}, this.startWhenReady(l, u);
|
|
208
|
+
}
|
|
209
|
+
clearWaapi() {
|
|
210
|
+
var t, e;
|
|
211
|
+
this.runId++, (t = this.waapi) == null || t.cancel(), this.waapi = null, this.waitingForStart = !1, this.startReady = !1, this.pendingFirstFrame = void 0, (e = this.stopStartupClock) == null || e.call(this), this.stopStartupClock = null, this.startupStableFrames = 0;
|
|
212
|
+
}
|
|
213
|
+
captureLiveState() {
|
|
214
|
+
if (this.frames.length === 0) return;
|
|
215
|
+
const t = m(this.waapi);
|
|
216
|
+
if (t === null) return;
|
|
217
|
+
const { position: e, velocity: s } = P(this.frames, t);
|
|
218
|
+
this.currentValue = e, this.currentVelocity = s;
|
|
219
|
+
}
|
|
220
|
+
async startWhenReady(t, e) {
|
|
221
|
+
try {
|
|
222
|
+
await t.ready, typeof requestAnimationFrame < "u" && await R(this.element);
|
|
223
|
+
} catch {
|
|
224
|
+
return;
|
|
225
|
+
}
|
|
226
|
+
this.runId !== e || this.waapi !== t || (this.startReady = !0, !(!this.running || this.paused) && this.startFramePacedPlayback(t));
|
|
227
|
+
}
|
|
228
|
+
startFramePacedPlayback(t) {
|
|
229
|
+
if (!(this.waapi !== t || !this.waitingForStart || !this.startReady || this.stopStartupClock)) {
|
|
230
|
+
if (this.pendingFirstFrame)
|
|
231
|
+
for (const e of Object.keys(this.pendingFirstFrame))
|
|
232
|
+
this.element.style[e] = "";
|
|
233
|
+
if (this.pendingFirstFrame = void 0, typeof requestAnimationFrame > "u" || this.playbackRate < 0) {
|
|
234
|
+
this.handOffToWaapi(t);
|
|
235
|
+
return;
|
|
236
|
+
}
|
|
237
|
+
this.startupStableFrames = 0, this.stopStartupClock = y.subscribe((e) => {
|
|
238
|
+
this.advanceFramePacedStartup(t, e);
|
|
239
|
+
});
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
advanceFramePacedStartup(t, e) {
|
|
243
|
+
if (this.waapi !== t || !this.running || this.paused || !this.waitingForStart)
|
|
244
|
+
return;
|
|
245
|
+
const s = this.frames[this.frames.length - 1];
|
|
246
|
+
if (!s) return;
|
|
247
|
+
const n = m(t) ?? 0, h = Math.min(
|
|
248
|
+
s.time,
|
|
249
|
+
n + e.delta * Math.max(0, this.playbackRate)
|
|
250
|
+
);
|
|
251
|
+
if (t.currentTime = h, this.captureLiveState(), h >= s.time) {
|
|
252
|
+
this.finishFramePacedRun(t, s);
|
|
253
|
+
return;
|
|
254
|
+
}
|
|
255
|
+
e.rawDelta <= k ? this.startupStableFrames++ : this.startupStableFrames = 0, !(this.startupStableFrames < C) && this.handOffToWaapi(t);
|
|
256
|
+
}
|
|
257
|
+
handOffToWaapi(t) {
|
|
258
|
+
var e;
|
|
259
|
+
this.waapi !== t || !this.running || this.paused || ((e = this.stopStartupClock) == null || e.call(this), this.stopStartupClock = null, this.waitingForStart = !1, this.startReady = !1, this.startupStableFrames = 0, t.play());
|
|
260
|
+
}
|
|
261
|
+
finishFramePacedRun(t, e) {
|
|
262
|
+
var s, n;
|
|
263
|
+
this.waapi !== t || !this.running || ((s = this.stopStartupClock) == null || s.call(this), this.stopStartupClock = null, this.waitingForStart = !1, this.startReady = !1, this.startupStableFrames = 0, this.running = !1, this.settled = !0, this.currentValue = e.position, this.currentVelocity = 0, (n = this.onComplete) == null || n.call(this));
|
|
264
|
+
}
|
|
265
|
+
applyStyleAt(t) {
|
|
266
|
+
const e = this.lowerBound + this.upperBound - t, s = this.styleFn(t, e);
|
|
267
|
+
for (const [n, h] of Object.entries(s))
|
|
268
|
+
this.element.style[n] = typeof h == "number" ? String(h) : h;
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
function A(a, i, t, e) {
|
|
272
|
+
if (i === t && e === 0) return [];
|
|
273
|
+
const s = 600;
|
|
274
|
+
let n = { position: i, velocity: e }, h = 0;
|
|
275
|
+
const u = [];
|
|
276
|
+
for (let l = 0; l < s; l++) {
|
|
277
|
+
const o = l * p;
|
|
278
|
+
if (u.push({ time: o, position: n.position, velocity: n.velocity }), n = a.step(n, t, p / 1e3), a.isSettled(n, t)) {
|
|
279
|
+
if (h += p / 1e3, h >= b) {
|
|
280
|
+
u.push({
|
|
281
|
+
time: (l + 1) * p,
|
|
282
|
+
position: t,
|
|
283
|
+
velocity: 0
|
|
284
|
+
});
|
|
285
|
+
break;
|
|
286
|
+
}
|
|
287
|
+
} else
|
|
288
|
+
h = 0;
|
|
289
|
+
}
|
|
290
|
+
return u;
|
|
291
|
+
}
|
|
292
|
+
function P(a, i) {
|
|
293
|
+
if (a.length === 0) return { position: 0, velocity: 0 };
|
|
294
|
+
const t = a[0], e = a[a.length - 1];
|
|
295
|
+
if (i <= 0)
|
|
296
|
+
return { position: t.position, velocity: t.velocity };
|
|
297
|
+
if (i >= e.time)
|
|
298
|
+
return { position: e.position, velocity: e.velocity };
|
|
299
|
+
let s = 0, n = a.length - 1;
|
|
300
|
+
for (; s < n - 1; ) {
|
|
301
|
+
const o = s + n >> 1;
|
|
302
|
+
a[o].time <= i ? s = o : n = o;
|
|
303
|
+
}
|
|
304
|
+
const h = a[s], u = a[n], l = (i - h.time) / (u.time - h.time);
|
|
305
|
+
return {
|
|
306
|
+
position: h.position + (u.position - h.position) * l,
|
|
307
|
+
velocity: h.velocity + (u.velocity - h.velocity) * l
|
|
308
|
+
};
|
|
309
|
+
}
|
|
310
|
+
function m(a) {
|
|
311
|
+
const i = a == null ? void 0 : a.currentTime;
|
|
312
|
+
return typeof i == "number" ? i : null;
|
|
313
|
+
}
|
|
314
|
+
class M extends f {
|
|
315
|
+
constructor(t, e = {}) {
|
|
316
|
+
super();
|
|
317
|
+
r(this, "children");
|
|
318
|
+
r(this, "startAt");
|
|
319
|
+
r(this, "pendingComplete", 0);
|
|
320
|
+
r(this, "running", !1);
|
|
321
|
+
r(this, "pendingStartObservers", []);
|
|
322
|
+
this.children = t, (e.mode ?? "parallel") === "sequence" ? this.startAt = t.map((s, n) => n === 0 ? 0 : 1) : this.startAt = e.startAt ?? [];
|
|
323
|
+
}
|
|
324
|
+
play() {
|
|
325
|
+
this.startRun("play");
|
|
326
|
+
}
|
|
327
|
+
reverse() {
|
|
328
|
+
this.startRun("reverse");
|
|
329
|
+
}
|
|
330
|
+
pause() {
|
|
331
|
+
this.running = !1, this.clearPendingStartObservers();
|
|
332
|
+
for (const t of this.children) t.pause();
|
|
333
|
+
}
|
|
334
|
+
complete() {
|
|
335
|
+
var t;
|
|
336
|
+
this.running = !1, this.clearPendingStartObservers();
|
|
337
|
+
for (const e of this.children) e.complete();
|
|
338
|
+
(t = this.onComplete) == null || t.call(this);
|
|
339
|
+
}
|
|
340
|
+
get progress() {
|
|
341
|
+
if (this.children.length === 0) return 0;
|
|
342
|
+
let t = 0;
|
|
343
|
+
for (const e of this.children) t += e.progress;
|
|
344
|
+
return t / this.children.length;
|
|
345
|
+
}
|
|
346
|
+
getPose() {
|
|
347
|
+
return this.children.flatMap((t) => t.getPose());
|
|
348
|
+
}
|
|
349
|
+
getTimeline() {
|
|
350
|
+
return this.children.flatMap((t) => t.getTimeline());
|
|
351
|
+
}
|
|
352
|
+
matchInto(t) {
|
|
353
|
+
}
|
|
354
|
+
get isAnimating() {
|
|
355
|
+
return this.children.some((t) => t.isAnimating);
|
|
356
|
+
}
|
|
357
|
+
get isPaused() {
|
|
358
|
+
return this.children.some((t) => t.isPaused) && this.children.every((t) => t.isPaused || t.isComplete);
|
|
359
|
+
}
|
|
360
|
+
get isComplete() {
|
|
361
|
+
return this.children.every((t) => t.isComplete);
|
|
362
|
+
}
|
|
363
|
+
get isReversing() {
|
|
364
|
+
return this.children.some((t) => t.isReversing);
|
|
365
|
+
}
|
|
366
|
+
get playbackRate() {
|
|
367
|
+
return super.playbackRate;
|
|
368
|
+
}
|
|
369
|
+
set playbackRate(t) {
|
|
370
|
+
super.playbackRate = t;
|
|
371
|
+
for (const e of this.children) e.playbackRate = t;
|
|
372
|
+
}
|
|
373
|
+
/* ───────────────────────────────────────────────────────── private */
|
|
374
|
+
startRun(t) {
|
|
375
|
+
if (this.running && this.pause(), this.running = !0, this.pendingComplete = this.children.length, this.pendingComplete === 0) {
|
|
376
|
+
this.handleFinished();
|
|
377
|
+
return;
|
|
378
|
+
}
|
|
379
|
+
for (const e of this.children) {
|
|
380
|
+
const s = e.onComplete;
|
|
381
|
+
e.onComplete = () => {
|
|
382
|
+
s == null || s(), this.handleChildComplete();
|
|
383
|
+
};
|
|
384
|
+
}
|
|
385
|
+
this.scheduleStart(0, t);
|
|
386
|
+
}
|
|
387
|
+
// Chained start: play child `index`, then observe its actual progress before
|
|
388
|
+
// starting the next one. A wall-clock timeout starts counting before WAAPI's
|
|
389
|
+
// asynchronous startup has completed, so mount/layout delays can otherwise
|
|
390
|
+
// make a sequence or stagger run early. The shared frame scheduler evaluates
|
|
391
|
+
// observers after frame-paced drivers, matching the pose painted this frame.
|
|
392
|
+
scheduleStart(t, e) {
|
|
393
|
+
if (!this.running || t >= this.children.length) return;
|
|
394
|
+
this.children[t][e]();
|
|
395
|
+
const s = t + 1;
|
|
396
|
+
if (s >= this.children.length) return;
|
|
397
|
+
const n = this.startAt[s];
|
|
398
|
+
if (n === void 0 || n <= 0) {
|
|
399
|
+
this.scheduleStart(s, e);
|
|
400
|
+
return;
|
|
401
|
+
}
|
|
402
|
+
const h = this.children[t];
|
|
403
|
+
if (this.hasReachedThreshold(h, n, e)) {
|
|
404
|
+
this.scheduleStart(s, e);
|
|
405
|
+
return;
|
|
406
|
+
}
|
|
407
|
+
const u = y.subscribe(() => {
|
|
408
|
+
this.running && this.hasReachedThreshold(h, n, e) && (u(), this.pendingStartObservers = this.pendingStartObservers.filter(
|
|
409
|
+
(l) => l !== u
|
|
410
|
+
), this.scheduleStart(s, e));
|
|
411
|
+
}, "observe");
|
|
412
|
+
this.pendingStartObservers.push(u);
|
|
413
|
+
}
|
|
414
|
+
hasReachedThreshold(t, e, s) {
|
|
415
|
+
return t.isComplete ? !0 : (s === "play" ? t.progress : 1 - t.progress) >= e;
|
|
416
|
+
}
|
|
417
|
+
clearPendingStartObservers() {
|
|
418
|
+
for (const t of this.pendingStartObservers) t();
|
|
419
|
+
this.pendingStartObservers = [];
|
|
420
|
+
}
|
|
421
|
+
handleChildComplete() {
|
|
422
|
+
this.pendingComplete--, this.pendingComplete <= 0 && this.handleFinished();
|
|
423
|
+
}
|
|
424
|
+
handleFinished() {
|
|
425
|
+
var t;
|
|
426
|
+
this.running = !1, this.clearPendingStartObservers(), (t = this.onComplete) == null || t.call(this);
|
|
427
|
+
}
|
|
428
|
+
findTimeForProgress(t) {
|
|
429
|
+
return null;
|
|
430
|
+
}
|
|
431
|
+
}
|
|
432
|
+
export {
|
|
433
|
+
f as A,
|
|
434
|
+
M,
|
|
435
|
+
O as P,
|
|
436
|
+
b as S,
|
|
437
|
+
V,
|
|
438
|
+
_ as W
|
|
439
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { MediaFit } from '../media-geometry';
|
|
2
|
+
export type HeroEndpoint = "enter" | "exit" | "legacy";
|
|
3
|
+
/** Compatibility fallback used only with deprecated aspect-ratio markup. */
|
|
4
|
+
export declare function fallbackHeroFit(endpoint: HeroEndpoint): MediaFit;
|
|
5
|
+
//# sourceMappingURL=fit.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fit.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/hero/fit.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;AAQvD,4EAA4E;AAC5E,wBAAgB,eAAe,CAAC,QAAQ,EAAE,YAAY,GAAG,QAAQ,CAEhE"}
|
|
@@ -1,6 +1,17 @@
|
|
|
1
1
|
import { TransitionConfig } from '../../types/index.ts';
|
|
2
|
-
import {
|
|
2
|
+
import { MediaGeometry } from '../media-geometry';
|
|
3
|
+
import { HeroPair, HeroResolved, NormalizedHeroOptions } from './types';
|
|
3
4
|
export type { HeroType, HeroVariant, NormalizedHeroOptions } from './types';
|
|
5
|
+
/**
|
|
6
|
+
* Resolve new-style hero pairs from `data-hero-enter-key` (detail side) and
|
|
7
|
+
* `data-hero-exit-key` (list side). Direction-agnostic: enter elements on
|
|
8
|
+
* `to` pair with exit elements on `from` (forward navigation), and enter
|
|
9
|
+
* elements on `from` pair with exit elements on `to` (reverse). In both
|
|
10
|
+
* cases the animated element is the one living on `to`.
|
|
11
|
+
*/
|
|
12
|
+
export declare function resolveNewStylePairs(fromNode: HTMLElement, toNode: HTMLElement): HeroPair[];
|
|
13
|
+
export declare function normalizeHeroGeometryPair(from: MediaGeometry, to: MediaGeometry): [MediaGeometry, MediaGeometry];
|
|
14
|
+
export declare function shouldResetHeroCloneRadius(from: MediaGeometry, to: MediaGeometry): boolean;
|
|
4
15
|
type HeroExtras = {
|
|
5
16
|
resolved: HeroResolved;
|
|
6
17
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/hero/transition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/hero/transition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAQ/C,OAAO,EAOL,KAAK,aAAa,EAEnB,MAAM,mBAAmB,CAAC;AAI3B,OAAO,KAAK,EAEV,QAAQ,EAER,YAAY,EAEZ,qBAAqB,EACtB,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,QAAQ,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAuD5E;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,WAAW,EACrB,MAAM,EAAE,WAAW,GAClB,QAAQ,EAAE,CAgCZ;AAuDD,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,aAAa,EACnB,EAAE,EAAE,aAAa,GAChB,CAAC,aAAa,EAAE,aAAa,CAAC,CAEhC;AAED,wBAAgB,0BAA0B,CACxC,IAAI,EAAE,aAAa,EACnB,EAAE,EAAE,aAAa,GAChB,OAAO,CAeT;AAuKD,KAAK,UAAU,GAAG;IAAE,QAAQ,EAAE,YAAY,CAAA;CAAE,CAAC;AAE7C,eAAO,MAAM,IAAI,GACf,SAAS,qBAAqB,KAC7B,gBAAgB,CAAC,UAAU,CA0E7B,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { PhysicsOptions } from '../../types/index.ts';
|
|
2
2
|
import { Animation } from '../../animation';
|
|
3
|
+
import { MediaFit } from '../media-geometry';
|
|
3
4
|
/**
|
|
4
5
|
* - `static` — a temporary shared-element clone morphs above the incoming
|
|
5
6
|
* page while page chrome snaps to its final state. Default.
|
|
@@ -18,7 +19,7 @@ export type HeroType = "static" | "fade";
|
|
|
18
19
|
*/
|
|
19
20
|
export type HeroVariant = "default" | "smooth";
|
|
20
21
|
export type HeroOptions = Record<string, never>;
|
|
21
|
-
export type HeroFit =
|
|
22
|
+
export type HeroFit = MediaFit;
|
|
22
23
|
export interface NormalizedHeroOptions {
|
|
23
24
|
type: HeroType;
|
|
24
25
|
variant: HeroVariant;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/hero/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAC7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/hero/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAC7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAMlD;;;;;GAKG;AACH,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC;AACzC;;;;;;;;GAQG;AACH,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAC;AAC/C,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AAEhD,MAAM,MAAM,OAAO,GAAG,QAAQ,CAAC;AAO/B,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,QAAQ,CAAC;IACf,OAAO,EAAE,WAAW,CAAC;CACtB;AAMD,MAAM,WAAW,QAAQ;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,WAAW,CAAC;IACpB,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,QAAQ,EAAE,CAAC;CACnB;AAUD,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAC3B,EAAE,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IACzB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;CACjC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,WAAW,CAAC;IAClB,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,cAAc,CAAC;IACxB,gBAAgB,EAAE,WAAW,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CACtC;AAED;;;GAGG;AACH,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,IAAI,CAAC;IACxC,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,iBAAiB,KAAK,SAAS,EAAE,CAAC;CACtD"}
|