@ssgoi/react 0.0.7 → 2.0.0
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/README.md +12 -0
- package/dist/context.cjs +2 -0
- package/dist/context.js +12 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +6 -772
- package/dist/presets/index.cjs +1 -0
- package/dist/presets/index.d.ts +1 -0
- package/dist/presets/index.js +1 -0
- package/dist/ssgoi-transition.cjs +2 -0
- package/dist/ssgoi-transition.js +14 -0
- package/dist/ssgoi.cjs +2 -0
- package/dist/ssgoi.js +15 -0
- package/dist/transition.d.ts +1 -2
- package/dist/transitions/index.cjs +1 -1
- package/dist/transitions/index.js +1 -173
- package/dist/view-transitions/index.cjs +1 -1
- package/dist/view-transitions/index.js +1 -305
- package/package.json +38 -3
- package/dist/utils-DR41YsAh-CN_CfgYX.cjs +0 -1
- package/dist/utils-DR41YsAh-mLT5vDuI.js +0 -16
- package/src/assets/react.svg +0 -1
- package/src/lib/context.tsx +0 -14
- package/src/lib/index.ts +0 -4
- package/src/lib/ssgoi-transition.tsx +0 -21
- package/src/lib/ssgoi.tsx +0 -20
- package/src/lib/transition.ts +0 -3
- package/src/lib/transitions/index.ts +0 -1
- package/src/lib/types.ts +0 -1
- package/src/lib/view-transitions/index.ts +0 -1
- package/src/vite-env.d.ts +0 -1
package/README.md
CHANGED
|
@@ -2,6 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
React bindings for SSGOI - Native app-like page transitions for React applications.
|
|
4
4
|
|
|
5
|
+
try this: [ssgoi.dev](https://ssgoi.dev)
|
|
6
|
+
|
|
7
|
+

|
|
8
|
+
|
|
5
9
|
## What is SSGOI?
|
|
6
10
|
|
|
7
11
|
SSGOI brings native app-like page transitions to the web. Transform your static page navigations into smooth, delightful experiences that users love.
|
|
@@ -256,6 +260,14 @@ const config: SsgoiConfig = {
|
|
|
256
260
|
- Automatic cleanup and memory management
|
|
257
261
|
- Smart preloading for instant transitions
|
|
258
262
|
|
|
263
|
+
## Documentation
|
|
264
|
+
|
|
265
|
+
Visit [https://ssgoi.dev](https://ssgoi.dev) for:
|
|
266
|
+
- Complete API reference
|
|
267
|
+
- Interactive examples
|
|
268
|
+
- Advanced patterns
|
|
269
|
+
- Migration guides
|
|
270
|
+
|
|
259
271
|
## Contributing
|
|
260
272
|
|
|
261
273
|
We welcome contributions! Please see our [contributing guide](https://github.com/meursyphus/ssgoi/blob/main/CONTRIBUTING.md) for details.
|
package/dist/context.cjs
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react"),t=o.createContext(null),r=t.Provider,s=()=>{const e=o.useContext(t);if(!e)throw new Error("useSsgoi must be used within SsgoiProvider");return e};exports.SsgoiProvider=r;exports.useSsgoi=s;
|
package/dist/context.js
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { createContext as e, useContext as r } from "react";
|
|
3
|
+
const t = e(null), n = t.Provider, i = () => {
|
|
4
|
+
const o = r(t);
|
|
5
|
+
if (!o)
|
|
6
|
+
throw new Error("useSsgoi must be used within SsgoiProvider");
|
|
7
|
+
return o;
|
|
8
|
+
};
|
|
9
|
+
export {
|
|
10
|
+
n as SsgoiProvider,
|
|
11
|
+
i as useSsgoi
|
|
12
|
+
};
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Wt=require("./utils-DR41YsAh-CN_CfgYX.cjs"),dt=require("react/jsx-runtime"),_=require("react");var Gt=Object.defineProperty,Ht=(t,e,n)=>e in t?Gt(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,A=(t,e,n)=>Ht(t,typeof e!="symbol"?e+"":e,n);function gt(t,e){var n={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(n[r]=t[r]);if(t!=null&&typeof Object.getOwnPropertySymbols=="function")for(var o=0,r=Object.getOwnPropertySymbols(t);o<r.length;o++)e.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(t,r[o])&&(n[r[o]]=t[r[o]]);return n}var tt=function(){},E=function(){};process.env.NODE_ENV!=="production"&&(tt=function(t,e){!t&&typeof console<"u"&&console.warn(e)},E=function(t,e){if(!t)throw new Error(e)});const H=(t,e,n)=>Math.min(Math.max(n,t),e),B=.001,Yt=.01,it=10,zt=.05,Jt=1;function Kt({duration:t=800,bounce:e=.25,velocity:n=0,mass:r=1}){let o,a;tt(t<=it*1e3,"Spring duration must be 10 seconds or less");let s=1-e;s=H(zt,Jt,s),t=H(Yt,it,t/1e3),s<1?(o=u=>{const h=u*s,m=h*t,i=h-n,l=Y(u,s),p=Math.exp(-m);return B-i/l*p},a=u=>{const h=u*s*t,m=h*n+n,i=Math.pow(s,2)*Math.pow(u,2)*t,l=Math.exp(-h),p=Y(Math.pow(u,2),s);return(-o(u)+B>0?-1:1)*((m-i)*l)/p}):(o=u=>{const h=Math.exp(-u*t),m=(u-n)*t+1;return-B+h*m},a=u=>{const h=Math.exp(-u*t),m=(n-u)*(t*t);return h*m});const f=5/t,c=Xt(o,a,f);if(t=t*1e3,isNaN(c))return{stiffness:100,damping:10,duration:t};{const u=Math.pow(c,2)*r;return{stiffness:u,damping:s*2*Math.sqrt(r*u),duration:t}}}const Qt=12;function Xt(t,e,n){let r=n;for(let o=1;o<Qt;o++)r=r-t(r)/e(r);return r}function Y(t,e){return t*Math.sqrt(1-e*e)}const Zt=["duration","bounce"],_t=["stiffness","damping","mass"];function lt(t,e){return e.some(n=>t[n]!==void 0)}function te(t){let e=Object.assign({velocity:0,stiffness:100,damping:10,mass:1,isResolvedFromDuration:!1},t);if(!lt(t,_t)&<(t,Zt)){const n=Kt(t);e=Object.assign(Object.assign(Object.assign({},e),n),{velocity:0,mass:1}),e.isResolvedFromDuration=!0}return e}function et(t){var{from:e=0,to:n=1,restSpeed:r=2,restDelta:o}=t,a=gt(t,["from","to","restSpeed","restDelta"]);const s={done:!1,value:e};let{stiffness:f,damping:c,mass:u,velocity:h,duration:m,isResolvedFromDuration:i}=te(a),l=ut,p=ut;function y(){const b=h?-(h/1e3):0,d=n-e,g=c/(2*Math.sqrt(f*u)),M=Math.sqrt(f/u)/1e3;if(o===void 0&&(o=Math.min(Math.abs(n-e)/100,.4)),g<1){const v=Y(M,g);l=w=>{const x=Math.exp(-g*M*w);return n-x*((b+g*M*d)/v*Math.sin(v*w)+d*Math.cos(v*w))},p=w=>{const x=Math.exp(-g*M*w);return g*M*x*(Math.sin(v*w)*(b+g*M*d)/v+d*Math.cos(v*w))-x*(Math.cos(v*w)*(b+g*M*d)-v*d*Math.sin(v*w))}}else if(g===1)l=v=>n-Math.exp(-M*v)*(d+(b+M*d)*v);else{const v=M*Math.sqrt(g*g-1);l=w=>{const x=Math.exp(-g*M*w),j=Math.min(v*w,300);return n-x*((b+g*M*d)*Math.sinh(j)+v*d*Math.cosh(j))/v}}}return y(),{next:b=>{const d=l(b);if(i)s.done=b>=m;else{const g=p(b)*1e3,M=Math.abs(g)<=r,v=Math.abs(n-d)<=o;s.done=M&&v}return s.value=s.done?n:d,s},flipTarget:()=>{h=-h,[e,n]=[n,e],y()}}}et.needsInterpolation=(t,e)=>typeof t=="string"||typeof e=="string";const ut=t=>0,vt=(t,e,n)=>{const r=e-t;return r===0?1:(n-t)/r},nt=(t,e,n)=>-n*t+n*e+t,yt=(t,e)=>n=>Math.max(Math.min(n,e),t),R=t=>t%1?Number(t.toFixed(5)):t,N=/(-)?([\d]*\.?[\d])+/g,z=/(#[0-9a-f]{6}|#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2}(-?[\d\.]+%?)\s*[\,\/]?\s*[\d\.]*%?\))/gi,ee=/^(#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2}(-?[\d\.]+%?)\s*[\,\/]?\s*[\d\.]*%?\))$/i;function k(t){return typeof t=="string"}const U={test:t=>typeof t=="number",parse:parseFloat,transform:t=>t},bt=Object.assign(Object.assign({},U),{transform:yt(0,1)});Object.assign(Object.assign({},U),{default:1});const ne=t=>({test:e=>k(e)&&e.endsWith(t)&&e.split(" ").length===1,parse:parseFloat,transform:e=>`${e}${t}`}),V=ne("%");Object.assign(Object.assign({},V),{parse:t=>V.parse(t)/100,transform:t=>V.transform(t*100)});const rt=(t,e)=>n=>!!(k(n)&&ee.test(n)&&n.startsWith(t)||e&&Object.prototype.hasOwnProperty.call(n,e)),Mt=(t,e,n)=>r=>{if(!k(r))return r;const[o,a,s,f]=r.match(N);return{[t]:parseFloat(o),[e]:parseFloat(a),[n]:parseFloat(s),alpha:f!==void 0?parseFloat(f):1}},S={test:rt("hsl","hue"),parse:Mt("hue","saturation","lightness"),transform:({hue:t,saturation:e,lightness:n,alpha:r=1})=>"hsla("+Math.round(t)+", "+V.transform(R(e))+", "+V.transform(R(n))+", "+R(bt.transform(r))+")"},re=yt(0,255),W=Object.assign(Object.assign({},U),{transform:t=>Math.round(re(t))}),O={test:rt("rgb","red"),parse:Mt("red","green","blue"),transform:({red:t,green:e,blue:n,alpha:r=1})=>"rgba("+W.transform(t)+", "+W.transform(e)+", "+W.transform(n)+", "+R(bt.transform(r))+")"};function oe(t){let e="",n="",r="",o="";return t.length>5?(e=t.substr(1,2),n=t.substr(3,2),r=t.substr(5,2),o=t.substr(7,2)):(e=t.substr(1,1),n=t.substr(2,1),r=t.substr(3,1),o=t.substr(4,1),e+=e,n+=n,r+=r,o+=o),{red:parseInt(e,16),green:parseInt(n,16),blue:parseInt(r,16),alpha:o?parseInt(o,16)/255:1}}const J={test:rt("#"),parse:oe,transform:O.transform},$={test:t=>O.test(t)||J.test(t)||S.test(t),parse:t=>O.test(t)?O.parse(t):S.test(t)?S.parse(t):J.parse(t),transform:t=>k(t)?t:t.hasOwnProperty("red")?O.transform(t):S.transform(t)},wt="${c}",xt="${n}";function se(t){var e,n,r,o;return isNaN(t)&&k(t)&&((n=(e=t.match(N))===null||e===void 0?void 0:e.length)!==null&&n!==void 0?n:0)+((o=(r=t.match(z))===null||r===void 0?void 0:r.length)!==null&&o!==void 0?o:0)>0}function Ot(t){typeof t=="number"&&(t=`${t}`);const e=[];let n=0;const r=t.match(z);r&&(n=r.length,t=t.replace(z,wt),e.push(...r.map($.parse)));const o=t.match(N);return o&&(t=t.replace(N,xt),e.push(...o.map(U.parse))),{values:e,numColors:n,tokenised:t}}function St(t){return Ot(t).values}function jt(t){const{values:e,numColors:n,tokenised:r}=Ot(t),o=e.length;return a=>{let s=r;for(let f=0;f<o;f++)s=s.replace(f<n?wt:xt,f<n?$.transform(a[f]):R(a[f]));return s}}const ae=t=>typeof t=="number"?0:t;function ie(t){const e=St(t);return jt(t)(e.map(ae))}const At={test:se,parse:St,createTransformer:jt,getAnimatableNone:ie};function G(t,e,n){return n<0&&(n+=1),n>1&&(n-=1),n<1/6?t+(e-t)*6*n:n<1/2?e:n<2/3?t+(e-t)*(2/3-n)*6:t}function ct({hue:t,saturation:e,lightness:n,alpha:r}){t/=360,e/=100,n/=100;let o=0,a=0,s=0;if(!e)o=a=s=n;else{const f=n<.5?n*(1+e):n+e-n*e,c=2*n-f;o=G(c,f,t+1/3),a=G(c,f,t),s=G(c,f,t-1/3)}return{red:Math.round(o*255),green:Math.round(a*255),blue:Math.round(s*255),alpha:r}}const le=(t,e,n)=>{const r=t*t,o=e*e;return Math.sqrt(Math.max(0,n*(o-r)+r))},ue=[J,O,S],ft=t=>ue.find(e=>e.test(t)),pt=t=>`'${t}' is not an animatable color. Use the equivalent color code instead.`,Ct=(t,e)=>{let n=ft(t),r=ft(e);E(!!n,pt(t)),E(!!r,pt(e));let o=n.parse(t),a=r.parse(e);n===S&&(o=ct(o),n=O),r===S&&(a=ct(a),r=O);const s=Object.assign({},o);return f=>{for(const c in s)c!=="alpha"&&(s[c]=le(o[c],a[c],f));return s.alpha=nt(o.alpha,a.alpha,f),n.transform(s)}},ce=t=>typeof t=="number",fe=(t,e)=>n=>e(t(n)),Rt=(...t)=>t.reduce(fe);function Vt(t,e){return ce(t)?n=>nt(t,e,n):$.test(t)?Ct(t,e):Et(t,e)}const Pt=(t,e)=>{const n=[...t],r=n.length,o=t.map((a,s)=>Vt(a,e[s]));return a=>{for(let s=0;s<r;s++)n[s]=o[s](a);return n}},pe=(t,e)=>{const n=Object.assign(Object.assign({},t),e),r={};for(const o in n)t[o]!==void 0&&e[o]!==void 0&&(r[o]=Vt(t[o],e[o]));return o=>{for(const a in r)n[a]=r[a](o);return n}};function ht(t){const e=At.parse(t),n=e.length;let r=0,o=0,a=0;for(let s=0;s<n;s++)r||typeof e[s]=="number"?r++:e[s].hue!==void 0?a++:o++;return{parsed:e,numNumbers:r,numRGB:o,numHSL:a}}const Et=(t,e)=>{const n=At.createTransformer(e),r=ht(t),o=ht(e);return r.numHSL===o.numHSL&&r.numRGB===o.numRGB&&r.numNumbers>=o.numNumbers?Rt(Pt(r.parsed,o.parsed),n):(tt(!0,`Complex values '${t}' and '${e}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`),a=>`${a>0?e:t}`)},he=(t,e)=>n=>nt(t,e,n);function me(t){if(typeof t=="number")return he;if(typeof t=="string")return $.test(t)?Ct:Et;if(Array.isArray(t))return Pt;if(typeof t=="object")return pe}function de(t,e,n){const r=[],o=n||me(t[0]),a=t.length-1;for(let s=0;s<a;s++){let f=o(t[s],t[s+1]);if(e){const c=Array.isArray(e)?e[s]:e;f=Rt(c,f)}r.push(f)}return r}function ge([t,e],[n]){return r=>n(vt(t,e,r))}function ve(t,e){const n=t.length,r=n-1;return o=>{let a=0,s=!1;if(o<=t[0]?s=!0:o>=t[r]&&(a=r-1,s=!0),!s){let c=1;for(;c<n&&!(t[c]>o||c===r);c++);a=c-1}const f=vt(t[a],t[a+1],o);return e[a](f)}}function Tt(t,e,{clamp:n=!0,ease:r,mixer:o}={}){const a=t.length;E(a===e.length,"Both input and output ranges must be the same length"),E(!r||!Array.isArray(r)||r.length===a-1,"Array of easing functions must be of length `input.length - 1`, as it applies to the transitions **between** the defined values."),t[0]>t[a-1]&&(t=[].concat(t),e=[].concat(e),t.reverse(),e.reverse());const s=de(e,r,o),f=a===2?ge(t,s):ve(t,s);return n?c=>f(H(t[0],t[a-1],c)):f}const ye=t=>e=>e<=.5?t(2*e)/2:(2-t(2*(1-e)))/2,be=t=>e=>Math.pow(e,t),Me=be(2),we=ye(Me);function xe(t,e){return t.map(()=>e||we).splice(0,t.length-1)}function Oe(t){const e=t.length;return t.map((n,r)=>r!==0?r/(e-1):0)}function Se(t,e){return t.map(n=>n*e)}function F({from:t=0,to:e=1,ease:n,offset:r,duration:o=300}){const a={done:!1,value:t},s=Array.isArray(e)?e:[t,e],f=Se(r&&r.length===s.length?r:Oe(s),o);function c(){return Tt(f,s,{ease:Array.isArray(n)?n:xe(s,n)})}let u=c();return{next:h=>(a.value=u(h),a.done=h>=o,a),flipTarget:()=>{s.reverse(),u=c()}}}function je({velocity:t=0,from:e=0,power:n=.8,timeConstant:r=350,restDelta:o=.5,modifyTarget:a}){const s={done:!1,value:e};let f=n*t;const c=e+f,u=a===void 0?c:a(c);return u!==c&&(f=u-e),{next:h=>{const m=-f*Math.exp(-h/r);return s.done=!(m>o||m<-o),s.value=s.done?u:u+m,s},flipTarget:()=>{}}}const mt={keyframes:F,spring:et,decay:je};function Ae(t){if(Array.isArray(t.to))return F;if(mt[t.type])return mt[t.type];const e=new Set(Object.keys(t));return e.has("ease")||e.has("duration")&&!e.has("dampingRatio")?F:e.has("dampingRatio")||e.has("stiffness")||e.has("mass")||e.has("damping")||e.has("restSpeed")||e.has("restDelta")?et:F}const kt=1/60*1e3,Ce=typeof performance<"u"?()=>performance.now():()=>Date.now(),It=typeof window<"u"?t=>window.requestAnimationFrame(t):t=>setTimeout(()=>t(Ce()),kt);function Re(t){let e=[],n=[],r=0,o=!1,a=!1;const s=new WeakSet,f={schedule:(c,u=!1,h=!1)=>{const m=h&&o,i=m?e:n;return u&&s.add(c),i.indexOf(c)===-1&&(i.push(c),m&&o&&(r=e.length)),c},cancel:c=>{const u=n.indexOf(c);u!==-1&&n.splice(u,1),s.delete(c)},process:c=>{if(o){a=!0;return}if(o=!0,[e,n]=[n,e],n.length=0,r=e.length,r)for(let u=0;u<r;u++){const h=e[u];h(c),s.has(h)&&(f.schedule(h),t())}o=!1,a&&(a=!1,f.process(c))}};return f}const Ve=40;let K=!0,T=!1,Q=!1;const P={delta:0,timestamp:0},I=["read","update","preRender","render","postRender"],q=I.reduce((t,e)=>(t[e]=Re(()=>T=!0),t),{}),Pe=I.reduce((t,e)=>{const n=q[e];return t[e]=(r,o=!1,a=!1)=>(T||ke(),n.schedule(r,o,a)),t},{}),Ee=I.reduce((t,e)=>(t[e]=q[e].cancel,t),{});I.reduce((t,e)=>(t[e]=()=>q[e].process(P),t),{});const Te=t=>q[t].process(P),Dt=t=>{T=!1,P.delta=K?kt:Math.max(Math.min(t-P.timestamp,Ve),1),P.timestamp=t,Q=!0,I.forEach(Te),Q=!1,T&&(K=!1,It(Dt))},ke=()=>{T=!0,K=!0,Q||It(Dt)};function Ft(t,e,n=0){return t-e-n}function Ie(t,e,n=0,r=!0){return r?Ft(e+-t,e,n):e-(t-e)+n}function De(t,e,n,r){return r?t>=e+n:t<=-n}const Fe=t=>{const e=({delta:n})=>t(n);return{start:()=>Pe.update(e,!0),stop:()=>Ee.update(e)}};function Ne(t){var e,n,{from:r,autoplay:o=!0,driver:a=Fe,elapsed:s=0,repeat:f=0,repeatType:c="loop",repeatDelay:u=0,onPlay:h,onStop:m,onComplete:i,onRepeat:l,onUpdate:p}=t,y=gt(t,["from","autoplay","driver","elapsed","repeat","repeatType","repeatDelay","onPlay","onStop","onComplete","onRepeat","onUpdate"]);let{to:b}=y,d,g=0,M=y.duration,v,w=!1,x=!0,j;const ot=Ae(y);!((n=(e=ot).needsInterpolation)===null||n===void 0)&&n.call(e,r,b)&&(j=Tt([0,100],[r,b],{clamp:!1}),r=0,b=100);const st=ot(Object.assign(Object.assign({},y),{from:r,to:b}));function $t(){g++,c==="reverse"?(x=g%2===0,s=Ie(s,M,u,x)):(s=Ft(s,M,u),c==="mirror"&&st.flipTarget()),w=!1,l&&l()}function qt(){d.stop(),i&&i()}function Lt(L){if(x||(L=-L),s+=L,!w){const at=st.next(Math.max(0,s));v=at.value,j&&(v=j(v)),w=x?at.done:s<=0}p?.(v),w&&(g===0&&(M??(M=s)),g<f?De(s,M,u,x)&&$t():qt())}function Bt(){h?.(),d=a(Lt),d.start()}return o&&Bt(),{stop:()=>{m?.(),d.stop()}}}class C{constructor(e){A(this,"options"),A(this,"currentValue"),A(this,"velocity",0),A(this,"isAnimating",!1),A(this,"controls",null),A(this,"animate",(n=!1)=>{!this.isAnimating&&this.options.onStart&&this.options.onStart(),this.isAnimating=!0;const r=n?this.options.from:this.options.to;let o=this.currentValue,a=performance.now();this.controls=Ne({from:this.currentValue,to:r,velocity:this.velocity*1e3,stiffness:this.options.spring.stiffness,damping:this.options.spring.damping,mass:1,onUpdate:s=>{const f=performance.now(),c=(f-a)/1e3;if(c>0){const u=(s-o)/c;this.velocity=u/1e3,o=s,a=f}this.currentValue=s,this.options.onUpdate(s)},onComplete:()=>{this.currentValue=r,this.isAnimating=!1,this.controls=null,this.velocity=0,this.options.onComplete()}})}),this.options={from:e.from??0,to:e.to??1,spring:e.spring??{stiffness:100,damping:10},onUpdate:e.onUpdate??(()=>{}),onComplete:e.onComplete??(()=>{}),onStart:e.onStart},this.currentValue=this.options.from}forward(){this.stop(),this.animate(!1)}backward(){this.stop(),this.animate(!0)}reverse(){const e=this.options.from;if(this.options.from=this.options.to,this.options.to=e,this.isAnimating){const n=this.currentValue>(this.options.from+this.options.to)/2;this.stop(),this.animate(!n)}}stop(){this.isAnimating=!1,this.controls&&(this.controls.stop(),this.controls=null)}getVelocity(){return this.velocity}getCurrentValue(){return this.currentValue}getIsAnimating(){return this.isAnimating}getCurrentState(){return{position:this.currentValue,velocity:this.velocity}}setVelocity(e){this.velocity=e}setValue(e){this.currentValue=e}updateOptions(e){if(this.options={...this.options,...e},this.isAnimating&&this.controls){const n=this.currentValue<this.options.to;this.stop(),this.animate(!n)}}static fromState(e,n){const r=new C(n);return r.setValue(e.position),r.setVelocity(e.velocity),r}}function Ue(t,e){let n=null,r=null,o=null,a=null,s=!1;const f=async u=>{var h;if(n&&n.getIsAnimating()&&!s){const m=n.getCurrentState();n.stop(),r&&(r.remove(),r=null),s=!0;const i=t();if(!i.out)return;const l=await Promise.resolve(i.out(u));n=C.fromState(m,{from:1,to:0,spring:l.spring,onStart:l.onStart,onUpdate:p=>{var y;(y=l.tick)==null||y.call(l,p)},onComplete:()=>{var p;n=null,s=!1,(p=l.onEnd)==null||p.call(l)}}),n.backward();return}if(!n||!n.getIsAnimating()){s=!0;const m=t();if(!m.in)return;const i=await Promise.resolve(m.in(u));(h=i.prepare)==null||h.call(i,u),n=new C({from:0,to:1,spring:i.spring,onStart:i.onStart,onUpdate:l=>{var p;(p=i.tick)==null||p.call(i,l)},onComplete:()=>{var l;n=null,s=!1,(l=i.onEnd)==null||l.call(i)}}),n.forward()}};function c(u){const h=()=>{!o||!r||(a&&o.contains(a)?o.insertBefore(r,a):o.appendChild(r))},m=()=>{var l;r&&(r.remove(),r=null),n=null,s=!1,(l=e?.onCleanupEnd)==null||l.call(e)},i=t();if(r=u.cloneNode(!0),n&&n.getIsAnimating()&&s){const l=n.getCurrentState();if(n.stop(),s=!1,!i.in){r=null,m();return}Promise.resolve(i.in(r)).then(async p=>{var y;const b=r&&await((y=i.out)==null?void 0:y.call(i,r));b!=null&&b.prepare&&r&&b.prepare(r),h(),n=C.fromState(l,{from:0,to:1,spring:p.spring,onStart:p.onStart,onUpdate:d=>{var g;(g=p.tick)==null||g.call(p,d)},onComplete:()=>{var d;(d=p.onEnd)==null||d.call(p),m()}}),n.backward()});return}if(!n||!n.getIsAnimating()||!s){if(s=!1,!i.out){r=null,m();return}Promise.resolve(i.out(r)).then(l=>{var p;r&&((p=l.prepare)==null||p.call(l,r)),h(),n=new C({from:1,to:0,spring:l.spring,onStart:l.onStart,onUpdate:y=>{var b;(b=l.tick)==null||b.call(l,y)},onComplete:()=>{var y;(y=l.onEnd)==null||y.call(l),m()}}),n.forward()})}}return u=>u?(o=u.parentElement,a=u.nextElementSibling,t().in&&f(u),()=>{c(u)}):void 0}const X=new Map,Z=new Map;function $e(t,e){X.set(t,e);let n=Z.get(t);return n||(n=Ue(()=>X.get(t)||(console.warn(`Transition "${String(t)}" not found`),{}),{onCleanupEnd:()=>qe(t)}),Z.set(t,n),n)}function qe(t){X.delete(t),Z.delete(t)}function Le(t){return $e(t.key,{in:t.in,out:t.out})}function Be(t){let e=null;const n=[...t.transitions],r=[];for(const i of t.transitions)i.symmetric&&(n.some(l=>l.from===i.to&&l.to===i.from)||r.push({from:i.to,to:i.from,transition:i.transition}));n.push(...r);let o=null;const a=new Map;let s=null;const f=()=>{o&&s&&a.set(s,{x:o.scrollLeft,y:o.scrollTop})},c=(i,l)=>{o||(o=Wt.r(i),o.addEventListener("scroll",f,{passive:!0})),s=l},u=()=>{const i=e?.from,l=e?.to,p=i&&a.has(i)?a.get(i):{x:0,y:0},y=l&&a.has(l)?a.get(l):{x:0,y:0};return{x:-y.x+p.x,y:-y.y+p.y}};function h(){if(e!=null&&e.from&&e!=null&&e.to){const i=We(e.from,e.to,n)||t.defaultTransition,l={scrollOffset:u()};i&&(i.out&&e.outResolve&&e.outResolve(p=>i.out(p,l)),i.in&&e.inResolve&&e.inResolve(p=>i.in(p,l))),e=null}}const m=async(i,l)=>l==="in"&&(!e||!e.from)?()=>({}):(e||(e={}),l==="out"?(e.from=i,new Promise(p=>{e.outResolve=p,h()})):(e.to=i,new Promise(p=>{e.inResolve=p,h()})));return i=>({key:i,in:async l=>(c(l,i),(await m(i,"in"))(l)),out:async l=>(await m(i,"out"))(l)})}function We(t,e,n){for(const r of n)if(D(t,r.from)&&D(e,r.to))return r.transition;for(const r of n)if((r.from==="*"||D(t,r.from))&&(r.to==="*"||D(e,r.to)))return r.transition;return null}function D(t,e){if(e==="*")return!0;if(e.endsWith("/*")){const n=e.slice(0,-2);return t===n||t.startsWith(n+"/")}return t===e}const Nt=Le,Ut=_.createContext(null),Ge=Ut.Provider,He=()=>{const t=_.useContext(Ut);if(!t)throw new Error("useSsgoi must be used within SsgoiProvider");return t},Ye=({config:t,children:e})=>{const n=_.useMemo(()=>Be(t),[t]);return dt.jsx(Ge,{value:n,children:e})},ze=({children:t,id:e})=>{const n=He();return dt.jsx("div",{ref:Nt(n(e)),"data-ssgoi-transition":e,children:t})};exports.Ssgoi=Ye;exports.SsgoiTransition=ze;exports.transition=Nt;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@ssgoi/core"),i=require("./ssgoi.cjs"),o=require("./ssgoi-transition.cjs");Object.defineProperty(exports,"transition",{enumerable:!0,get:()=>e.transition});exports.Ssgoi=i.Ssgoi;exports.SsgoiTransition=o.SsgoiTransition;
|