UNPKG

@infinityfx/lively

Version:

Feature complete, lightweight react animation library.

4 lines (3 loc) 3.17 kB
"use client"; import{jsx as e}from"react/jsx-runtime";import{useRef as r,useState as n,useLayoutEffect as t,Children as i,isValidElement as c,cloneElement as o}from"react";import u from"../animatable.js";import{Groups as s}from"./morph.js";function d(e,r,n=[]){const t="nodes"in e?e.nodes:e;for(let e=0;e<t.length;e++){const i=[...n,e];let c=r(t[e],i);if(c||(c=d(t[e].nodes,r,i)),c)return c}}function l(e,r){return d(e,((e,n)=>{if(e.key===r)return n}))||null}function a(e,r){let n=e[r[0]];for(let e=1;e<r.length&&n;e++)n=n.nodes[r[e]];return n}function p(e,r,n,t){const i=r[r.length-1],c=r.length>1?a(e,r.slice(0,-1))?.nodes:e;c&&(t?c.splice(i,n,t):c.splice(i,n))}function m({tree:e,nodes:r,mounting:n,partialIndex:t=[],keys:u=new Set,parent:s=["",0]}){return i.forEach(r,((r,i)=>{if([void 0,null,!1].includes(r))return;const d=c(r),p=d&&(Array.isArray(r.props.children)||c(r.props.children)),f=d&&r.type.isLively&&"id"in r.props,h=p&&(!r.type.isLively||r.props.traverseLayout),y=[...t,i],g=p&&!r.type.isLively?o(r,void 0,[]):r,[k,v]=s,x=f?r.props.id:`$l.${k?k+".":""}${y.slice(-v).join("")}`,j=l(e,x),w=j?a(e,j):void 0;w&&(f||w.key.startsWith("$l."))?(j&&j.join("")!==y.join("")&&n.set(x,{replace:!0,node:w,index:y}),w.node=g):n.set(x,{node:{key:x,node:g,nodes:[]},index:y}),h&&m({tree:e,nodes:r.props.children,mounting:n,partialIndex:y,keys:u,parent:f?[x,1]:v?[k,v+1]:void 0}),u.add(x)})),u}function f(e){const r=e.map((e=>c(e.node)?e.nodes.length?o(e.node,{key:e.key},f(e.nodes)):o(e.node,{key:e.key}):e.node));return r.length>1?r:r[0]}function h({children:i,transition:c,initialMount:o=!0}){const a=r(!o),h=r(null),[y,g]=n({}),k=r([]),v=r(new Map),x=r(void 0),j=r(0),w=r(new Set),E=m({tree:k.current,nodes:i,mounting:v.current});if(v.current.forEach(((e,r)=>{E.has(r)||v.current.delete(r)})),d(k.current,(e=>{E.has(e.key)||w.current.add(e.key)})),w.current.size&&h.current){for(const e of h.current.children){const r=e.current?.id,n=w.current.has(r);if(e.current&&n)if(E.has(r))w.current.delete(r),e.current.trigger("mount",{immediate:!0}),e.current.timeline.mounted=!0;else if(e.current.timeline.mounted){const r=Date.now()+1e3*e.current.trigger("unmount",{immediate:!0});if(j.current=Math.max(j.current,r),e.current.group){const r=s[e.current.group].get(e.current.timeline);r&&(r.state="unmounted")}e.current.timeline.mounted=!1}}const e=j.current-Date.now();clearTimeout(x.current);const r=(e=!0)=>{w.current.forEach((e=>{const r=l(k.current,e);r&&p(k.current,r,1)})),w.current.clear(),e&&g({})};e>0?x.current=setTimeout(r,e):r(!1)}return!w.current.size&&v.current.size&&(v.current.forEach((({node:e,index:r,replace:n},t)=>{if(n){const e=l(k.current,t);e&&p(k.current,e,1)}p(k.current,r,0,e)})),v.current.clear()),t((()=>{if(!h.current)return;let e,r=h.current.children.slice();for(;e=r.pop();)a.current&&e.current&&(e.current.timeline.mounted=!0),e.current?.id&&e.current.timeline.mounted&&e.current.adaptive&&null!==l(k.current,e.current.id)&&(e.current.timeline.transition(void 0,c),r.push(...e.current.children));a.current=!1})),e(u,{ref:h,passthrough:!0,cachable:[],children:f(k.current)})}export{h as default}; //# sourceMappingURL=layout-group.js.map