@infinityfx/lively 4.0.0-beta.2 → 4.0.0-beta.4

package/dist/animatable.js

@@ -1,3 +1,3 @@
 "use client";
-import{__rest as e}from"tslib";import{jsx as n}from"react/jsx-runtime";import{createContext as r,useRef as t,use as i,useMemo as a,useCallback as o,useImperativeHandle as s,useEffect as u,Children as l,isValidElement as c,cloneElement as d}from"react";import m from"./core/clip.js";import f from"./core/timeline.js";import{merge as p,pick as h,combineRefs as v}from"./core/utils.js";import g from"./hooks/use-mount-effect.js";const y=r(null);function b(r){const b=t(null),j=t([]),x=i(y),w=r.inherit&&x?p({},r,h(x,["group","animations","triggers","animate","initial","stagger","staggerLimit","deform","disabled","paused"])):r,{id:O="",inherit:k,triggers:L=[],disabled:E,adaptive:z=!1,manual:A=!1,paused:C}=w,M=void 0!==r.order?r.order:(k&&(null==x?void 0:x.index)||0)+1,D=t([]),T=a((()=>{const e={animate:m.from(w.animate,w.initial)};for(const n in w.animations)e[n]=m.from(w.animations[n],w.initial);return e}),[]),V=t(new f(Object.assign(Object.assign({},w),{mountClips:L.reduce(((e,{name:n,on:r})=>("mount"===r&&e.push(T[n||"animate"]),e)),[])}))),q=o(((e,n={},t=1)=>{var i;const a=T[e];if(E||M>1&&t<2)return 0;p(n,{reverse:null==a?void 0:a.reverse});let o=0,s=n.delay||0,u=a?V.current.time(a):0;for(const r of j.current)(null===(i=r.current)||void 0===i?void 0:i.inherit)&&(o=Math.max(r.current.play(e,p({delay:s+u},n),t+1),o));const l=(n.reverse?o:s)*(M/t);return a&&V.current.add(a,p({delay:l},n)),r.onAnimationEnd&&setTimeout(r.onAnimationEnd.bind({},e),1e3*(u+l)),u+l}),[E,M]);function B(n,r={}){let t=0;for(let i of L){const{name:a,on:o}=i,s=e(i,["name","on"]);o===n&&(t=Math.max(q(a||"animate",p(s,r)),t))}return t}return s(v(b,r.ref),(()=>({play:q,trigger:B,timeline:V.current,children:j.current,inherit:k,adaptive:z,manual:A,id:O})),[L]),u((()=>V.current.pause(!(!C&&!E))),[C,E]),u((()=>{for(let n=0;n<L.length;n++){let r=L[n],{name:t,on:i}=r,a=e(r,["name","on"]);if("string"==typeof i)continue;const o="boolean"==typeof i?i:i.called,s=D.current[n];void 0!==s&&o&&o!==s&&q(t||"animate",a),D.current[n]=o}}),[L]),g((()=>{const e=()=>V.current.cache();return V.current.link(w.animate),window.addEventListener("resize",e),null==x||x.add(b),document.fonts.ready.then((()=>{A||V.current.mounted||B("mount"),V.current.mounted=!0})),()=>{window.removeEventListener("resize",e),V.current.unlink(),null==x||x.remove(b)}}),[]),n(y,{value:Object.assign(Object.assign({},r.passthrough?x:Object.assign({index:M},w)),{add:e=>{r.passthrough&&(null==x||x.add(e)),j.current.includes(e)||j.current.push(e)},remove:e=>{r.passthrough&&(null==x||x.remove(e));const n=j.current.indexOf(e)||-1;n>=0&&j.current.splice(n,1)}}),children:l.map(r.children,(e=>c(e)?d(e,{ref:v((e=>V.current.insert(e)),e.ref),pathLength:1,style:p({backfaceVisibility:"hidden",willChange:"transform"},e.props.style,T.animate.initial,{strokeDasharray:1}),"data-lively-offset-boundary":!(!["x","y"].some((e=>{var n;return null===(n=r.cachable)||void 0===n?void 0:n.includes(e)}))&&void 0!==r.cachable)||void 0}):e))})}b.isLively=!0;export{y as AnimatableContext,b as default};
+import{__rest as e}from"tslib";import{jsx as n}from"react/jsx-runtime";import{createContext as r,useRef as t,use as i,useMemo as a,useCallback as o,useImperativeHandle as s,useEffect as u,Children as l,isValidElement as c,cloneElement as d}from"react";import m from"./core/clip.js";import f from"./core/timeline.js";import{merge as p,pick as h,combineRefs as v}from"./core/utils.js";import g from"./hooks/use-mount-effect.js";const y=r(null);function b(r){const b=t(null),j=t([]),x=i(y),w=r.inherit&&x?p({},r,h(x,["group","animations","triggers","animate","initial","stagger","staggerLimit","deform","disabled","paused"])):r,{id:O="",inherit:k,triggers:L=[],disabled:E,adaptive:z=!1,manual:A=!1,paused:C}=w,M=void 0!==r.order?r.order:(k&&(null==x?void 0:x.index)||0)+1,D=t([]),T=a((()=>{const e={animate:m.from(w.animate,w.initial)};for(const n in w.animations)e[n]=m.from(w.animations[n],w.initial);return e}),[]),V=t(new f(Object.assign(Object.assign({},w),{mountClips:L.reduce(((e,{name:n,on:r})=>("mount"===r&&e.push(T[n||"animate"]),e)),[])}))),q=o(((e,n={},t=1)=>{var i;const a=T[e];if(E||M>1&&t<2)return 0;p(n,{reverse:null==a?void 0:a.reverse});let o=0,s=n.delay||0,u=a?V.current.time(a):0;for(const r of j.current)(null===(i=r.current)||void 0===i?void 0:i.inherit)&&(o=Math.max(r.current.play(e,p({delay:s+u},n),t+1),o));const l=(n.reverse?o:s)*(M/t);return a&&V.current.add(a,p({delay:l},n)),r.onAnimationEnd&&setTimeout(r.onAnimationEnd.bind({},e),1e3*(u+l)),u+l}),[E,M]);function B(n,r={}){let t=0;for(let i of L){const{name:a,on:o}=i,s=e(i,["name","on"]);o===n&&(t=Math.max(q(a||"animate",p(s,r)),t))}return t}return s(v(b,r.ref),(()=>({play:q,trigger:B,timeline:V.current,children:j.current,inherit:k,adaptive:z,manual:A,id:O})),[L]),u((()=>V.current.pause(!(!C&&!E))),[C,E]),u((()=>{for(let n=0;n<L.length;n++){let r=L[n],{name:t,on:i}=r,a=e(r,["name","on"]);if("string"==typeof i)continue;const o="boolean"==typeof i?i:i.called,s=D.current[n];void 0!==s&&o&&o!==s&&q(t||"animate",a),D.current[n]=o}}),[L]),g((()=>{const e=()=>V.current.cache();return V.current.link(w.animate),window.addEventListener("resize",e),null==x||x.add(b),document.fonts.ready.then((()=>{A||V.current.mounted||B("mount"),V.current.mounted=!0})),()=>{window.removeEventListener("resize",e),V.current.unlink(),null==x||x.remove(b)}}),[]),n(y,{value:Object.assign(Object.assign({},r.passthrough?x:Object.assign({index:M},w)),{add:e=>{r.passthrough&&(null==x||x.add(e)),j.current.includes(e)||j.current.push(e)},remove:e=>{r.passthrough&&(null==x||x.remove(e));const n=j.current.indexOf(e)||-1;n>=0&&j.current.splice(n,1)}}),children:l.map(r.children,(e=>c(e)?d(e,{ref:v((e=>V.current.insert(e)),e.props.ref),pathLength:1,style:p({backfaceVisibility:"hidden",willChange:"transform"},e.props.style,T.animate.initial,{strokeDasharray:1}),"data-lively-offset-boundary":!(!["x","y"].some((e=>{var n;return null===(n=r.cachable)||void 0===n?void 0:n.includes(e)}))&&void 0!==r.cachable)||void 0}):e))})}b.isLively=!0;export{y as AnimatableContext,b as default};
 //# sourceMappingURL=animatable.js.map

