@ssgoi/core 6.5.0-beta.1 → 6.5.0-beta.2

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/internal.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";var Mt=Object.defineProperty;var xt=(t,s,e)=>s in t?Mt(t,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[s]=e;var B=(t,s,e)=>xt(t,typeof s!="symbol"?s+"":s,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Z=require("./multi-animation-Dw2JTJI2.cjs");class Et extends Z.Animation{constructor(){super(...arguments);B(this,"child",null);B(this,"_state","idle");B(this,"_settled",!1);B(this,"listeners",new Set)}attach(e){const n=this.child;if(this.child=e,this._settled=!1,n){const c=n.getPose();n.complete(),e.matchInto(c)}e.playbackRate=this.playbackRate;const l=e.onComplete;e.onComplete=()=>{l==null||l(),this.child===e&&(this.child=null,this._state="idle",this._settled=!0),this.notify()};const f=e.onUpdate;e.onUpdate=c=>{var y;f==null||f(c),(y=this.onUpdate)==null||y.call(this,c),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 n;return((n=this.child)==null?void 0:n.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 n;(n=this.child)==null||n.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 Lt=(t,s)=>{var e;t.style.position="absolute",t.style.width="100%",t.style.top=`${-1*(((e=s==null?void 0:s.scrollOffset)==null?void 0:e.y)??0)}px`,t.style.left="0"},ht=new Set(["auto","scroll","overlay"]),Ot=t=>{let s=t.parentElement;for(;s&&s!==document.body;){const e=window.getComputedStyle(s);if(ht.has(e.overflowY)||ht.has(e.overflowX))return s;s=s.parentElement}return document.documentElement},_t=t=>{let s=t.parentElement;for(;s&&s!==document.body;){const e=window.getComputedStyle(s).position;if(e==="relative"||e==="absolute"||e==="fixed"||e==="sticky")return s;s=s.parentElement}return document.body};function kt(t){const s=Object.keys(t);return Promise.all(s.map(e=>t[e])).then(e=>{const n={};return s.forEach((l,f)=>{n[l]=e[f]}),n})}function Dt(t){const s=t.filter(e=>e.symmetric).map(e=>({from:e.to,to:e.from,transition:e.transition}));return[...t,...s]}function X(t,s){if(s==="*")return!0;if(s.endsWith("/*")){const e=s.slice(0,-1);return t.startsWith(e)&&t.length>e.length}return t===s}function Ht(t,s,e){for(const n of e)if(X(t,n.from)&&X(s,n.to))return n.transition;for(const n of e)if((n.from==="*"||X(t,n.from))&&(n.to==="*"||X(s,n.to)))return n.transition;return null}const Nt=768,It=10,Wt=10;function Ft(t={}){const{preserveScroll:s=a=>a}=t,e=typeof s=="function"?s:()=>s;let n=null,l=!1,f=!1;const c=()=>{const a=(n==null?void 0:n.clientWidth)??0,u=a>0?a:typeof window<"u"?window.innerWidth:0;return u>0&&u<Nt},y=()=>(f||(l=c(),f=!0),l),b=a=>{var S;const u=e(y());if(u===!1)return{preserves:!1,shared:!1,storageKey:`path:${a}`};if(u===!0)return{preserves:!0,shared:!1,storageKey:`path:${a}`};const v=((S=u.exclude)==null?void 0:S.some(A=>X(a,A)))??!1,w=!v&&!!u.key;return{preserves:!v,shared:w,storageKey:w?`shared:${u.key}`:`path:${a}`}},O=a=>b(a).preserves;let _=null;const E=new Map;let x=null,k=!1,I=0;const W=()=>{n&&x&&!k&&E.set(b(x).storageKey,{x:n.scrollLeft,y:n.scrollTop})},T=a=>{if(!n)return;const u=b(a);if(u.preserves&&u.shared&&!E.has(u.storageKey))return;const v=u.preserves&&E.has(u.storageKey)?E.get(u.storageKey):{x:0,y:0};let w=0;const S=()=>{if(!n)return;n.scrollTo({top:v.y,left:v.x}),!(Math.abs(n.scrollTop-v.y)<1&&Math.abs(n.scrollLeft-v.x)<1)&&w<It&&(w++,requestAnimationFrame(S))};requestAnimationFrame(S)};return{initializeContext:(a,u)=>{k=!0;const v=++I;_=a,n||(n=Ot(a),l=c(),f=!0,typeof ResizeObserver<"u"&&new ResizeObserver(()=>{l=c()}).observe(n),(n===document.documentElement?window:n).addEventListener("scroll",W,{passive:!0})),x=u,T(u);let w=0;const S=()=>{v===I&&(w++,w>=Wt?k=!1:requestAnimationFrame(S))};requestAnimationFrame(S)},calculateScrollOffset:(a,u)=>{const v=a?b(a).storageKey:null,w=v&&E.has(v)?E.get(v):{x:0,y:0},S=u?b(u):null,A=S!=null&&S.preserves?S.storageKey:null,F=A&&E.has(A)?E.get(A):{x:0,y:0};return{x:-F.x+w.x,y:-F.y+w.y}},evictScrollPosition:a=>{E.delete(b(a).storageKey)},shouldPreserve:O,getScrollContainer:()=>n,getPositionedParentElement:()=>_?_t(_):document.body,getScrollPosition:a=>{const u=a?b(a).storageKey:null;return u&&E.has(u)?E.get(u):{x:0,y:0}}}}const yt=30,mt=8,pt=1.2,gt=30,Kt=600;function Bt(){let t=null,s=!1,e=!1,n=null,l=null,f=!1;const c=(d,g)=>{for(let m=0;m<d.length;m++){const p=d.item(m);if(p&&p.identifier===g)return p}return null},y=()=>{n!==null&&(clearTimeout(n),n=null)},b=()=>{l!==null&&(clearTimeout(l),l=null)},O=()=>{s=!0,e=!0,y(),b(),n=setTimeout(()=>{s=!1,e=!1,n=null},Kt)},_=d=>{if(d.touches.length!==1){t=null;return}const g=d.touches.item(0);if(!g){t=null;return}const m=window.innerWidth,p=g.clientX<=yt,R=g.clientX>=m-yt;if(!p&&!R){t=null;return}t={identifier:g.identifier,startX:g.clientX,startY:g.clientY,fromLeftEdge:p,moved:!1}},E=d=>{if(!t)return;if(d.touches.length!==1){t=null;return}const g=c(d.touches,t.identifier);if(!g){t=null;return}const m=g.clientX-t.startX,p=g.clientY-t.startY,R=Math.abs(m),a=Math.abs(p);if(a>mt&&a>R*pt){t=null;return}const u=t.fromLeftEdge?m>0:m<0;R>mt&&R>a*pt&&u&&(t.moved=!0)},x=d=>{if(!t)return;const g=c(d.changedTouches,t.identifier);if(!g){t=null;return}const m=g.clientX-t.startX,p=t.fromLeftEdge?m>0:m<0;if(t.moved&&p&&Math.abs(m)>=gt){O(),t=null;return}t.moved&&Math.abs(m)>=gt&&O(),t=null},k=()=>{t&&(t.moved&&O(),t=null)};return{initialize:()=>{if(typeof window>"u"||f)return;f=!0;const d={passive:!0,capture:!0};window.addEventListener("touchstart",_,d),window.addEventListener("touchmove",E,d),window.addEventListener("touchend",x,d),window.addEventListener("touchcancel",k,d)},destroy:()=>{if(typeof window>"u"||!f)return;f=!1;const d={capture:!0};window.removeEventListener("touchstart",_,d),window.removeEventListener("touchmove",E,d),window.removeEventListener("touchend",x,d),window.removeEventListener("touchcancel",k,d),y(),b(),t=null,s=!1,e=!1},isSwipeBack:()=>{const d=s||e;return d&&y(),d},onPageEnter:()=>{s=!1,y(),b(),l=setTimeout(()=>{e=!1,l=null},0)}}}function Xt(){let t=null;function s(){var n,l;t&&((n=t.outResolve)==null||n.call(t,null),(l=t.inResolve)==null||l.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){s();return}const n={from:t.from,to:t.to};t.outResolve(n),t.inResolve(n),t=null}}return{trigger(n,l){var c;l==="out"&&(t==null?void 0:t.to)===n&&!t.from&&((c=t.inResolve)==null||c.call(t,null),t={}),t&&(l==="out"&&t.from&&t.from!==n||l==="in"&&t.to&&t.to!==n)&&s(),t||(t={}),l==="out"?t.from=n:t.to=n},get(n){return new Promise(l=>{t||(t={}),n==="out"?t.outResolve=l:t.inResolve=l,e()})}}}const $=new Map;let Y=null,vt=!1;function St(t){if(t instanceof HTMLElement&&$.has(t)&&!t.isConnected){const s=$.get(t);$.delete(t),queueMicrotask(s)}for(const s of Array.from(t.childNodes))St(s)}function zt(){if(vt||typeof document>"u")return;vt=!0,Y=new MutationObserver(s=>{for(const e of s)for(const n of Array.from(e.removedNodes))St(n)});const t=()=>{Y==null||Y.observe(document.body,{childList:!0,subtree:!0})};document.body?t():document.addEventListener("DOMContentLoaded",t,{once:!0})}function $t(t,s){return zt(),$.set(t,s),()=>{$.delete(t)}}const it=new WeakMap;let G=null;const j="none !important";function z(t){const s=t.style.getPropertyValue("display");return t.style.getPropertyPriority("display")?`${s} !important`:s}function qt(){return G||(G=new MutationObserver(t=>{for(const s of t){const e=s.target,n=it.get(e);if(!n)continue;const l=z(e);l!==n.accounted&&(n.accounted=l,l===j?(n.reactHidden=!0,n.onHide()):l!=="none"&&n.reactHidden&&(n.reactHidden=!1,n.onShow()))}}),G)}function Vt(t,s){const e=z(t),n={accounted:e,reactHidden:e===j,onHide:s.onHide,onShow:s.onShow};return it.set(t,n),qt().observe(t,{attributes:!0,attributeFilter:["style"]}),{get isHidden(){return z(t)===j},setDisplay(l,f=!1){l===null?t.style.removeProperty("display"):t.style.setProperty("display",l,f?"important":""),n.accounted=z(t)},sync(){n.accounted=z(t),n.reactHidden=n.accounted===j},stop(){it.delete(t)}}}function Ut(t){return Array.isArray(t)}function wt(t){const s=[];for(const e of t)Ut(e)?s.push(...wt(e)):s.push(e);return s}function Yt(t,s={}){const{transitions:e=[],middleware:n=(o,i)=>({from:o,to:i}),preserveScroll:l=o=>o}=t,f=s.host??new Et,c=Xt(),y=Dt(wt(e)),b=Bt();b.initialize();const{initializeContext:O,calculateScrollOffset:_,evictScrollPosition:E,shouldPreserve:x,getScrollContainer:k,getPositionedParentElement:I,getScrollPosition:W}=Ft({preserveScroll:l});let T=null,P=null;const d=new WeakMap,g=o=>{d.set(o,{parent:o.parentElement,nextSibling:o.nextElementSibling})},m=o=>{const i=d.get(o);return i||{parent:o.parentElement,nextSibling:o.nextElementSibling}},p=new WeakMap,R=new WeakMap;let a=0;const u=o=>{const i=typeof getComputedStyle<"u"?getComputedStyle(o).display:"";return i&&i!=="none"?i:"block"},v=(o,i)=>{i.visibleDisplay=o.style.getPropertyValue("display"),i.computedDisplay=u(o)},w=(o,i)=>{if(R.get(o)!==i)return;R.delete(o);const r=p.get(o);r&&(r.savedCss!==null&&(o.style.cssText=r.savedCss,r.savedCss=null),r.intent==="hidden"?r.vis.setDisplay("none",!0):r.visibleDisplay?(r.vis.setDisplay(r.visibleDisplay,!1),v(o,r)):(r.vis.setDisplay(null),v(o,r)))},S=(o,i,r,h,L)=>{const M=h.element,D=L.element,H=(h.mode??"unmount")==="hidden",{parent:q,nextSibling:Q}=h.parent?{parent:h.parent,nextSibling:h.nextSibling}:m(M),V=_(i,r),tt={scrollOffset:V,from:{scroll:W(i)},to:{scroll:W(r)},get scrollingElement(){return k()||document.documentElement},get positionedParent(){return I()}};let C;if(H){C=M,C.style.top=`${-1*((V==null?void 0:V.y)??0)}px`;const N=p.get(D);N&&N.savedCss===null&&(N.savedCss=D.style.cssText)}else C=M.cloneNode(!0),C.setAttribute("data-ssgoi-clone",""),Lt(C,tt);x(i)||E(i);const U=H?++a:0;H&&(R.set(D,U),R.set(M,U));const ut=Promise.resolve(C),dt=Promise.resolve(D),ft=[],Pt={from:ut,to:dt,context:tt,createElement:((N,et="div")=>{const K=document.createElement(et);return K.setAttribute("data-ssgoi-id",N),ft.push(K),K})},Ct=Promise.resolve(o.prepare?o.prepare(Pt):{});kt({from:ut,to:dt,extras:Ct}).then(({from:N,to:et,extras:K})=>{!H&&q&&(Q&&q.contains(Q)?q.insertBefore(C,Q):q.appendChild(C));const nt=o.animation({from:N,to:et,context:tt,...K}),st=nt.onComplete;nt.onComplete=()=>{st==null||st(),H?(w(M,U),w(D,U)):C.parentElement&&C.parentElement.removeChild(C);for(const ot of ft)ot.parentElement&&ot.parentElement.removeChild(ot)},f.attach(nt)})},A=(o,i)=>{const r=b.isSwipeBack();c.trigger(o,i),c.get(i).then(h=>{if(i==="in"&&b.onPageEnter(),!h)return;if(r){i==="out"&&h.from&&!x(h.from)&&E(h.from),T=null,P=null;return}if(i!=="in")return;const{from:L,to:M}=n(h.from,h.to),D=Ht(L,M,y),J=T,H=P;T=null,P=null,!(!D||!J||!H)&&S(D,L,M,J,H)})},F=(o,i)=>{const r=p.get(o);if(!r)return;const h=r.intent==="hidden";if(r.intent="hidden",r.savedCss===null&&(r.savedCss=o.style.cssText),r.vis.setDisplay(r.computedDisplay||"block",!0),o.style.position="absolute",o.style.width="100%",o.style.left="0",h)return;const L=m(o);T={element:o,parent:L.parent,nextSibling:L.nextSibling,mode:"hidden"};const M=o.getAttribute("data-ssgoi-transition")??i;A(M,"out")},Rt=(o,i)=>{const r=p.get(o);if(!r||r.intent==="visible")return;r.intent="visible",v(o,r),r.savedCss!==null&&(o.style.cssText=r.savedCss,r.visibleDisplay?r.vis.setDisplay(r.visibleDisplay,!1):r.vis.setDisplay(null)),O(o,i),P={element:o,parent:o.parentElement,nextSibling:o.nextElementSibling};const h=o.getAttribute("data-ssgoi-transition")??i;A(h,"in")},At=(o,i)=>{const r=p.get(o);if(r&&(r.vis.stop(),p.delete(o),R.delete(o),r.intent==="hidden")){(T==null?void 0:T.element)===o&&(T=null),(P==null?void 0:P.element)===o&&(P=null);return}const h=m(o);T={element:o,parent:h.parent,nextSibling:h.nextSibling,mode:"unmount"};const L=o.getAttribute("data-ssgoi-transition")??i;A(L,"out")},lt=new WeakSet,ct=(o,i)=>{if(lt.has(i))return;lt.add(i),g(i);const r=Vt(i,{onHide:()=>F(i,o),onShow:()=>Rt(i,o)}),h={vis:r,savedCss:null,intent:r.isHidden?"hidden":"visible",visibleDisplay:"",computedDisplay:"block"};p.set(i,h),r.isHidden||(v(i,h),O(i,o),P={element:i,parent:i.parentElement,nextSibling:i.nextElementSibling},A(o,"in")),$t(i,()=>At(i,o))},at=new Map;return{register:ct,refFor:o=>{let i=at.get(o);return i||(i=r=>{r&&ct(o,r)},at.set(o,i)),i}}}const Tt="data-ssgoi-root",Gt=`[${Tt}]`,rt="data-ssgoi-transition",bt=`[${rt}]`,jt="[data-ssgoi-clone]";function Zt(){return typeof MutationObserver<"u"&&typeof HTMLElement<"u"&&typeof Node<"u"}function Jt(t){return t.nodeType===Node.ELEMENT_NODE}function Qt(t){return t instanceof HTMLElement}function te(t,s){if(!Zt())return()=>{};t.setAttribute(Tt,"");const e=c=>c.closest(Gt)===t,n=c=>{if(!Qt(c)||!e(c)||c.closest(jt))return;const y=c.getAttribute(rt);y!==null&&s.register(y,c)},l=c=>{if(Jt(c)){c.matches(bt)&&n(c);for(const y of c.querySelectorAll(bt))n(y)}},f=new MutationObserver(c=>{for(const y of c){if(y.type==="attributes"){n(y.target);continue}for(const b of y.addedNodes)l(b)}});return f.observe(t,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[rt]}),l(t),()=>f.disconnect()}exports.Animation=Z.Animation;exports.MultiAnimation=Z.MultiAnimation;exports.WebAnimation=Z.WebAnimation;exports.HostAnimation=Et;exports.createSggoiTransitionContext=Yt;exports.observeSsgoiTransitions=te;
1
+ "use strict";var Mt=Object.defineProperty;var xt=(t,s,e)=>s in t?Mt(t,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[s]=e;var B=(t,s,e)=>xt(t,typeof s!="symbol"?s+"":s,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Z=require("./multi-animation-uzEnQnrG.cjs");class Et extends Z.Animation{constructor(){super(...arguments);B(this,"child",null);B(this,"_state","idle");B(this,"_settled",!1);B(this,"listeners",new Set)}attach(e){const n=this.child;if(this.child=e,this._settled=!1,n){const c=n.getPose();n.complete(),e.matchInto(c)}e.playbackRate=this.playbackRate;const l=e.onComplete;e.onComplete=()=>{l==null||l(),this.child===e&&(this.child=null,this._state="idle",this._settled=!0),this.notify()};const f=e.onUpdate;e.onUpdate=c=>{var y;f==null||f(c),(y=this.onUpdate)==null||y.call(this,c),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 n;return((n=this.child)==null?void 0:n.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 n;(n=this.child)==null||n.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 Lt=(t,s)=>{var e;t.style.position="absolute",t.style.width="100%",t.style.top=`${-1*(((e=s==null?void 0:s.scrollOffset)==null?void 0:e.y)??0)}px`,t.style.left="0"},ht=new Set(["auto","scroll","overlay"]),Ot=t=>{let s=t.parentElement;for(;s&&s!==document.body;){const e=window.getComputedStyle(s);if(ht.has(e.overflowY)||ht.has(e.overflowX))return s;s=s.parentElement}return document.documentElement},_t=t=>{let s=t.parentElement;for(;s&&s!==document.body;){const e=window.getComputedStyle(s).position;if(e==="relative"||e==="absolute"||e==="fixed"||e==="sticky")return s;s=s.parentElement}return document.body};function kt(t){const s=Object.keys(t);return Promise.all(s.map(e=>t[e])).then(e=>{const n={};return s.forEach((l,f)=>{n[l]=e[f]}),n})}function Dt(t){const s=t.filter(e=>e.symmetric).map(e=>({from:e.to,to:e.from,transition:e.transition}));return[...t,...s]}function X(t,s){if(s==="*")return!0;if(s.endsWith("/*")){const e=s.slice(0,-1);return t.startsWith(e)&&t.length>e.length}return t===s}function Ht(t,s,e){for(const n of e)if(X(t,n.from)&&X(s,n.to))return n.transition;for(const n of e)if((n.from==="*"||X(t,n.from))&&(n.to==="*"||X(s,n.to)))return n.transition;return null}const Nt=768,It=10,Wt=10;function Ft(t={}){const{preserveScroll:s=a=>a}=t,e=typeof s=="function"?s:()=>s;let n=null,l=!1,f=!1;const c=()=>{const a=(n==null?void 0:n.clientWidth)??0,u=a>0?a:typeof window<"u"?window.innerWidth:0;return u>0&&u<Nt},y=()=>(f||(l=c(),f=!0),l),b=a=>{var S;const u=e(y());if(u===!1)return{preserves:!1,shared:!1,storageKey:`path:${a}`};if(u===!0)return{preserves:!0,shared:!1,storageKey:`path:${a}`};const v=((S=u.exclude)==null?void 0:S.some(A=>X(a,A)))??!1,w=!v&&!!u.key;return{preserves:!v,shared:w,storageKey:w?`shared:${u.key}`:`path:${a}`}},O=a=>b(a).preserves;let _=null;const E=new Map;let x=null,k=!1,I=0;const W=()=>{n&&x&&!k&&E.set(b(x).storageKey,{x:n.scrollLeft,y:n.scrollTop})},T=a=>{if(!n)return;const u=b(a);if(u.preserves&&u.shared&&!E.has(u.storageKey))return;const v=u.preserves&&E.has(u.storageKey)?E.get(u.storageKey):{x:0,y:0};let w=0;const S=()=>{if(!n)return;n.scrollTo({top:v.y,left:v.x}),!(Math.abs(n.scrollTop-v.y)<1&&Math.abs(n.scrollLeft-v.x)<1)&&w<It&&(w++,requestAnimationFrame(S))};requestAnimationFrame(S)};return{initializeContext:(a,u)=>{k=!0;const v=++I;_=a,n||(n=Ot(a),l=c(),f=!0,typeof ResizeObserver<"u"&&new ResizeObserver(()=>{l=c()}).observe(n),(n===document.documentElement?window:n).addEventListener("scroll",W,{passive:!0})),x=u,T(u);let w=0;const S=()=>{v===I&&(w++,w>=Wt?k=!1:requestAnimationFrame(S))};requestAnimationFrame(S)},calculateScrollOffset:(a,u)=>{const v=a?b(a).storageKey:null,w=v&&E.has(v)?E.get(v):{x:0,y:0},S=u?b(u):null,A=S!=null&&S.preserves?S.storageKey:null,F=A&&E.has(A)?E.get(A):{x:0,y:0};return{x:-F.x+w.x,y:-F.y+w.y}},evictScrollPosition:a=>{E.delete(b(a).storageKey)},shouldPreserve:O,getScrollContainer:()=>n,getPositionedParentElement:()=>_?_t(_):document.body,getScrollPosition:a=>{const u=a?b(a).storageKey:null;return u&&E.has(u)?E.get(u):{x:0,y:0}}}}const yt=30,mt=8,pt=1.2,gt=30,Kt=600;function Bt(){let t=null,s=!1,e=!1,n=null,l=null,f=!1;const c=(d,g)=>{for(let m=0;m<d.length;m++){const p=d.item(m);if(p&&p.identifier===g)return p}return null},y=()=>{n!==null&&(clearTimeout(n),n=null)},b=()=>{l!==null&&(clearTimeout(l),l=null)},O=()=>{s=!0,e=!0,y(),b(),n=setTimeout(()=>{s=!1,e=!1,n=null},Kt)},_=d=>{if(d.touches.length!==1){t=null;return}const g=d.touches.item(0);if(!g){t=null;return}const m=window.innerWidth,p=g.clientX<=yt,R=g.clientX>=m-yt;if(!p&&!R){t=null;return}t={identifier:g.identifier,startX:g.clientX,startY:g.clientY,fromLeftEdge:p,moved:!1}},E=d=>{if(!t)return;if(d.touches.length!==1){t=null;return}const g=c(d.touches,t.identifier);if(!g){t=null;return}const m=g.clientX-t.startX,p=g.clientY-t.startY,R=Math.abs(m),a=Math.abs(p);if(a>mt&&a>R*pt){t=null;return}const u=t.fromLeftEdge?m>0:m<0;R>mt&&R>a*pt&&u&&(t.moved=!0)},x=d=>{if(!t)return;const g=c(d.changedTouches,t.identifier);if(!g){t=null;return}const m=g.clientX-t.startX,p=t.fromLeftEdge?m>0:m<0;if(t.moved&&p&&Math.abs(m)>=gt){O(),t=null;return}t.moved&&Math.abs(m)>=gt&&O(),t=null},k=()=>{t&&(t.moved&&O(),t=null)};return{initialize:()=>{if(typeof window>"u"||f)return;f=!0;const d={passive:!0,capture:!0};window.addEventListener("touchstart",_,d),window.addEventListener("touchmove",E,d),window.addEventListener("touchend",x,d),window.addEventListener("touchcancel",k,d)},destroy:()=>{if(typeof window>"u"||!f)return;f=!1;const d={capture:!0};window.removeEventListener("touchstart",_,d),window.removeEventListener("touchmove",E,d),window.removeEventListener("touchend",x,d),window.removeEventListener("touchcancel",k,d),y(),b(),t=null,s=!1,e=!1},isSwipeBack:()=>{const d=s||e;return d&&y(),d},onPageEnter:()=>{s=!1,y(),b(),l=setTimeout(()=>{e=!1,l=null},0)}}}function Xt(){let t=null;function s(){var n,l;t&&((n=t.outResolve)==null||n.call(t,null),(l=t.inResolve)==null||l.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){s();return}const n={from:t.from,to:t.to};t.outResolve(n),t.inResolve(n),t=null}}return{trigger(n,l){var c;l==="out"&&(t==null?void 0:t.to)===n&&!t.from&&((c=t.inResolve)==null||c.call(t,null),t={}),t&&(l==="out"&&t.from&&t.from!==n||l==="in"&&t.to&&t.to!==n)&&s(),t||(t={}),l==="out"?t.from=n:t.to=n},get(n){return new Promise(l=>{t||(t={}),n==="out"?t.outResolve=l:t.inResolve=l,e()})}}}const $=new Map;let Y=null,vt=!1;function St(t){if(t instanceof HTMLElement&&$.has(t)&&!t.isConnected){const s=$.get(t);$.delete(t),queueMicrotask(s)}for(const s of Array.from(t.childNodes))St(s)}function zt(){if(vt||typeof document>"u")return;vt=!0,Y=new MutationObserver(s=>{for(const e of s)for(const n of Array.from(e.removedNodes))St(n)});const t=()=>{Y==null||Y.observe(document.body,{childList:!0,subtree:!0})};document.body?t():document.addEventListener("DOMContentLoaded",t,{once:!0})}function $t(t,s){return zt(),$.set(t,s),()=>{$.delete(t)}}const it=new WeakMap;let G=null;const j="none !important";function z(t){const s=t.style.getPropertyValue("display");return t.style.getPropertyPriority("display")?`${s} !important`:s}function qt(){return G||(G=new MutationObserver(t=>{for(const s of t){const e=s.target,n=it.get(e);if(!n)continue;const l=z(e);l!==n.accounted&&(n.accounted=l,l===j?(n.reactHidden=!0,n.onHide()):l!=="none"&&n.reactHidden&&(n.reactHidden=!1,n.onShow()))}}),G)}function Vt(t,s){const e=z(t),n={accounted:e,reactHidden:e===j,onHide:s.onHide,onShow:s.onShow};return it.set(t,n),qt().observe(t,{attributes:!0,attributeFilter:["style"]}),{get isHidden(){return z(t)===j},setDisplay(l,f=!1){l===null?t.style.removeProperty("display"):t.style.setProperty("display",l,f?"important":""),n.accounted=z(t)},sync(){n.accounted=z(t),n.reactHidden=n.accounted===j},stop(){it.delete(t)}}}function Ut(t){return Array.isArray(t)}function wt(t){const s=[];for(const e of t)Ut(e)?s.push(...wt(e)):s.push(e);return s}function Yt(t,s={}){const{transitions:e=[],middleware:n=(o,i)=>({from:o,to:i}),preserveScroll:l=o=>o}=t,f=s.host??new Et,c=Xt(),y=Dt(wt(e)),b=Bt();b.initialize();const{initializeContext:O,calculateScrollOffset:_,evictScrollPosition:E,shouldPreserve:x,getScrollContainer:k,getPositionedParentElement:I,getScrollPosition:W}=Ft({preserveScroll:l});let T=null,P=null;const d=new WeakMap,g=o=>{d.set(o,{parent:o.parentElement,nextSibling:o.nextElementSibling})},m=o=>{const i=d.get(o);return i||{parent:o.parentElement,nextSibling:o.nextElementSibling}},p=new WeakMap,R=new WeakMap;let a=0;const u=o=>{const i=typeof getComputedStyle<"u"?getComputedStyle(o).display:"";return i&&i!=="none"?i:"block"},v=(o,i)=>{i.visibleDisplay=o.style.getPropertyValue("display"),i.computedDisplay=u(o)},w=(o,i)=>{if(R.get(o)!==i)return;R.delete(o);const r=p.get(o);r&&(r.savedCss!==null&&(o.style.cssText=r.savedCss,r.savedCss=null),r.intent==="hidden"?r.vis.setDisplay("none",!0):r.visibleDisplay?(r.vis.setDisplay(r.visibleDisplay,!1),v(o,r)):(r.vis.setDisplay(null),v(o,r)))},S=(o,i,r,h,L)=>{const M=h.element,D=L.element,H=(h.mode??"unmount")==="hidden",{parent:q,nextSibling:Q}=h.parent?{parent:h.parent,nextSibling:h.nextSibling}:m(M),V=_(i,r),tt={scrollOffset:V,from:{scroll:W(i)},to:{scroll:W(r)},get scrollingElement(){return k()||document.documentElement},get positionedParent(){return I()}};let C;if(H){C=M,C.style.top=`${-1*((V==null?void 0:V.y)??0)}px`;const N=p.get(D);N&&N.savedCss===null&&(N.savedCss=D.style.cssText)}else C=M.cloneNode(!0),C.setAttribute("data-ssgoi-clone",""),Lt(C,tt);x(i)||E(i);const U=H?++a:0;H&&(R.set(D,U),R.set(M,U));const ut=Promise.resolve(C),dt=Promise.resolve(D),ft=[],Pt={from:ut,to:dt,context:tt,createElement:((N,et="div")=>{const K=document.createElement(et);return K.setAttribute("data-ssgoi-id",N),ft.push(K),K})},Ct=Promise.resolve(o.prepare?o.prepare(Pt):{});kt({from:ut,to:dt,extras:Ct}).then(({from:N,to:et,extras:K})=>{!H&&q&&(Q&&q.contains(Q)?q.insertBefore(C,Q):q.appendChild(C));const nt=o.animation({from:N,to:et,context:tt,...K}),st=nt.onComplete;nt.onComplete=()=>{st==null||st(),H?(w(M,U),w(D,U)):C.parentElement&&C.parentElement.removeChild(C);for(const ot of ft)ot.parentElement&&ot.parentElement.removeChild(ot)},f.attach(nt)})},A=(o,i)=>{const r=b.isSwipeBack();c.trigger(o,i),c.get(i).then(h=>{if(i==="in"&&b.onPageEnter(),!h)return;if(r){i==="out"&&h.from&&!x(h.from)&&E(h.from),T=null,P=null;return}if(i!=="in")return;const{from:L,to:M}=n(h.from,h.to),D=Ht(L,M,y),J=T,H=P;T=null,P=null,!(!D||!J||!H)&&S(D,L,M,J,H)})},F=(o,i)=>{const r=p.get(o);if(!r)return;const h=r.intent==="hidden";if(r.intent="hidden",r.savedCss===null&&(r.savedCss=o.style.cssText),r.vis.setDisplay(r.computedDisplay||"block",!0),o.style.position="absolute",o.style.width="100%",o.style.left="0",h)return;const L=m(o);T={element:o,parent:L.parent,nextSibling:L.nextSibling,mode:"hidden"};const M=o.getAttribute("data-ssgoi-transition")??i;A(M,"out")},Rt=(o,i)=>{const r=p.get(o);if(!r||r.intent==="visible")return;r.intent="visible",v(o,r),r.savedCss!==null&&(o.style.cssText=r.savedCss,r.visibleDisplay?r.vis.setDisplay(r.visibleDisplay,!1):r.vis.setDisplay(null)),O(o,i),P={element:o,parent:o.parentElement,nextSibling:o.nextElementSibling};const h=o.getAttribute("data-ssgoi-transition")??i;A(h,"in")},At=(o,i)=>{const r=p.get(o);if(r&&(r.vis.stop(),p.delete(o),R.delete(o),r.intent==="hidden")){(T==null?void 0:T.element)===o&&(T=null),(P==null?void 0:P.element)===o&&(P=null);return}const h=m(o);T={element:o,parent:h.parent,nextSibling:h.nextSibling,mode:"unmount"};const L=o.getAttribute("data-ssgoi-transition")??i;A(L,"out")},lt=new WeakSet,ct=(o,i)=>{if(lt.has(i))return;lt.add(i),g(i);const r=Vt(i,{onHide:()=>F(i,o),onShow:()=>Rt(i,o)}),h={vis:r,savedCss:null,intent:r.isHidden?"hidden":"visible",visibleDisplay:"",computedDisplay:"block"};p.set(i,h),r.isHidden||(v(i,h),O(i,o),P={element:i,parent:i.parentElement,nextSibling:i.nextElementSibling},A(o,"in")),$t(i,()=>At(i,o))},at=new Map;return{register:ct,refFor:o=>{let i=at.get(o);return i||(i=r=>{r&&ct(o,r)},at.set(o,i)),i}}}const Tt="data-ssgoi-root",Gt=`[${Tt}]`,rt="data-ssgoi-transition",bt=`[${rt}]`,jt="[data-ssgoi-clone]";function Zt(){return typeof MutationObserver<"u"&&typeof HTMLElement<"u"&&typeof Node<"u"}function Jt(t){return t.nodeType===Node.ELEMENT_NODE}function Qt(t){return t instanceof HTMLElement}function te(t,s){if(!Zt())return()=>{};t.setAttribute(Tt,"");const e=c=>c.closest(Gt)===t,n=c=>{if(!Qt(c)||!e(c)||c.closest(jt))return;const y=c.getAttribute(rt);y!==null&&s.register(y,c)},l=c=>{if(Jt(c)){c.matches(bt)&&n(c);for(const y of c.querySelectorAll(bt))n(y)}},f=new MutationObserver(c=>{for(const y of c){if(y.type==="attributes"){n(y.target);continue}for(const b of y.addedNodes)l(b)}});return f.observe(t,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[rt]}),l(t),()=>f.disconnect()}exports.Animation=Z.Animation;exports.MultiAnimation=Z.MultiAnimation;exports.WebAnimation=Z.WebAnimation;exports.HostAnimation=Et;exports.createSggoiTransitionContext=Yt;exports.observeSsgoiTransitions=te;
package/dist/internal.js CHANGED
@@ -1,8 +1,8 @@
1
1
  var At = Object.defineProperty;
2
2
  var Ct = (t, s, e) => s in t ? At(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
3
3
  var B = (t, s, e) => Ct(t, typeof s != "symbol" ? s + "" : s, e);
4
- import { A as xt } from "./multi-animation-CnxqLEka.js";
5
- import { M as le, W as ce } from "./multi-animation-CnxqLEka.js";
4
+ import { A as xt } from "./multi-animation-Ch5rI3rB.js";
5
+ import { M as le, W as ce } from "./multi-animation-Ch5rI3rB.js";
6
6
  class Mt extends xt {
7
7
  constructor() {
8
8
  super(...arguments);
@@ -55,6 +55,16 @@ class R extends d {
55
55
  var t;
56
56
  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);
57
57
  }
58
+ /**
59
+ * Drop the WAAPI forwards-fill after the run has settled, letting inline
60
+ * styles govern the resting visual. Call only from `onComplete` (the run is
61
+ * already finished) — otherwise it cancels mid-flight. Unlike `complete()`,
62
+ * it writes no final frame, so a caller can reset the element to its natural
63
+ * state without the lingering fill clobbering it.
64
+ */
65
+ releaseFill() {
66
+ this.clearWaapi();
67
+ }
58
68
  get isAnimating() {
59
69
  return this.running;
60
70
  }
