@infinityfx/lively 4.0.0-beta.0 → 4.0.0-beta.1

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 c,isValidElement as l,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:E=[],disabled:L,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([]),F=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}),[]),T=t(new f(Object.assign(Object.assign({},w),{mountClips:E.reduce(((e,{name:n,on:r})=>("mount"===r&&e.push(F[n||"animate"]),e)),[])}))),V=o(((e,n={},t=1)=>{var i;const a=F[e];if(L||M>1&&t<2)return 0;p(n,{reverse:null==a?void 0:a.reverse});let o=0,s=n.delay||0,u=a?T.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 c=(n.reverse?o:s)*(M/t);return a&&T.current.add(a,p({delay:c},n)),r.onAnimationEnd&&setTimeout(r.onAnimationEnd.bind({},e),1e3*(u+c)),u+c}),[L,M]);function q(n,r={}){let t=0;for(let i of E){const{name:a,on:o}=i,s=e(i,["name","on"]);o===n&&(t=Math.max(V(a||"animate",p(s,r)),t))}return t}return s(v(b,r.ref),(()=>({play:V,trigger:q,timeline:T.current,children:j.current,inherit:k,adaptive:z,manual:A,id:O})),[E]),u((()=>T.current.pause(!(!C&&!L))),[C,L]),u((()=>{for(let n=0;n<E.length;n++){let r=E[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&&V(t||"animate",a),D.current[n]=o}}),[E]),g((()=>(T.current.link(w.animate),window.addEventListener("resize",T.current.cache),null==x||x.add(b),document.fonts.ready.then((()=>{A||T.current.mounted||q("mount"),T.current.mounted=!0})),()=>{window.removeEventListener("resize",T.current.cache),T.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:c.map(r.children,(e=>!l(e)||e.type instanceof Function?e:d(e,{ref:v((e=>T.current.insert(e)),e.ref),pathLength:1,style:p({backfaceVisibility:"hidden",willChange:"transform"},e.props.style,F.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})))})}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([]),F=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}),[]),T=t(new f(Object.assign(Object.assign({},w),{mountClips:L.reduce(((e,{name:n,on:r})=>("mount"===r&&e.push(F[n||"animate"]),e)),[])}))),V=o(((e,n={},t=1)=>{var i;const a=F[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?T.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&&T.current.add(a,p({delay:l},n)),r.onAnimationEnd&&setTimeout(r.onAnimationEnd.bind({},e),1e3*(u+l)),u+l}),[E,M]);function q(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(V(a||"animate",p(s,r)),t))}return t}return s(v(b,r.ref),(()=>({play:V,trigger:q,timeline:T.current,children:j.current,inherit:k,adaptive:z,manual:A,id:O})),[L]),u((()=>T.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&&V(t||"animate",a),D.current[n]=o}}),[L]),g((()=>(T.current.link(w.animate),window.addEventListener("resize",T.current.cache),null==x||x.add(b),document.fonts.ready.then((()=>{A||T.current.mounted||q("mount"),T.current.mounted=!0})),()=>{window.removeEventListener("resize",T.current.cache),T.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)||e.type instanceof Function?e:d(e,{ref:v((e=>T.current.insert(e)),e.ref),pathLength:1,style:p({backfaceVisibility:"hidden",willChange:"transform"},e.props.style,F.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})))})}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 o,cloneElement as e}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=>o(r)?e(r,{},i(r.props.children,a-1)):r))}))}(p)})}export{l as default};
+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};
 //# sourceMappingURL=animate.js.map