package/dist/animate.js

@@ -1,3 +1,3 @@
 "use client";
-import{__rest as i}from"tslib";import{jsx as r,Fragment as t}from"react/jsx-runtime";import{Children as n,isValidElement as e,cloneElement as o}from"react";import m from"./animatable.js";import a from"./animations/move.js";import s from"./animations/pop.js";function l(l){var{children:p,animations:c=[a,s],levels:f=2}=l,h=i(l,["children","animations","levels"]);return r(t,{children:function i(t,a=f){let s,l=f-a;for(;!(s=c[l])&&l>=0;)l--;return a<1||n.count(t)<1?t:r(m,Object.assign({},h,{animate:s,inherit:a<f||h.inherit,children:n.map(t,(r=>e(r)?o(r,{},i(r.props.children,a-1)):r))}))}(p)})}l.isLively=!0;export{l as default};
+import{__rest as i}from"tslib";import{jsx as r,Fragment as t}from"react/jsx-runtime";import{Children as e,isValidElement as n,cloneElement as a}from"react";import o from"./animatable.js";function l(l){var{children:m,animations:p=[{translate:["0px 16px","0px 0px"],opacity:[0,1],duration:.35}],levels:s=2}=l,c=i(l,["children","animations","levels"]);return r(t,{children:function i(t,l=s){let m,f=s-l;for(;!(m=p[f])&&f>=0;)f--;return l<1||e.count(t)<1?t:r(o,Object.assign({},c,{animate:m,inherit:l<s||c.inherit,children:e.map(t,(r=>n(r)?a(r,{},i(r.props.children,l-1)):r))}))}(m)})}l.isLively=!0;export{l as default};
 //# sourceMappingURL=animate.js.map