@@ -0,0 +1 @@
1
+ "use strict";var f=Object.defineProperty;var g=(r,a,t)=>a in r?f(r,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[a]=t;var n=(r,a,t)=>g(r,typeof a!="symbol"?a+"":a,t);class d{constructor(){n(this,"_playbackRate",1);n(this,"onUpdate");n(this,"onComplete")}get playbackRate(){return this._playbackRate}set playbackRate(a){this._playbackRate=a}}const y=.01,T=.01,m=.05,c=1e3/60;class v extends d{constructor(t){super();n(this,"element");n(this,"integrator");n(this,"styleFn");n(this,"lowerBound");n(this,"upperBound");n(this,"currentValue");n(this,"currentVelocity",0);n(this,"frames",[]);n(this,"waapi",null);n(this,"startTime",0);n(this,"running",!1);n(this,"paused",!1);n(this,"settled",!1);n(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){this.paused=!1,this.running=!0,this.waapi.play();return}this.runToward(this.upperBound)}reverse(){this.reversing=!0,this.runToward(this.lowerBound)}pause(){var t;this.running&&(this.captureLiveState(),(t=this.waapi)==null||t.pause(),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 i of this.frames)if((i.position-this.lowerBound)/e>=t)return i.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 i=e.position,s=this.lowerBound+this.upperBound-i;return{time:e.time,value:e.position,velocity:e.velocity,style:this.styleFn(i,s)}});return[{element:this.element,frames:t}]}matchInto(t){const e=t.find(i=>i.element===this.element);e&&(this.currentValue=e.value,this.currentVelocity=e.velocity)}runToward(t){var h;if(this.running&&this.captureLiveState(),this.clearWaapi(),this.running=!1,this.paused=!1,this.settled=!1,this.frames=S(this.integrator,this.currentValue,t,this.currentVelocity),this.frames.length===0){this.currentValue=t,this.currentVelocity=0,this.applyStyleAt(t),this.settled=!0,(h=this.onComplete)==null||h.call(this);return}const e=this.frames.map(o=>{const u=o.position,p=this.lowerBound+this.upperBound-u;return this.styleFn(u,p)}),i=e[0];if(i)for(const o of Object.keys(i))this.element.style[o]="";const s=this.frames[this.frames.length-1],l=s.time;this.waapi=this.element.animate(e,{duration:l,fill:"forwards",easing:"linear",composite:"replace"}),this.waapi.playbackRate=this.playbackRate,this.startTime=performance.now(),this.running=!0,this.waapi.onfinish=()=>{var o;this.running&&(this.running=!1,this.settled=!0,this.currentValue=s.position,this.currentVelocity=0,(o=this.onComplete)==null||o.call(this))}}clearWaapi(){var t;(t=this.waapi)==null||t.cancel(),this.waapi=null}captureLiveState(){if(this.frames.length===0)return;const t=performance.now()-this.startTime,{position:e,velocity:i}=R(this.frames,t);this.currentValue=e,this.currentVelocity=i}applyStyleAt(t){const e=this.lowerBound+this.upperBound-t,i=this.styleFn(t,e);for(const[s,l]of Object.entries(i))this.element.style[s]=typeof l=="number"?String(l):l}}function S(r,a,t,e){if(a===t&&e===0)return[];const i=600;let s={position:a,velocity:e},l=0;const h=[];for(let o=0;o<i;o++){const u=o*c;if(h.push({time:u,position:s.position,velocity:s.velocity}),s=r.step(s,t,c/1e3),r.isSettled(s,t)){if(l+=c/1e3,l>=m){h.push({time:(o+1)*c,position:t,velocity:0});break}}else l=0}return h}function R(r,a){if(r.length===0)return{position:0,velocity:0};const t=r[0],e=r[r.length-1];if(a<=0)return{position:t.position,velocity:t.velocity};if(a>=e.time)return{position:e.position,velocity:e.velocity};let i=0,s=r.length-1;for(;i<s-1;){const u=i+s>>1;r[u].time<=a?i=u:s=u}const l=r[i],h=r[s],o=(a-l.time)/(h.time-l.time);return{position:l.position+(h.position-l.position)*o,velocity:l.velocity+(h.velocity-l.velocity)*o}}class w extends d{constructor(t,e={}){super();n(this,"children");n(this,"startAt");n(this,"pendingComplete",0);n(this,"running",!1);n(this,"pendingStartTimers",[]);this.children=t,(e.mode??"parallel")==="sequence"?this.startAt=t.map((i,s)=>s===0?0:1):this.startAt=e.startAt??[]}play(){this.startRun("play")}reverse(){this.startRun("reverse")}pause(){this.running=!1,this.clearPendingStartTimers();for(const t of this.children)t.pause()}complete(){var t;this.running=!1,this.clearPendingStartTimers();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 i=e.onComplete;e.onComplete=()=>{i==null||i(),this.handleChildComplete()}}this.scheduleStart(0,t)}scheduleStart(t,e){if(!this.running||t>=this.children.length)return;this.children[t][e]();const i=t+1;if(i>=this.children.length)return;const s=this.startAt[i];if(s===void 0||s<=0){this.scheduleStart(i,e);return}const l=this.children[t].findTimeForProgress(s);if(l===null||l<=0){this.scheduleStart(i,e);return}const h=Math.abs(this.playbackRate)||1,o=l/h,u=setTimeout(()=>{this.pendingStartTimers=this.pendingStartTimers.filter(p=>p!==u),this.running&&this.scheduleStart(i,e)},o);this.pendingStartTimers.push(u)}clearPendingStartTimers(){for(const t of this.pendingStartTimers)clearTimeout(t);this.pendingStartTimers=[]}handleChildComplete(){this.pendingComplete--,this.pendingComplete<=0&&this.handleFinished()}handleFinished(){var t;this.running=!1,this.clearPendingStartTimers(),(t=this.onComplete)==null||t.call(this)}findTimeForProgress(t){return null}}exports.Animation=d;exports.MultiAnimation=w;exports.POSITION_THRESHOLD=y;exports.SETTLE_THRESHOLD=m;exports.VELOCITY_THRESHOLD=T;exports.WebAnimation=v;
@@ -1 +1 @@
1
- {"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/zoom/transition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAU/D,OAAO,KAAK,EACV,qBAAqB,EAGrB,UAAU,EAKX,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,QAAQ,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAuS5E,eAAO,MAAM,IAAI,GACf,SAAS,qBAAqB,KAC7B,gBAAgB,CAAC,UAAU,CAmF7B,CAAC"}
1
+ {"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/zoom/transition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAU/D,OAAO,KAAK,EACV,qBAAqB,EAGrB,UAAU,EAKX,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,QAAQ,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAuS5E,eAAO,MAAM,IAAI,GACf,SAAS,qBAAqB,KAC7B,gBAAgB,CAAC,UAAU,CAqG7B,CAAC"}
@@ -0,0 +1,27 @@
1
+ /**
2
+ * Viewport-accurate counterpart to {@link getRect}: `el`'s position relative to
3
+ * `root`, measured with getBoundingClientRect. Same `(root, el)` shape and
4
+ * meaning as `getRect`, but because gBCR is the on-screen box it REFLECTS any
5
+ * transform / nested-scroll BETWEEN `root` and `el` — e.g. a translate-based
6
+ * horizontal scroller — which is the position the zoom tile must animate from.
7
+ * `getRect` walks the offsetParent chain and ignores transforms, so the
8
+ * page-edge transitions (film, and sheet/jaemin/axis via getViewportRect) keep
9
+ * using it.
10
+ *
11
+ * Safety net: it also normalizes out any scale on `root` itself. The completion
12
+ * cleanup releases each animation's WAAPI fill, so a SETTLED page is back at its
13
+ * natural transform before the next transition measures it — but a page can
14
+ * still be mid-scale when measured by an INTERRUPTED transition (a back-tap
15
+ * before the previous one settles): `buildInput` runs before the orchestrator
16
+ * completes the prior transition, so the zoom background tween may still be
17
+ * scaling the page. gBCR is post-transform while `offsetWidth/Height` is the
18
+ * untransformed layout size, so their ratio is the live scale; dividing returns
19
+ * the rect in `root`'s layout space — the space the zoom translate operates in.
20
+ * An in-page translate (a scrolled row) is scaled by the same factor and so
21
+ * survives the division. (No-op when `root` is at scale 1.)
22
+ *
23
+ * Page-level scroll OUTSIDE `root` cancels in the `el − root` subtraction; the
24
+ * per-page scroll delta is reintroduced separately via context.scrollOffset.
25
+ */
26
+ export declare function getClientRect(root: HTMLElement, el: HTMLElement): DOMRect;
27
+ //# sourceMappingURL=get-client-rect.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"get-client-rect.d.ts","sourceRoot":"","sources":["../../src/lib/utils/get-client-rect.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE,EAAE,WAAW,GAAG,OAAO,CAWzE"}
@@ -3,6 +3,7 @@ export { getScrollingElement } from './get-scrolling-element';
3
3
  export { getPositionedParent } from './get-positioned-parent';