package/dist/layout/layout-group.js

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as r}from"react/jsx-runtime";import{useRef as t,useState as n,useEffect as e,Children as i,isValidElement as o}from"react";import u from"../animatable.js";import c from"../hooks/use-mount-effect.js";function f(r,t={}){return i.forEach(r,(r=>{var n;if(!o(r))return;const e=null===(n=r.type)||void 0===n?void 0:n.name;"Animatable"!==e&&"Animate"!==e||!("id"in r.props)||(t[r.props.id]=!0),f(r.props.children,t)})),t}function l(r,t){const n=typeof r,e=typeof t;if(n!==e)return!1;if(o(r))return!(!o(t)||r.key!==t.key)&&l(r.props,t.props);if(Array.isArray(r)){if(!Array.isArray(t)||r.length!==t.length)return!1;for(let n=0;n<r.length;n++)if(!l(r[n],t[n]))return!1;return!0}if("object"===n&&null!==r&&null!==t){const n=Object.keys(r),e=Object.keys(t);if(n.length!==e.length)return!1;if(!n.length)return r.toString()===t.toString();for(let i=0;i<n.length;i++)if(!(n[i]in t)||!l(r[n[i]],t[e[i]]))return!1;return!0}return"function"===n&&n===e||r===t}function a(r,t){try{return l(r,t)}catch(r){return!1}}function s({children:i,transition:o}){const l=t(null),s=t(f(i)),[m,p]=n(i);return e((()=>{if(!l.current||a(m,i))return;let r=0,t=f(i);for(const n of l.current.children)n.current&&!n.current.manual&&n.current.id in s.current&&!(n.current.id in t)&&(r=Math.max(n.current.trigger("unmount"),r));s.current=t,setTimeout((()=>p(i)),1e3*r)}),[i]),c((()=>{var r;if(l.current)for(const t of l.current.children)(null===(r=t.current)||void 0===r?void 0:r.timeline.mounted)&&t.current.adaptive&&t.current.timeline.transition(void 0,o)}),[m]),r(u,{ref:l,cachable:[],passthrough:!0,children:m})}export{s as default};
+import{jsx as r}from"react/jsx-runtime";import{useRef as t,useState as n,useEffect as e,Children as i,isValidElement as o}from"react";import u from"../animatable.js";import c from"../hooks/use-mount-effect.js";function f(r,t={}){return i.forEach(r,(r=>{var n;o(r)&&((null===(n=r.type)||void 0===n?void 0:n.isLively)&&"id"in r.props&&(t[r.props.id]=!0),f(r.props.children,t))})),t}function l(r,t){const n=typeof r,e=typeof t;if(n!==e)return!1;if(o(r))return!(!o(t)||r.key!==t.key)&&l(r.props,t.props);if(Array.isArray(r)){if(!Array.isArray(t)||r.length!==t.length)return!1;for(let n=0;n<r.length;n++)if(!l(r[n],t[n]))return!1;return!0}if("object"===n&&null!==r&&null!==t){const n=Object.keys(r),e=Object.keys(t);if(n.length!==e.length)return!1;if(!n.length)return r.toString()===t.toString();for(let i=0;i<n.length;i++)if(!(n[i]in t)||!l(r[n[i]],t[e[i]]))return!1;return!0}return"function"===n&&n===e||r===t}function a(r,t){try{return l(r,t)}catch(r){return!1}}function s({children:i,transition:o}){const l=t(null),s=t(f(i)),[p,h]=n(i);return e((()=>{if(!l.current||a(p,i))return;let r=0,t=f(i);for(const n of l.current.children)n.current&&!n.current.manual&&n.current.id in s.current&&!(n.current.id in t)&&(r=Math.max(n.current.trigger("unmount"),r));s.current=t,setTimeout((()=>h(i)),1e3*r)}),[i]),c((()=>{var r;if(l.current)for(const t of l.current.children)(null===(r=t.current)||void 0===r?void 0:r.timeline.mounted)&&t.current.adaptive&&t.current.timeline.transition(void 0,o)}),[p]),r(u,{ref:l,cachable:[],passthrough:!0,children:p})}export{s as default};
 //# sourceMappingURL=layout-group.js.map

package/dist/layout/morph.js

@@ -1,3 +1,3 @@
 "use client";
-import{__rest as t}from"tslib";import{jsx as r}from"react/jsx-runtime";import{use as e,useRef as i,useState as n,useEffect as o}from"react";import u,{AnimatableContext as s}from"../animatable.js";import{combineRefs as m}from"../core/utils.js";import l from"../hooks/use-mount-effect.js";const c={};function a(a){var{children:f,transition:d={},show:g=!0,group:p}=a,v=t(a,["children","transition","show","group"]);const b=e(s),h=i(null),[j,w]=n(g),[x,T]=n(g);return p=(null==b?void 0:b.group)?`${b.group}__${p}`:p,l((()=>{if(!h.current)return;const t=h.current.timeline;let r;c[p].targets.forEach((e=>{e.mounted&&e!==t&&(r=e)})),g&&!t.mounted&&(c[p].visible=!0,r?t.transition(r,d):h.current.trigger("mount")),T(g)}),[g]),o((()=>{var t;if(!h.current)return;const r=h.current.timeline;if(!g&&r.mounted){if(!c[p].visible){const r=null===(t=h.current)||void 0===t?void 0:t.trigger("unmount");setTimeout((()=>w(!1)),1e3*r)}c[p].targets.delete(r)}(g||c[p].visible)&&w(g),setTimeout((()=>c[p].visible=!1)),r.mounted=g}),[x]),g||j!==g?r(u,Object.assign({},v,{manual:!0,group:p,ref:m((t=>{p in c||(c[p]={targets:new Set,visible:!1}),t&&(c[p].targets.add(t.timeline),h.current=t)}),v.ref),children:f})):null}export{a as default};
+import{__rest as t}from"tslib";import{jsx as r}from"react/jsx-runtime";import{use as e,useRef as i,useState as n,useEffect as o}from"react";import u,{AnimatableContext as s}from"../animatable.js";import{combineRefs as l}from"../core/utils.js";import m from"../hooks/use-mount-effect.js";const c={};function a(a){var{children:f,transition:d={},show:g=!0,group:p}=a,v=t(a,["children","transition","show","group"]);const b=e(s),h=i(null),[j,w]=n(g),[x,T]=n(g);return p=(null==b?void 0:b.group)?`${b.group}__${p}`:p,m((()=>{if(!h.current)return;const t=h.current.timeline;let r;c[p].targets.forEach((e=>{e.mounted&&e!==t&&(r=e)})),g&&!t.mounted&&(c[p].visible=!0,r?t.transition(r,d):h.current.trigger("mount")),T(g)}),[g]),o((()=>{var t;if(!h.current)return;const r=h.current.timeline;if(!g&&r.mounted){if(!c[p].visible){const r=null===(t=h.current)||void 0===t?void 0:t.trigger("unmount");setTimeout((()=>w(!1)),1e3*r)}c[p].targets.delete(r)}(g||c[p].visible)&&w(g),setTimeout((()=>c[p].visible=!1)),r.mounted=g}),[x]),g||j!==g?r(u,Object.assign({},v,{manual:!0,group:p,ref:l((t=>{p in c||(c[p]={targets:new Set,visible:!1}),t&&(c[p].targets.add(t.timeline),h.current=t)}),v.ref),children:f})):null}a.isLively=!0;export{a as default};
 //# sourceMappingURL=morph.js.map