package/dist/hooks/use-path.js

@@ -1,2 +1,2 @@
-import{useRef as t,useCallback as r}from"react";function n(){const n=t(null);return[r((t=>(r,e)=>{if(!n.current)return t([0,0],e);const u=n.current.getTotalLength()*r,{x:o,y:c}=n.current.getPointAtLength(u);return t([o,c],e)}),[n]),n]}export{n as default};
+import{useRef as t,useCallback as r}from"react";function n(){const n=t(null),e=r((t=>(r,e)=>{if(!n.current)return t([0,0],e);const u=n.current.getTotalLength()*r,{x:o,y:c}=n.current.getPointAtLength(u);return t([o,c],e)}),[n]);return[n,e]}export{n as default};
 //# sourceMappingURL=use-path.js.map

package/dist/hooks/use-path.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-path.js","sources":["../../src/hooks/use-path.ts"],"sourcesContent":[null],"names":["usePath","ref","useRef","useCallback","transform","progress","index","current","len","getTotalLength","x","y","getPointAtLength"],"mappings":"gDAEc,SAAUA,IACpB,MAAMC,EAAMC,EAAU,MAatB,MAAO,CAXMC,GAAaC,GACf,CAACC,EAAkBC,KACtB,IAAKL,EAAIM,QAAS,OAAOH,EAAU,CAAC,EAAG,GAAIE,GAE3C,MAAME,EAAMP,EAAIM,QAAQE,iBAAmBJ,GACrCK,EAAEA,EAACC,EAAEA,GAAMV,EAAIM,QAAQK,iBAAiBJ,GAE9C,OAAOJ,EAAU,CAACM,EAAGC,GAAIL,EAAM,GAEpC,CAACL,IAEUA,EAClB"}
+{"version":3,"file":"use-path.js","sources":["../../src/hooks/use-path.ts"],"sourcesContent":[null],"names":["usePath","ref","useRef","link","useCallback","transform","progress","index","current","len","getTotalLength","x","y","getPointAtLength"],"mappings":"gDAEc,SAAUA,IACpB,MAAMC,EAAMC,EAAU,MAEhBC,EAAOC,GAAaC,GACf,CAACC,EAAkBC,KACtB,IAAKN,EAAIO,QAAS,OAAOH,EAAU,CAAC,EAAG,GAAIE,GAE3C,MAAME,EAAMR,EAAIO,QAAQE,iBAAmBJ,GACrCK,EAAEA,EAACC,EAAEA,GAAMX,EAAIO,QAAQK,iBAAiBJ,GAE9C,OAAOJ,EAAU,CAACM,EAAGC,GAAIL,EAAM,GAEpC,CAACN,IAEJ,MAAO,CAACA,EAAKE,EACjB"}

package/dist/hooks/use-viewport.js

@@ -1,3 +1,3 @@
 "use client";