4
4
  export { sleep } from './sleep';
5
5
  export { getRect } from './get-rect';
6
+ export { getClientRect } from './get-client-rect';
6
7
  export { getViewportRect } from './get-viewport-rect';
7
8
  export { round, floor, ceil, toFixed } from './number';
8
9
  export { withResolvers } from './with-resolvers';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ssgoi/core",
3
- "version": "6.5.0-beta.1",
3
+ "version": "6.5.0-beta.2",
4
4
  "description": "Core animation engine for SSGOI - Native app-like page transitions with spring physics",
5
5
  "private": false,
6
6
  "type": "module",
@@ -1 +0,0 @@
1
- "use strict";var f=Object.defineProperty;var g=(r,a,t)=>a in r?f(r,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[a]=t;var n=(r,a,t)=>g(r,typeof a!="symbol"?a+"":a,t);class d{constructor(){n(this,"_playbackRate",1);n(this,"onUpdate");n(this,"onComplete")}get playbackRate(){return this._playbackRate}set playbackRate(a){this._playbackRate=a}}const y=.01,T=.01,m=.05,c=1e3/60;class v extends d{constructor(t){super();n(this,"element");n(this,"integrator");n(this,"styleFn");n(this,"lowerBound");n(this,"upperBound");n(this,"currentValue");n(this,"currentVelocity",0);n(this,"frames",[]);n(this,"waapi",null);n(this,"startTime",0);n(this,"running",!1);n(this,"paused",!1);n(this,"settled",!1);n(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){this.paused=!1,this.running=!0,this.waapi.play();return}this.runToward(this.upperBound)}reverse(){this.reversing=!0,this.runToward(this.lowerBound)}pause(){var t;this.running&&(this.captureLiveState(),(t=this.waapi)==null||t.pause(),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)}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 i of this.frames)if((i.position-this.lowerBound)/e>=t)return i.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 i=e.position,s=this.lowerBound+this.upperBound-i;return{time:e.time,value:e.position,velocity:e.velocity,style:this.styleFn(i,s)}});return[{element:this.element,frames:t}]}matchInto(t){const e=t.find(i=>i.element===this.element);e&&(this.currentValue=e.value,this.currentVelocity=e.velocity)}runToward(t){var h;if(this.running&&this.captureLiveState(),this.clearWaapi(),this.running=!1,this.paused=!1,this.settled=!1,this.frames=S(this.integrator,this.currentValue,t,this.currentVelocity),this.frames.length===0){this.currentValue=t,this.currentVelocity=0,this.applyStyleAt(t),this.settled=!0,(h=this.onComplete)==null||h.call(this);return}const e=this.frames.map(o=>{const u=o.position,p=this.lowerBound+this.upperBound-u;return this.styleFn(u,p)}),i=e[0];if(i)for(const o of Object.keys(i))this.element.style[o]="";const s=this.frames[this.frames.length-1],l=s.time;this.waapi=this.element.animate(e,{duration:l,fill:"forwards",easing:"linear",composite:"replace"}),this.waapi.playbackRate=this.playbackRate,this.startTime=performance.now(),this.running=!0,this.waapi.onfinish=()=>{var o;this.running&&(this.running=!1,this.settled=!0,this.currentValue=s.position,this.currentVelocity=0,(o=this.onComplete)==null||o.call(this))}}clearWaapi(){var t;(t=this.waapi)==null||t.cancel(),this.waapi=null}captureLiveState(){if(this.frames.length===0)return;const t=performance.now()-this.startTime,{position:e,velocity:i}=R(this.frames,t);this.currentValue=e,this.currentVelocity=i}applyStyleAt(t){const e=this.lowerBound+this.upperBound-t,i=this.styleFn(t,e);for(const[s,l]of Object.entries(i))this.element.style[s]=typeof l=="number"?String(l):l}}function S(r,a,t,e){if(a===t&&e===0)return[];const i=600;let s={position:a,velocity:e},l=0;const h=[];for(let o=0;o<i;o++){const u=o*c;if(h.push({time:u,position:s.position,velocity:s.velocity}),s=r.step(s,t,c/1e3),r.isSettled(s,t)){if(l+=c/1e3,l>=m){h.push({time:(o+1)*c,position:t,velocity:0});break}}else l=0}return h}function R(r,a){if(r.length===0)return{position:0,velocity:0};const t=r[0],e=r[r.length-1];if(a<=0)return{position:t.position,velocity:t.velocity};if(a>=e.time)return{position:e.position,velocity:e.velocity};let i=0,s=r.length-1;for(;i<s-1;){const u=i+s>>1;r[u].time<=a?i=u:s=u}const l=r[i],h=r[s],o=(a-l.time)/(h.time-l.time);return{position:l.position+(h.position-l.position)*o,velocity:l.velocity+(h.velocity-l.velocity)*o}}class w extends d{constructor(t,e={}){super();n(this,"children");n(this,"startAt");n(this,"pendingComplete",0);n(this,"running",!1);n(this,"pendingStartTimers",[]);this.children=t,(e.mode??"parallel")==="sequence"?this.startAt=t.map((i,s)=>s===0?0:1):this.startAt=e.startAt??[]}play(){this.startRun("play")}reverse(){this.startRun("reverse")}pause(){this.running=!1,this.clearPendingStartTimers();for(const t of this.children)t.pause()}complete(){var t;this.running=!1,this.clearPendingStartTimers();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 i=e.onComplete;e.onComplete=()=>{i==null||i(),this.handleChildComplete()}}this.scheduleStart(0,t)}scheduleStart(t,e){if(!this.running||t>=this.children.length)return;this.children[t][e]();const i=t+1;if(i>=this.children.length)return;const s=this.startAt[i];if(s===void 0||s<=0){this.scheduleStart(i,e);return}const l=this.children[t].findTimeForProgress(s);if(l===null||l<=0){this.scheduleStart(i,e);return}const h=Math.abs(this.playbackRate)||1,o=l/h,u=setTimeout(()=>{this.pendingStartTimers=this.pendingStartTimers.filter(p=>p!==u),this.running&&this.scheduleStart(i,e)},o);this.pendingStartTimers.push(u)}clearPendingStartTimers(){for(const t of this.pendingStartTimers)clearTimeout(t);this.pendingStartTimers=[]}handleChildComplete(){this.pendingComplete--,this.pendingComplete<=0&&this.handleFinished()}handleFinished(){var t;this.running=!1,this.clearPendingStartTimers(),(t=this.onComplete)==null||t.call(this)}findTimeForProgress(t){return null}}exports.Animation=d;exports.MultiAnimation=w;exports.POSITION_THRESHOLD=y;exports.SETTLE_THRESHOLD=m;exports.VELOCITY_THRESHOLD=T;exports.WebAnimation=v;
@@ -1,25 +0,0 @@
1
- /**
2
- * Element rect relative to `root`, measured in VISUAL (rendered) coordinates
3
- * via `getBoundingClientRect` — the zoom-local counterpart to the shared,
4
- * offset-based `getRect`.
5
- *
6
- * Why zoom needs its own: the offset walk in `getRect` returns LAYOUT position,
7
- * which is invariant to any scroll container sitting BETWEEN the element and the
8
- * page — e.g. a horizontally-scrolled carousel holding the zoom-exit tile. That
9
- * container's `scrollLeft` never shows up, so the tile animates from the wrong
10
- * on-screen spot. `getBoundingClientRect` folds in every ancestor scroll AND
11
- * transform, so the scrolled position is captured for free.
12
- *
13
- * Kept ROOT-RELATIVE (`el.rect - root.rect`) on purpose so the existing
14
- * contract is preserved:
15
- * - the page's OWN scroll/position/transform shifts both `root` and `el`
16
- * equally and cancels in the subtraction, so page-level scroll stays owned
17
- * by `scrollOffset` (no double-correction, no regression);
18
- * - only scroll/transform STRICTLY between `root` and `el` survives — exactly
19
- * the nested-carousel case the offset walk missed.
20
- *
21
- * Measured before any zoom transform lands on the tile, so the tile's own
22
- * not-yet-applied transform can't pollute the read.
23
- */
24
- export declare function getVisualRect(root: HTMLElement, el: HTMLElement): DOMRect;
25
- //# sourceMappingURL=get-visual-rect.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"get-visual-rect.d.ts","sourceRoot":"","sources":["../../../src/lib/transitions/zoom/get-visual-rect.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE,EAAE,WAAW,GAAG,OAAO,CASzE"}