package/dist/layout/typable.js

@@ -1,3 +1,3 @@
 "use client";
-import{__rest as r}from"tslib";import{jsx as t}from"react/jsx-runtime";import{Children as e}from"react";import i from"../animatable.js";function a(a){var{children:m,stagger:s=1,staggerLimit:g=Number.MAX_VALUE}=a,n=r(a,["children","stagger","staggerLimit"]);return t(i,Object.assign({},n,{stagger:-1*s,staggerLimit:g,children:e.map(m,(r=>"string"!=typeof r&&"number"!=typeof r?r:r.toString().split("").map((r=>t("span",{style:{whiteSpace:" "===r?"pre-wrap":void 0},children:r})))))}))}export{a as default};
+import{__rest as r}from"tslib";import{jsx as t}from"react/jsx-runtime";import{Children as e}from"react";import i from"../animatable.js";function a(a){var{children:m,stagger:s=1,staggerLimit:g=Number.MAX_VALUE}=a,n=r(a,["children","stagger","staggerLimit"]);return t(i,Object.assign({},n,{stagger:-1*s,staggerLimit:g,children:e.map(m,(r=>"string"!=typeof r&&"number"!=typeof r?r:r.toString().split("").map((r=>t("span",{style:{whiteSpace:" "===r?"pre-wrap":void 0},children:r})))))}))}a.isLively=!0;export{a as default};
 //# sourceMappingURL=typable.js.map

package/dist/types/animatable.d.ts

@@ -49,5 +49,8 @@ type AnimatableContext = {
     remove: (child: React.RefObject<AnimatableType | null>) => void;
 } & SharedProps;
 export declare const AnimatableContext: import("react").Context<AnimatableContext | null>;
-export default function Animatable<T extends string>(props: AnimatableProps<T>): import("react/jsx-runtime").JSX.Element;
-export {};
+declare function Animatable<T extends string>(props: AnimatableProps<T>): import("react/jsx-runtime").JSX.Element;
+declare namespace Animatable {
+    var isLively: boolean;
+}
+export default Animatable;

package/dist/types/animate.d.ts

@@ -4,5 +4,8 @@ type AnimateProps = {
     animations?: (ClipProperties | Clip)[];
     levels?: number;
 } & Omit<AnimatableProps, 'animations' | 'animate' | 'order'>;
-export default function Animate({ children, animations, levels, ...props }: AnimateProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare function Animate({ children, animations, levels, ...props }: AnimateProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Animate {
+    var isLively: boolean;
+}
+export default Animate;

package/dist/types/layout/morph.d.ts

@@ -5,6 +5,9 @@ type MorphProps = {
     transition?: Omit<TransitionOptions, 'reverse'>;
     show?: boolean;
 } & AnimatableProps;
-export default function Morph({ children, transition, // should be able to be inherited
+declare function Morph({ children, transition, // should be able to be inherited
 show, group, ...props }: MorphProps): import("react/jsx-runtime").JSX.Element | null;
-export {};
+declare namespace Morph {
+    var isLively: boolean;
+}
+export default Morph;

package/dist/types/layout/typable.d.ts

@@ -1,2 +1,6 @@
 import { AnimatableProps } from "../animatable";
-export default function Typable({ children, stagger, staggerLimit, ...props }: AnimatableProps): import("react/jsx-runtime").JSX.Element;
+declare function Typable({ children, stagger, staggerLimit, ...props }: AnimatableProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Typable {
+    var isLively: boolean;
+}
+export default Typable;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@infinityfx/lively",
-	"version": "4.0.0-beta.0",
+	"version": "4.0.0-beta.1",
 	"type": "module",
 	"description": "Feature complete, lightweight react animation library.",
 	"main": "dist/index.js",