-import{useRef as e}from"react";import n from"./use-link.js";import t from"./use-mount-effect.js";function r(r=.5){const i=e(null),o=n([-1,-1]);return t((()=>{function e(){if(!i.current)return;const{x:e,y:n,width:t,height:s}=i.current.getBoundingClientRect();o.set([(e+t*r)/(window.innerWidth+2*t*(r-.5)),(n+s*r)/(window.innerHeight+2*s*(r-.5))])}return e(),window.addEventListener("scroll",e),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e),window.removeEventListener("resize",e)}}),[r]),[o,i]}export{r as default};
+import{useRef as e}from"react";import n from"./use-link.js";import t from"./use-mount-effect.js";function r(r=.5){const i=e(null),o=n([-1,-1]);return t((()=>{function e(){if(!i.current)return;const{x:e,y:n,width:t,height:s}=i.current.getBoundingClientRect();o.set([(e+t*r)/(window.innerWidth+2*t*(r-.5)),(n+s*r)/(window.innerHeight+2*s*(r-.5))])}return e(),window.addEventListener("scroll",e),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e),window.removeEventListener("resize",e)}}),[r]),[i,o]}export{r as default};
 //# sourceMappingURL=use-viewport.js.map

package/dist/hooks/use-visible.js

@@ -1,3 +1,3 @@
 "use client";
-import{useRef as e,useEffect as r}from"react";import t from"./use-trigger.js";import s from"./use-viewport.js";function i({enter:i=1,exit:n=!1,threshold:u=.5}={}){const[o,c]=s(u),b=e({visible:!1,enters:!0===i?1/0:+i,exits:!0===n?1/0:+n}),f=t();return r((()=>{function e(){const[e,r]=o(),t=e>0&&e<1&&r>0&&r<1,{visible:s,enters:i,exits:n}=b.current;!s&&t&&i&&(b.current.enters--,f()),s&&!t&&n&&(b.current.exits--,f()),b.current.visible=t}return e(),o.subscribe(e),()=>o.unsubscribe(e)}),[]),[f,c]}export{i as default};
+import{useRef as r,useEffect as e}from"react";import t from"./use-trigger.js";import n from"./use-viewport.js";function o({enter:o=1,exit:u=!1,threshold:c=.5}={}){const[s,i]=n(c),f=r(!1),l=t(),m=t();return e((()=>{function r(){const[r,e]=i(),t=r>0&&r<1&&e>0&&e<1;!f.current&&t&&l.called<(!0===o?1/0:+o)&&l(),f.current&&!t&&m.called<(!0===u?1/0:+u)&&m(),f.current=t}return r(),i.subscribe(r),()=>i.unsubscribe(r)}),[]),[s,l,m]}export{o as default};
 //# sourceMappingURL=use-visible.js.map

package/dist/types/hooks/use-path.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export default function usePath<T extends SVGGeometryElement = any>(): [(transform: (value: [number, number], index: number) => any) => (progress: number, index: number) => any, React.Ref<T>];
+export default function usePath<T extends SVGGeometryElement = any>(): [React.Ref<T>, (transform: (value: [number, number], index: number) => any) => (progress: number, index: number) => any];

package/dist/types/hooks/use-viewport.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { Link } from "../core/link";
-export default function useViewport<T extends Element = any>(threshold?: number): [Link<[number, number]>, React.Ref<T>];
+export default function useViewport<T extends Element = any>(threshold?: number): [React.Ref<T>, Link<[number, number]>];

package/dist/types/hooks/use-visible.d.ts

@@ -4,4 +4,4 @@ export default function useVisible<T extends Element = any>({ enter, exit, thres
     enter?: boolean | number;
     exit?: boolean | number;
     threshold?: number;
-}): [Trigger, React.Ref<T>];
+}): [React.Ref<T>, Trigger, Trigger];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@infinityfx/lively",
-	"version": "4.0.0-beta.2",
+	"version": "4.0.0-beta.4",
 	"type": "module",
 	"description": "Feature complete, lightweight react animation library.",
 	"main": "dist/index.js",
@@ -8,15 +8,11 @@
 	"types": "dist/types/index.d.ts",
 	"exports": {
 		".": "./dist/index.js",
-		"./animations": "./dist/animations.js",
 		"./hooks": "./dist/hooks.js",
 		"./layout": "./dist/layout.js"
 	},
 	"typesVersions": {
 		"*": {
-			"animations": [
-				"./dist/types/animations.d.ts"
-			],
 			"hooks": [
 				"./dist/types/hooks.d.ts"
 			],

package/dist/animations/fade.js

@@ -1,2 +0,0 @@
-import o from"../core/clip.js";const t=new o({opacity:1,duration:.65},{opacity:0});export{t as default};
-//# sourceMappingURL=fade.js.map

package/dist/animations/fade.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"fade.js","sources":["../../src/animations/fade.ts"],"sourcesContent":[null],"names":["Fade","Clip","opacity","duration"],"mappings":"+BAEA,MAAMA,EAAO,IAAIC,EAAK,CAClBC,QAAS,EACTC,SAAU,KACX,CACCD,QAAS"}

package/dist/animations/move.js

@@ -1,2 +0,0 @@
-import t from"../core/clip.js";const a=new t({opacity:1,translate:"0px 0px",duration:.5},{opacity:0,translate:"0px 20px"});export{a as default};
-//# sourceMappingURL=move.js.map

package/dist/animations/move.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"move.js","sources":["../../src/animations/move.ts"],"sourcesContent":[null],"names":["Move","Clip","opacity","translate","duration"],"mappings":"+BAEA,MAAMA,EAAO,IAAIC,EAAK,CAClBC,QAAS,EACTC,UAAW,UACXC,SAAU,IACX,CACCF,QAAS,EACTC,UAAW"}

package/dist/animations/pop.js

@@ -1,2 +0,0 @@
-import o from"../core/clip.js";const a=new o({opacity:1,scale:1,duration:.25},{opacity:0,scale:.85});export{a as default};
-//# sourceMappingURL=pop.js.map

package/dist/animations/pop.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pop.js","sources":["../../src/animations/pop.ts"],"sourcesContent":[null],"names":["Pop","Clip","opacity","scale","duration"],"mappings":"+BAEA,MAAMA,EAAM,IAAIC,EAAK,CACjBC,QAAS,EACTC,MAAO,EACPC,SAAU,KACX,CACCF,QAAS,EACTC,MAAO"}

package/dist/animations/scale.js

@@ -1,2 +0,0 @@
-import e from"../core/clip.js";const r=new e({scale:1},{transformOrigin:"left",scale:"0 1"});export{r as default};
-//# sourceMappingURL=scale.js.map

package/dist/animations/scale.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"scale.js","sources":["../../src/animations/scale.ts"],"sourcesContent":[null],"names":["Scale","Clip","scale","transformOrigin"],"mappings":"+BAEA,MAAMA,EAAQ,IAAIC,EAAK,CACnBC,MAAO,GACR,CACCC,gBAAiB,OACjBD,MAAO"}

package/dist/animations/wipe.js

@@ -1,2 +0,0 @@
-import t from"../core/clip.js";const e=new t({clipPath:"inset(0% 0% 0% 0%)"},{clipPath:"inset(0% 100% 0% 0%)"});export{e as default};
-//# sourceMappingURL=wipe.js.map

package/dist/animations/wipe.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"wipe.js","sources":["../../src/animations/wipe.ts"],"sourcesContent":[null],"names":["Wipe","Clip","clipPath"],"mappings":"+BAEA,MAAMA,EAAO,IAAIC,EAAK,CAClBC,SAAU,sBACX,CACCA,SAAU"}

package/dist/animations.js

@@ -1,2 +0,0 @@
-export{default as Fade}from"./animations/fade.js";export{default as Move}from"./animations/move.js";export{default as Pop}from"./animations/pop.js";export{default as Scale}from"./animations/scale.js";export{default as Wipe}from"./animations/wipe.js";export{default as Clip}from"./core/clip.js";
-//# sourceMappingURL=animations.js.map

package/dist/animations.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"animations.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/types/animations/fade.d.ts

@@ -1,3 +0,0 @@
-import Clip from "../core/clip";
-declare const Fade: Clip;
-export default Fade;

package/dist/types/animations/move.d.ts

@@ -1,3 +0,0 @@
-import Clip from "../core/clip";
-declare const Move: Clip;
-export default Move;

package/dist/types/animations/pop.d.ts

@@ -1,3 +0,0 @@
-import Clip from "../core/clip";
-declare const Pop: Clip;
-export default Pop;

package/dist/types/animations/scale.d.ts

@@ -1,3 +0,0 @@
-import Clip from "../core/clip";
-declare const Scale: Clip;
-export default Scale;

package/dist/types/animations/wipe.d.ts

@@ -1,3 +0,0 @@
-import Clip from "../core/clip";
-declare const Wipe: Clip;
-export default Wipe;

package/dist/types/animations.d.ts

@@ -1,7 +0,0 @@
-import Fade from "./animations/fade";
-import Move from "./animations/move";
-import Pop from "./animations/pop";
-import Scale from "./animations/scale";
-import Wipe from "./animations/wipe";
-import Clip from "./core/clip";
-export { Fade, Move, Pop, Scale, Wipe, Clip };