bippy 0.0.12 → 0.0.13

package/dist/index.d.mts

@@ -73,15 +73,15 @@ declare const getRDTHook: () => {
     onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
     inject: (renderer: unknown) => number;
 };
-type RenderHandler = (fiber: Fiber, phase: 'mount' | 'update' | 'unmount') => void;
+type RenderHandler = <S>(fiber: Fiber, phase: 'mount' | 'update' | 'unmount', state?: S) => void;
 declare const mountFiberRecursively: (onRender: RenderHandler, firstChild: Fiber, traverseSiblings: boolean) => void;
 declare const updateFiberRecursively: (onRender: RenderHandler, nextFiber: Fiber, prevFiber: Fiber, parentFiber: Fiber | null) => void;
 declare const unmountFiber: (onRender: RenderHandler, fiber: Fiber) => void;
 declare const unmountFiberChildrenRecursively: (onRender: RenderHandler, fiber: Fiber) => void;
-declare const createFiberVisitor: ({ onRender, onError, }: {
+declare const createFiberVisitor: ({ onRender: onRenderWithoutState, onError, }: {
     onRender: RenderHandler;
     onError?: (error: unknown) => void;
-}) => (_rendererID: number, root: FiberRoot) => void;
+}) => <S>(_rendererID: number, root: FiberRoot, state?: S) => void;
 declare const instrument: ({ onCommitFiberRoot, onCommitFiberUnmount, onPostCommitFiberRoot, }: {
     onCommitFiberRoot?: (rendererID: number, root: FiberRoot) => void;
     onCommitFiberUnmount?: (rendererID: number, root: FiberRoot) => void;

package/dist/index.d.ts

@@ -73,15 +73,15 @@ declare const getRDTHook: () => {
     onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
     inject: (renderer: unknown) => number;
 };
-type RenderHandler = (fiber: Fiber, phase: 'mount' | 'update' | 'unmount') => void;
+type RenderHandler = <S>(fiber: Fiber, phase: 'mount' | 'update' | 'unmount', state?: S) => void;
 declare const mountFiberRecursively: (onRender: RenderHandler, firstChild: Fiber, traverseSiblings: boolean) => void;
 declare const updateFiberRecursively: (onRender: RenderHandler, nextFiber: Fiber, prevFiber: Fiber, parentFiber: Fiber | null) => void;
 declare const unmountFiber: (onRender: RenderHandler, fiber: Fiber) => void;
 declare const unmountFiberChildrenRecursively: (onRender: RenderHandler, fiber: Fiber) => void;
-declare const createFiberVisitor: ({ onRender, onError, }: {
+declare const createFiberVisitor: ({ onRender: onRenderWithoutState, onError, }: {
     onRender: RenderHandler;
     onError?: (error: unknown) => void;
-}) => (_rendererID: number, root: FiberRoot) => void;
+}) => <S>(_rendererID: number, root: FiberRoot, state?: S) => void;
 declare const instrument: ({ onCommitFiberRoot, onCommitFiberUnmount, onPostCommitFiberRoot, }: {
     onCommitFiberRoot?: (rendererID: number, root: FiberRoot) => void;
     onCommitFiberUnmount?: (rendererID: number, root: FiberRoot) => void;

package/dist/index.global.js

@@ -1 +1 @@
-var Bippy=(function(exports){'use strict';var H=1,w=0,k=9,_=13,D=22,M=11,z=14,P=15,E=5,N=26,V=27,I=18,U=6,L=7,j=23,A=22,B=3,W=60111,R="Symbol(react.concurrent_mode)",O="Symbol(react.async_mode)",$=1,G=2,Y=128,K=4096,Q=4,q=8,J=16,X=32,Z=512,ee=1024,te=8192,oe=13366,ne=e=>typeof e=="object"&&e!==null&&"$$typeof"in e&&String(e.$$typeof)==="Symbol(react.element)",d=e=>e.tag===5||e.tag===26||e.tag===27,re=e=>e.tag===0||e.tag===1||e.tag===15||e.tag===14||e.tag===11,le=(e,t)=>{try{let n=e.dependencies,o=e.alternate?.dependencies;if(!n||!o||typeof n!="object"||!("firstContext"in n)||typeof o!="object"||!("firstContext"in o))return !1;let r=n.firstContext,i=o.firstContext;for(;r&&typeof r=="object"&&"memoizedValue"in r&&i&&typeof i=="object"&&"memoizedValue"in i;){if(t(r,i)===!0)return !0;r=r.next,i=i.next;}}catch{}return !1},ie=(e,t)=>{try{let n=e.memoizedState,o=e.alternate?.memoizedState;for(;n&&o;){if(t(n,o)===!0)return !0;n=n.next,o=o.next;}}catch{}return !1},se=(e,t)=>{try{let n=e.memoizedProps,o=e.alternate?.memoizedProps||{};for(let r in {...o,...n}){let i=o?.[r],s=n?.[r];if(t(i,s)===!0)return !0}}catch{}return !1},u=e=>{let t=e.memoizedProps,n=e.alternate?.memoizedProps||{},o=e.flags??e.effectTag??0;switch(e.tag){case 1:case 0:case 9:case 11:case 14:case 15:return (o&1)===1;default:return e.alternate?n!==t||e.alternate.memoizedState!==e.memoizedState||e.alternate.ref!==e.ref:!0}},C=e=>!!(u(e)&&(e.subtreeFlags&13374||e.deletions)),f=e=>{if(!C(e))return [];let t=[];for(let n=e.sibling;n;n=n.sibling)d(n)&&C(n.return??n)&&u(n)&&(t.push(n),t.push(...f(n)));return e.child&&d(e.child)&&C(e)&&u(e.child)&&(t.push(e.child),t.push(...f(e.child))),t},ae=e=>{let t=[];for(;e.return;)t.unshift(e),e=e.return;return t},b=e=>{switch(e.tag){case 18:return !0;case 6:case 7:case 23:case 22:return !0;case 3:return !1;default:{let t=typeof e.type=="object"&&e.type!==null?e.type.$$typeof:e.type;switch(typeof t=="symbol"?t.toString():t){case 60111:case R:case O:return !0;default:return !1}}}},ce=e=>{let t=h(e,d);return t||(t=h(e,d,!0)),t},h=(e,t,n=!1)=>{if(!e)return null;if(t(e)===!0)return e;let o=n?e.return:e.child;for(;o;){let r=h(o,t,n);if(r)return r;o=n?null:o.sibling;}return null},ue=e=>{let t=e?.actualDuration??0,n=t,o=e?.child??null;for(;t>0&&o!=null;)n-=o.actualDuration??0,o=o.sibling;return {selfTime:n,totalTime:t}},me=e=>!!e.updateQueue?.memoCache,F=e=>typeof e=="function"?e:typeof e=="object"&&e?F(e.type||e.render):null,pe=e=>{if(typeof e!="function"&&!(typeof e=="object"&&e))return null;let t=e.displayName||e.name||null;return t||(e=F(e),e&&(e.displayName||e.name)||null)},p=()=>{},y=()=>{let e=globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__,t=new Map,n=0;e??={checkDCE:p,supportsFiber:!0,supportsFlight:!0,renderers:t,onCommitFiberRoot:p,onCommitFiberUnmount:p,onPostCommitFiberRoot:p,inject(o){let r=++n;return t.set(r,o),r}};try{globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__=e;}catch{}return e};typeof window<"u"&&y();var c=(e,t,n)=>{let o=t;for(;o!=null;){if(!b(o)&&u(o)&&e(o,"mount"),o.tag===13)if(o.memoizedState!==null){let s=o.child,a=s?s.sibling:null;if(a){let l=a.child;l!==null&&c(e,l,!1);}}else {let s=null;o.child!==null&&(s=o.child.child),s!==null&&c(e,s,!1);}else o.child!=null&&c(e,o.child,!0);o=n?o.sibling:null;}},g=(e,t,n,o)=>{if(!n)return;let r=t.tag===13,i=!b(t);i&&u(t)&&e(t,"update");let s=r&&n.memoizedState!==null,a=r&&t.memoizedState!==null;if(s&&a){let l=t.child?.sibling??null,m=n.child?.sibling??null;l!==null&&m!==null&&g(e,l,m);}else if(s&&!a){let l=t.child;l!==null&&c(e,l,!0);}else if(!s&&a){S(e,n);let l=t.child?.sibling??null;l!==null&&c(e,l,!0);}else if(t.child!==n.child){let l=t.child;for(;l;){if(l.alternate){let m=l.alternate;g(e,l,m);}else c(e,l,!1);l=l.sibling;}}},T=(e,t)=>{(t.tag===3||!b(t))&&e(t,"unmount");},S=(e,t)=>{let n=t.tag===13&&t.memoizedState!==null,o=t.child;for(n&&(o=(t.child?.sibling??null)?.child??null);o!==null;)o.return!==null&&(T(e,o),S(e,o)),o=o.sibling;},v=0,x=new WeakMap,de=({onRender:e,onError:t})=>(n,o)=>{let r=o.current,i=x.get(o);i||(i={prevFiber:null,id:v++},x.set(o,i));let{prevFiber:s}=i;try{if(s!==null){let a=s&&s.memoizedState!=null&&s.memoizedState.element!=null&&s.memoizedState.isDehydrated!==!0,l=r.memoizedState!=null&&r.memoizedState.element!=null&&r.memoizedState.isDehydrated!==!0;!a&&l?c(e,r,!1):a&&l?g(e,r,r.alternate,null):a&&!l&&T(e,r);}else c(e,r,!1);}catch(a){if(t)t(a);else throw a}i.prevFiber=r;},Ce=({onCommitFiberRoot:e,onCommitFiberUnmount:t,onPostCommitFiberRoot:n})=>{let o=y(),r=o.onCommitFiberRoot;e&&(o.onCommitFiberRoot=(a,l)=>{r&&r(a,l),e(a,l);});let i=o.onCommitFiberUnmount;t&&(o.onCommitFiberUnmount=(a,l)=>{i&&i(a,l),t(a,l);});let s=o.onPostCommitFiberRoot;return n&&(o.onPostCommitFiberRoot=(a,l)=>{s&&s(a,l);}),o};exports.CONCURRENT_MODE_NUMBER=W;exports.CONCURRENT_MODE_SYMBOL_STRING=R;exports.ChildDeletion=J;exports.ClassComponentTag=H;exports.Cloned=q;exports.ContentReset=X;exports.ContextConsumerTag=k;exports.DEPRECATED_ASYNC_MODE_SYMBOL_STRING=O;exports.DehydratedSuspenseComponent=I;exports.DidCapture=Y;exports.ForwardRefTag=M;exports.Fragment=L;exports.FunctionComponentTag=w;exports.HostComponentTag=E;exports.HostHoistableTag=N;exports.HostRoot=B;exports.HostSingletonTag=V;exports.HostText=U;exports.Hydrating=K;exports.LegacyHiddenComponent=j;exports.MemoComponentTag=z;exports.MutationMask=oe;exports.OffscreenComponent=A;exports.OffscreenComponentTag=D;exports.PerformedWork=$;exports.Placement=G;exports.Ref=Z;exports.SimpleMemoComponentTag=P;exports.Snapshot=ee;exports.SuspenseComponentTag=_;exports.Update=Q;exports.Visibility=te;exports.createFiberVisitor=de;exports.didFiberCommit=C;exports.didFiberRender=u;exports.getDisplayName=pe;exports.getFiberStack=ae;exports.getMutatedHostFibers=f;exports.getNearestHostFiber=ce;exports.getRDTHook=y;exports.getTimings=ue;exports.getType=F;exports.hasMemoCache=me;exports.instrument=Ce;exports.isCompositeFiber=re;exports.isHostFiber=d;exports.isValidElement=ne;exports.mountFiberRecursively=c;exports.shouldFilterFiber=b;exports.traverseContexts=le;exports.traverseFiber=h;exports.traverseProps=se;exports.traverseState=ie;exports.unmountFiber=T;exports.unmountFiberChildrenRecursively=S;exports.updateFiberRecursively=g;return exports;})({});
+var Bippy=(function(exports){'use strict';var w=1,H=0,k=9,_=13,D=22,M=11,z=14,P=15,E=5,N=26,V=27,I=18,U=6,L=7,j=23,A=22,B=3,W=60111,T="Symbol(react.concurrent_mode)",R="Symbol(react.async_mode)",$=1,G=2,Y=128,K=4096,Q=4,q=8,J=16,X=32,Z=512,ee=1024,te=8192,oe=13366,ne=e=>typeof e=="object"&&e!==null&&"$$typeof"in e&&String(e.$$typeof)==="Symbol(react.element)",d=e=>e.tag===5||e.tag===26||e.tag===27,re=e=>e.tag===0||e.tag===1||e.tag===15||e.tag===14||e.tag===11,ie=(e,o)=>{try{let n=e.dependencies,t=e.alternate?.dependencies;if(!n||!t||typeof n!="object"||!("firstContext"in n)||typeof t!="object"||!("firstContext"in t))return !1;let r=n.firstContext,l=t.firstContext;for(;r&&typeof r=="object"&&"memoizedValue"in r&&l&&typeof l=="object"&&"memoizedValue"in l;){if(o(r,l)===!0)return !0;r=r.next,l=l.next;}}catch{}return !1},le=(e,o)=>{try{let n=e.memoizedState,t=e.alternate?.memoizedState;for(;n&&t;){if(o(n,t)===!0)return !0;n=n.next,t=t.next;}}catch{}return !1},se=(e,o)=>{try{let n=e.memoizedProps,t=e.alternate?.memoizedProps||{};for(let r in {...t,...n}){let l=t?.[r],s=n?.[r];if(o(l,s)===!0)return !0}}catch{}return !1},f=e=>{let o=e.memoizedProps,n=e.alternate?.memoizedProps||{},t=e.flags??e.effectTag??0;switch(e.tag){case 1:case 0:case 9:case 11:case 14:case 15:return (t&1)===1;default:return e.alternate?n!==o||e.alternate.memoizedState!==e.memoizedState||e.alternate.ref!==e.ref:!0}},v=e=>!!(e.subtreeFlags&13374||e.deletions),ae=e=>{let o=[],n=new WeakSet,t=r=>{!r||n.has(r)||(n.add(r),d(r)&&v(r.return??r)&&f(r)&&o.push(r),r.child&&t(r.child),r.sibling&&t(r.sibling));};return t(e),o},ce=e=>{let o=[];for(;e.return;)o.unshift(e),e=e.return;return o},g=e=>{switch(e.tag){case 18:return !0;case 6:case 7:case 23:case 22:return !0;case 3:return !1;default:{let o=typeof e.type=="object"&&e.type!==null?e.type.$$typeof:e.type;switch(typeof o=="symbol"?o.toString():o){case 60111:case T:case R:return !0;default:return !1}}}},ue=e=>{let o=C(e,d);return o||(o=C(e,d,!0)),o},C=(e,o,n=!1)=>{if(!e)return null;if(o(e)===!0)return e;let t=n?e.return:e.child;for(;t;){let r=C(t,o,n);if(r)return r;t=n?null:t.sibling;}return null},me=e=>{let o=e?.actualDuration??0,n=o,t=e?.child??null;for(;o>0&&t!=null;)n-=t.actualDuration??0,t=t.sibling;return {selfTime:n,totalTime:o}},pe=e=>!!e.updateQueue?.memoCache,F=e=>typeof e=="function"?e:typeof e=="object"&&e?F(e.type||e.render):null,de=e=>{if(typeof e!="function"&&!(typeof e=="object"&&e))return null;let o=e.displayName||e.name||null;return o||(e=F(e),e&&(e.displayName||e.name)||null)},p=()=>{},x=()=>{let e=globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__,o=new Map,n=0;e??={checkDCE:p,supportsFiber:!0,supportsFlight:!0,renderers:o,onCommitFiberRoot:p,onCommitFiberUnmount:p,onPostCommitFiberRoot:p,inject(t){let r=++n;return o.set(r,t),r}};try{globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__=e;}catch{}return e};typeof window<"u"&&x();var u=(e,o,n)=>{let t=o;for(;t!=null;){if(!g(t)&&f(t)&&e(t,"mount"),t.tag===13)if(t.memoizedState!==null){let s=t.child,a=s?s.sibling:null;if(a){let i=a.child;i!==null&&u(e,i,!1);}}else {let s=null;t.child!==null&&(s=t.child.child),s!==null&&u(e,s,!1);}else t.child!=null&&u(e,t.child,!0);t=n?t.sibling:null;}},b=(e,o,n,t)=>{if(!n)return;let r=o.tag===13,l=!g(o);l&&f(o)&&e(o,"update");let s=r&&n.memoizedState!==null,a=r&&o.memoizedState!==null;if(s&&a){let i=o.child?.sibling??null,c=n.child?.sibling??null;i!==null&&c!==null&&b(e,i,c);}else if(s&&!a){let i=o.child;i!==null&&u(e,i,!0);}else if(!s&&a){y(e,n);let i=o.child?.sibling??null;i!==null&&u(e,i,!0);}else if(o.child!==n.child){let i=o.child;for(;i;){if(i.alternate){let c=i.alternate;b(e,i,c);}else u(e,i,!1);i=i.sibling;}}},S=(e,o)=>{(o.tag===3||!g(o))&&e(o,"unmount");},y=(e,o)=>{let n=o.tag===13&&o.memoizedState!==null,t=o.child;for(n&&(t=(o.child?.sibling??null)?.child??null);t!==null;)t.return!==null&&(S(e,t),y(e,t)),t=t.sibling;},O=0,h=new WeakMap,Ce=({onRender:e,onError:o})=>(n,t,r)=>{let l=t.current,s=(c,m)=>e(c,m,r),a=h.get(t);a||(a={prevFiber:null,id:O++},h.set(t,a));let{prevFiber:i}=a;try{if(i!==null){let c=i&&i.memoizedState!=null&&i.memoizedState.element!=null&&i.memoizedState.isDehydrated!==!0,m=l.memoizedState!=null&&l.memoizedState.element!=null&&l.memoizedState.isDehydrated!==!0;!c&&m?u(s,l,!1):c&&m?b(s,l,l.alternate,null):c&&!m&&S(s,l);}else u(s,l,!1);}catch(c){if(o)o(c);else throw c}a.prevFiber=l;},be=({onCommitFiberRoot:e,onCommitFiberUnmount:o,onPostCommitFiberRoot:n})=>{let t=x(),r=t.onCommitFiberRoot;e&&(t.onCommitFiberRoot=(a,i)=>{r&&r(a,i),e(a,i);});let l=t.onCommitFiberUnmount;o&&(t.onCommitFiberUnmount=(a,i)=>{l&&l(a,i),o(a,i);});let s=t.onPostCommitFiberRoot;return n&&(t.onPostCommitFiberRoot=(a,i)=>{s&&s(a,i);}),t};exports.CONCURRENT_MODE_NUMBER=W;exports.CONCURRENT_MODE_SYMBOL_STRING=T;exports.ChildDeletion=J;exports.ClassComponentTag=w;exports.Cloned=q;exports.ContentReset=X;exports.ContextConsumerTag=k;exports.DEPRECATED_ASYNC_MODE_SYMBOL_STRING=R;exports.DehydratedSuspenseComponent=I;exports.DidCapture=Y;exports.ForwardRefTag=M;exports.Fragment=L;exports.FunctionComponentTag=H;exports.HostComponentTag=E;exports.HostHoistableTag=N;exports.HostRoot=B;exports.HostSingletonTag=V;exports.HostText=U;exports.Hydrating=K;exports.LegacyHiddenComponent=j;exports.MemoComponentTag=z;exports.MutationMask=oe;exports.OffscreenComponent=A;exports.OffscreenComponentTag=D;exports.PerformedWork=$;exports.Placement=G;exports.Ref=Z;exports.SimpleMemoComponentTag=P;exports.Snapshot=ee;exports.SuspenseComponentTag=_;exports.Update=Q;exports.Visibility=te;exports.createFiberVisitor=Ce;exports.didFiberCommit=v;exports.didFiberRender=f;exports.getDisplayName=de;exports.getFiberStack=ce;exports.getMutatedHostFibers=ae;exports.getNearestHostFiber=ue;exports.getRDTHook=x;exports.getTimings=me;exports.getType=F;exports.hasMemoCache=pe;exports.instrument=be;exports.isCompositeFiber=re;exports.isHostFiber=d;exports.isValidElement=ne;exports.mountFiberRecursively=u;exports.shouldFilterFiber=g;exports.traverseContexts=ie;exports.traverseFiber=C;exports.traverseProps=se;exports.traverseState=le;exports.unmountFiber=S;exports.unmountFiberChildrenRecursively=y;exports.updateFiberRecursively=b;return exports;})({});

package/dist/index.js

@@ -104,22 +104,26 @@ var didFiberRender = (fiber) => {
 };
 var didFiberCommit = (fiber) => {
   return Boolean(
-    didFiberRender(fiber) && (fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions)
+    fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions
   );
 };
 var getMutatedHostFibers = (fiber) => {
-  if (!didFiberCommit(fiber)) return [];
   const mutations = [];
-  for (let sibling = fiber.sibling; sibling; sibling = sibling.sibling) {
-    if (isHostFiber(sibling) && didFiberCommit(sibling.return ?? sibling) && didFiberRender(sibling)) {
-      mutations.push(sibling);
-      mutations.push(...getMutatedHostFibers(sibling));
+  const visited = /* @__PURE__ */ new WeakSet();
+  const traverse = (node) => {
+    if (!node || visited.has(node)) return;
+    visited.add(node);
+    if (isHostFiber(node) && didFiberCommit(node.return ?? node) && didFiberRender(node)) {
+      mutations.push(node);
     }
-  }
-  if (fiber.child && isHostFiber(fiber.child) && didFiberCommit(fiber) && didFiberRender(fiber.child)) {
-    mutations.push(fiber.child);
-    mutations.push(...getMutatedHostFibers(fiber.child));
-  }
+    if (node.child) {
+      traverse(node.child);
+    }
+    if (node.sibling) {
+      traverse(node.sibling);
+    }
+  };
+  traverse(fiber);
   return mutations;
 };
 var getFiberStack = (fiber) => {
@@ -337,11 +341,12 @@ var unmountFiberChildrenRecursively = (onRender, fiber) => {
 var commitId = 0;
 var rootInstanceMap = /* @__PURE__ */ new WeakMap();
 var createFiberVisitor = ({
-  onRender,
+  onRender: onRenderWithoutState,
   onError
 }) => {
-  return (_rendererID, root) => {
+  return (_rendererID, root, state) => {
     const rootFiber = root.current;
+    const onRender = (fiber, phase) => onRenderWithoutState(fiber, phase, state);
     let rootInstance = rootInstanceMap.get(root);
     if (!rootInstance) {
       rootInstance = { prevFiber: null, id: commitId++ };

package/dist/index.mjs

@@ -102,22 +102,26 @@ var didFiberRender = (fiber) => {
 };
 var didFiberCommit = (fiber) => {
   return Boolean(
-    didFiberRender(fiber) && (fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions)
+    fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions
   );
 };
 var getMutatedHostFibers = (fiber) => {
-  if (!didFiberCommit(fiber)) return [];
   const mutations = [];
-  for (let sibling = fiber.sibling; sibling; sibling = sibling.sibling) {
-    if (isHostFiber(sibling) && didFiberCommit(sibling.return ?? sibling) && didFiberRender(sibling)) {
-      mutations.push(sibling);
-      mutations.push(...getMutatedHostFibers(sibling));
+  const visited = /* @__PURE__ */ new WeakSet();
+  const traverse = (node) => {
+    if (!node || visited.has(node)) return;
+    visited.add(node);
+    if (isHostFiber(node) && didFiberCommit(node.return ?? node) && didFiberRender(node)) {
+      mutations.push(node);
     }
-  }
-  if (fiber.child && isHostFiber(fiber.child) && didFiberCommit(fiber) && didFiberRender(fiber.child)) {
-    mutations.push(fiber.child);
-    mutations.push(...getMutatedHostFibers(fiber.child));
-  }
+    if (node.child) {
+      traverse(node.child);
+    }
+    if (node.sibling) {
+      traverse(node.sibling);
+    }
+  };
+  traverse(fiber);
   return mutations;
 };
 var getFiberStack = (fiber) => {
@@ -335,11 +339,12 @@ var unmountFiberChildrenRecursively = (onRender, fiber) => {
 var commitId = 0;
 var rootInstanceMap = /* @__PURE__ */ new WeakMap();
 var createFiberVisitor = ({
-  onRender,
+  onRender: onRenderWithoutState,
   onError
 }) => {
-  return (_rendererID, root) => {
+  return (_rendererID, root, state) => {
     const rootFiber = root.current;
+    const onRender = (fiber, phase) => onRenderWithoutState(fiber, phase, state);
     let rootInstance = rootInstanceMap.get(root);
     if (!rootInstance) {
       rootInstance = { prevFiber: null, id: commitId++ };

package/dist/score.d.mts

@@ -0,0 +1,17 @@
+import { Fiber } from 'react-reconciler';
+
+declare const getFPS: () => number;
+declare const getFiberRenderScore: (fiber: Fiber) => {
+    unnecessary: number;
+    slow: number;
+};
+declare const isElementVisible: (el: HTMLElement) => boolean;
+declare const getWindowDimensions: () => {
+    top: number;
+    left: number;
+    right: number;
+    bottom: number;
+};
+declare const isElementInViewport: (el: HTMLElement) => boolean;
+
+export { getFPS, getFiberRenderScore, getWindowDimensions, isElementInViewport, isElementVisible };

package/dist/score.d.ts

@@ -0,0 +1,17 @@
+import { Fiber } from 'react-reconciler';
+
+declare const getFPS: () => number;
+declare const getFiberRenderScore: (fiber: Fiber) => {
+    unnecessary: number;
+    slow: number;
+};
+declare const isElementVisible: (el: HTMLElement) => boolean;
+declare const getWindowDimensions: () => {
+    top: number;
+    left: number;
+    right: number;
+    bottom: number;
+};
+declare const isElementInViewport: (el: HTMLElement) => boolean;
+
+export { getFPS, getFiberRenderScore, getWindowDimensions, isElementInViewport, isElementVisible };

package/dist/score.js

@@ -0,0 +1,211 @@
+'use strict';
+
+// src/index.ts
+var ClassComponentTag = 1;
+var FunctionComponentTag = 0;
+var ContextConsumerTag = 9;
+var ForwardRefTag = 11;
+var MemoComponentTag = 14;
+var SimpleMemoComponentTag = 15;
+var HostComponentTag = 5;
+var HostHoistableTag = 26;
+var HostSingletonTag = 27;
+var PerformedWork = 1;
+var Placement = 2;
+var Hydrating = 4096;
+var Update = 4;
+var Cloned = 8;
+var ChildDeletion = 16;
+var ContentReset = 32;
+var Snapshot = 1024;
+var Visibility = 8192;
+var MutationMask = Placement | Update | ChildDeletion | ContentReset | Hydrating | Visibility | Snapshot;
+var isHostFiber = (fiber) => fiber.tag === HostComponentTag || // @ts-expect-error: it exists
+fiber.tag === HostHoistableTag || // @ts-expect-error: it exists
+fiber.tag === HostSingletonTag;
+var didFiberRender = (fiber) => {
+  const nextProps = fiber.memoizedProps;
+  const prevProps = fiber.alternate?.memoizedProps || {};
+  const flags = fiber.flags ?? fiber.effectTag ?? 0;
+  switch (fiber.tag) {
+    case ClassComponentTag:
+    case FunctionComponentTag:
+    case ContextConsumerTag:
+    case ForwardRefTag:
+    case MemoComponentTag:
+    case SimpleMemoComponentTag: {
+      return (flags & PerformedWork) === PerformedWork;
+    }
+    default:
+      if (!fiber.alternate) return true;
+      return prevProps !== nextProps || fiber.alternate.memoizedState !== fiber.memoizedState || fiber.alternate.ref !== fiber.ref;
+  }
+};
+var didFiberCommit = (fiber) => {
+  return Boolean(
+    fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions
+  );
+};
+var getMutatedHostFibers = (fiber) => {
+  const mutations = [];
+  const visited = /* @__PURE__ */ new WeakSet();
+  const traverse = (node) => {
+    if (!node || visited.has(node)) return;
+    visited.add(node);
+    if (isHostFiber(node) && didFiberCommit(node.return ?? node) && didFiberRender(node)) {
+      mutations.push(node);
+    }
+    if (node.child) {
+      traverse(node.child);
+    }
+    if (node.sibling) {
+      traverse(node.sibling);
+    }
+  };
+  traverse(fiber);
+  return mutations;
+};
+var getNearestHostFiber = (fiber) => {
+  let hostFiber = traverseFiber(fiber, isHostFiber);
+  if (!hostFiber) {
+    hostFiber = traverseFiber(fiber, isHostFiber, true);
+  }
+  return hostFiber;
+};
+var traverseFiber = (fiber, selector, ascending = false) => {
+  if (!fiber) return null;
+  if (selector(fiber) === true) return fiber;
+  let child = ascending ? fiber.return : fiber.child;
+  while (child) {
+    const match = traverseFiber(child, selector, ascending);
+    if (match) return match;
+    child = ascending ? null : child.sibling;
+  }
+  return null;
+};
+var NO_OP = () => {
+};
+var getRDTHook = () => {
+  let rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+  const renderers = /* @__PURE__ */ new Map();
+  let i = 0;
+  rdtHook ??= {
+    checkDCE: NO_OP,
+    supportsFiber: true,
+    supportsFlight: true,
+    renderers,
+    onCommitFiberRoot: NO_OP,
+    onCommitFiberUnmount: NO_OP,
+    onPostCommitFiberRoot: NO_OP,
+    inject(renderer) {
+      const nextID = ++i;
+      renderers.set(nextID, renderer);
+      return nextID;
+    }
+  };
+  try {
+    globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = rdtHook;
+  } catch {
+  }
+  return rdtHook;
+};
+if (typeof window !== "undefined") {
+  getRDTHook();
+}
+
+// src/score.ts
+var fps = 0;
+var lastTime = performance.now();
+var frameCount = 0;
+var inited = false;
+var getFPS = () => {
+  const updateFPS = () => {
+    frameCount++;
+    const now = performance.now();
+    if (now - lastTime >= 1e3) {
+      fps = frameCount;
+      frameCount = 0;
+      lastTime = now;
+    }
+    requestAnimationFrame(updateFPS);
+  };
+  if (!inited) {
+    inited = true;
+    updateFPS();
+  }
+  return fps;
+};
+var truncateFloat = (value, maxLen = 1e4) => {
+  if (typeof value === "number" && parseInt(value) !== value) {
+    value = ~~(value * maxLen) / maxLen;
+  }
+  return value;
+};
+var THRESHOLD_FPS = 60;
+var getFiberRenderScore = (fiber) => {
+  const hostFiber = getNearestHostFiber(fiber);
+  const hasMutation = didFiberCommit(fiber);
+  const mutatedHostFibers = getMutatedHostFibers(fiber);
+  const isVisible = hostFiber && isElementVisible(hostFiber.stateNode) && isElementInViewport(hostFiber.stateNode);
+  const fps2 = getFPS();
+  let unnecessaryScore = (
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    isVisible || mutatedHostFibers.length || hasMutation ? 0 : 1
+  );
+  for (const mutatedHostFiber of mutatedHostFibers) {
+    const node = mutatedHostFiber.stateNode;
+    if (!isElementVisible(node) || !isElementInViewport(node)) {
+      unnecessaryScore += 1 / mutatedHostFibers.length;
+    }
+  }
+  return {
+    unnecessary: truncateFloat(unnecessaryScore),
+    slow: fps2 < THRESHOLD_FPS ? truncateFloat((THRESHOLD_FPS - fps2) / THRESHOLD_FPS) : 0
+  };
+};
+var isElementVisible = (el) => {
+  const style = window.getComputedStyle(el);
+  return style.display !== "none" && style.visibility !== "hidden" && style.contentVisibility !== "hidden" && style.opacity !== "0";
+};
+var initedEventListeners = false;
+var scrollX = null;
+var scrollY = null;
+var innerWidth = null;
+var innerHeight = null;
+var getWindowDimensions = () => {
+  if (scrollX === null) scrollX = window.scrollX;
+  if (scrollY === null) scrollY = window.scrollY;
+  if (innerWidth === null) innerWidth = window.innerWidth;
+  if (innerHeight === null) innerHeight = window.innerHeight;
+  if (!initedEventListeners) {
+    initedEventListeners = true;
+    const handleResize = () => {
+      scrollX = null;
+      scrollY = null;
+      innerWidth = null;
+      innerHeight = null;
+    };
+    window.addEventListener("resize", handleResize);
+    window.addEventListener("scroll", handleResize);
+  }
+  return {
+    top: scrollY,
+    left: scrollX,
+    right: scrollX + innerWidth,
+    bottom: scrollY + innerHeight
+  };
+};
+var isElementInViewport = (el) => {
+  const elTop = el.offsetTop;
+  const elLeft = el.offsetLeft;
+  const elWidth = el.offsetWidth;
+  const elHeight = el.offsetHeight;
+  const { top, left, right, bottom } = getWindowDimensions();
+  return elTop + elHeight > top && elLeft + elWidth > left && elTop < bottom && elLeft < right;
+};
+
+exports.getFPS = getFPS;
+exports.getFiberRenderScore = getFiberRenderScore;
+exports.getWindowDimensions = getWindowDimensions;
+exports.isElementInViewport = isElementInViewport;
+exports.isElementVisible = isElementVisible;

package/dist/score.mjs

@@ -0,0 +1,205 @@
+// src/index.ts
+var ClassComponentTag = 1;
+var FunctionComponentTag = 0;
+var ContextConsumerTag = 9;
+var ForwardRefTag = 11;
+var MemoComponentTag = 14;
+var SimpleMemoComponentTag = 15;
+var HostComponentTag = 5;
+var HostHoistableTag = 26;
+var HostSingletonTag = 27;
+var PerformedWork = 1;
+var Placement = 2;
+var Hydrating = 4096;
+var Update = 4;
+var Cloned = 8;
+var ChildDeletion = 16;
+var ContentReset = 32;
+var Snapshot = 1024;
+var Visibility = 8192;
+var MutationMask = Placement | Update | ChildDeletion | ContentReset | Hydrating | Visibility | Snapshot;
+var isHostFiber = (fiber) => fiber.tag === HostComponentTag || // @ts-expect-error: it exists
+fiber.tag === HostHoistableTag || // @ts-expect-error: it exists
+fiber.tag === HostSingletonTag;
+var didFiberRender = (fiber) => {
+  const nextProps = fiber.memoizedProps;
+  const prevProps = fiber.alternate?.memoizedProps || {};
+  const flags = fiber.flags ?? fiber.effectTag ?? 0;
+  switch (fiber.tag) {
+    case ClassComponentTag:
+    case FunctionComponentTag:
+    case ContextConsumerTag:
+    case ForwardRefTag:
+    case MemoComponentTag:
+    case SimpleMemoComponentTag: {
+      return (flags & PerformedWork) === PerformedWork;
+    }
+    default:
+      if (!fiber.alternate) return true;
+      return prevProps !== nextProps || fiber.alternate.memoizedState !== fiber.memoizedState || fiber.alternate.ref !== fiber.ref;
+  }
+};
+var didFiberCommit = (fiber) => {
+  return Boolean(
+    fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions
+  );
+};
+var getMutatedHostFibers = (fiber) => {
+  const mutations = [];
+  const visited = /* @__PURE__ */ new WeakSet();
+  const traverse = (node) => {
+    if (!node || visited.has(node)) return;
+    visited.add(node);
+    if (isHostFiber(node) && didFiberCommit(node.return ?? node) && didFiberRender(node)) {
+      mutations.push(node);
+    }
+    if (node.child) {
+      traverse(node.child);
+    }
+    if (node.sibling) {
+      traverse(node.sibling);
+    }
+  };
+  traverse(fiber);
+  return mutations;
+};
+var getNearestHostFiber = (fiber) => {
+  let hostFiber = traverseFiber(fiber, isHostFiber);
+  if (!hostFiber) {
+    hostFiber = traverseFiber(fiber, isHostFiber, true);
+  }
+  return hostFiber;
+};
+var traverseFiber = (fiber, selector, ascending = false) => {
+  if (!fiber) return null;
+  if (selector(fiber) === true) return fiber;
+  let child = ascending ? fiber.return : fiber.child;
+  while (child) {
+    const match = traverseFiber(child, selector, ascending);
+    if (match) return match;
+    child = ascending ? null : child.sibling;
+  }
+  return null;
+};
+var NO_OP = () => {
+};
+var getRDTHook = () => {
+  let rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+  const renderers = /* @__PURE__ */ new Map();
+  let i = 0;
+  rdtHook ??= {
+    checkDCE: NO_OP,
+    supportsFiber: true,
+    supportsFlight: true,
+    renderers,
+    onCommitFiberRoot: NO_OP,
+    onCommitFiberUnmount: NO_OP,
+    onPostCommitFiberRoot: NO_OP,
+    inject(renderer) {
+      const nextID = ++i;
+      renderers.set(nextID, renderer);
+      return nextID;
+    }
+  };
+  try {
+    globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = rdtHook;
+  } catch {
+  }
+  return rdtHook;
+};
+if (typeof window !== "undefined") {
+  getRDTHook();
+}
+
+// src/score.ts
+var fps = 0;
+var lastTime = performance.now();
+var frameCount = 0;
+var inited = false;
+var getFPS = () => {
+  const updateFPS = () => {
+    frameCount++;
+    const now = performance.now();
+    if (now - lastTime >= 1e3) {
+      fps = frameCount;
+      frameCount = 0;
+      lastTime = now;
+    }
+    requestAnimationFrame(updateFPS);
+  };
+  if (!inited) {
+    inited = true;
+    updateFPS();
+  }
+  return fps;
+};
+var truncateFloat = (value, maxLen = 1e4) => {
+  if (typeof value === "number" && parseInt(value) !== value) {
+    value = ~~(value * maxLen) / maxLen;
+  }
+  return value;
+};
+var THRESHOLD_FPS = 60;
+var getFiberRenderScore = (fiber) => {
+  const hostFiber = getNearestHostFiber(fiber);
+  const hasMutation = didFiberCommit(fiber);
+  const mutatedHostFibers = getMutatedHostFibers(fiber);
+  const isVisible = hostFiber && isElementVisible(hostFiber.stateNode) && isElementInViewport(hostFiber.stateNode);
+  const fps2 = getFPS();
+  let unnecessaryScore = (
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    isVisible || mutatedHostFibers.length || hasMutation ? 0 : 1
+  );
+  for (const mutatedHostFiber of mutatedHostFibers) {
+    const node = mutatedHostFiber.stateNode;
+    if (!isElementVisible(node) || !isElementInViewport(node)) {
+      unnecessaryScore += 1 / mutatedHostFibers.length;
+    }
+  }
+  return {
+    unnecessary: truncateFloat(unnecessaryScore),
+    slow: fps2 < THRESHOLD_FPS ? truncateFloat((THRESHOLD_FPS - fps2) / THRESHOLD_FPS) : 0
+  };
+};
+var isElementVisible = (el) => {
+  const style = window.getComputedStyle(el);
+  return style.display !== "none" && style.visibility !== "hidden" && style.contentVisibility !== "hidden" && style.opacity !== "0";
+};
+var initedEventListeners = false;
+var scrollX = null;
+var scrollY = null;
+var innerWidth = null;
+var innerHeight = null;
+var getWindowDimensions = () => {
+  if (scrollX === null) scrollX = window.scrollX;
+  if (scrollY === null) scrollY = window.scrollY;
+  if (innerWidth === null) innerWidth = window.innerWidth;
+  if (innerHeight === null) innerHeight = window.innerHeight;
+  if (!initedEventListeners) {
+    initedEventListeners = true;
+    const handleResize = () => {
+      scrollX = null;
+      scrollY = null;
+      innerWidth = null;
+      innerHeight = null;
+    };
+    window.addEventListener("resize", handleResize);
+    window.addEventListener("scroll", handleResize);
+  }
+  return {
+    top: scrollY,
+    left: scrollX,
+    right: scrollX + innerWidth,
+    bottom: scrollY + innerHeight
+  };
+};
+var isElementInViewport = (el) => {
+  const elTop = el.offsetTop;
+  const elLeft = el.offsetLeft;
+  const elWidth = el.offsetWidth;
+  const elHeight = el.offsetHeight;
+  const { top, left, right, bottom } = getWindowDimensions();
+  return elTop + elHeight > top && elLeft + elWidth > left && elTop < bottom && elLeft < right;
+};
+
+export { getFPS, getFiberRenderScore, getWindowDimensions, isElementInViewport, isElementVisible };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bippy",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "description": "a hacky way to get fibers from react",
   "keywords": [
     "react",
@@ -35,6 +35,16 @@
         "default": "./dist/index.js"
       }
     },
+    "./score": {
+      "import": {
+        "types": "./dist/score.d.mts",
+        "default": "./dist/score.mjs"
+      },
+      "require": {
+        "types": "./dist/score.d.ts",
+        "default": "./dist/score.js"
+      }
+    },
     "./dist/*": "./dist/*.js",
     "./dist/*.js": "./dist/*.js",
     "./dist/*.mjs": "./dist/*.mjs"

package/dist/rsc-shim.d.mts

@@ -1,2 +0,0 @@
-
-export {  }

package/dist/rsc-shim.d.ts

@@ -1,2 +0,0 @@
-
-export {  }

package/dist/rsc-shim.global.js

@@ -1,21 +0,0 @@
-var Bippy = (function () {
-  'use strict';
-
-  var __getOwnPropNames = Object.getOwnPropertyNames;
-  var __commonJS = (cb, mod) => function __require() {
-    return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-  };
-
-  // src/rsc-shim.ts
-  var require_rsc_shim = __commonJS({
-    "src/rsc-shim.ts"() {
-      throw new Error(
-        "This module cannot be imported from a Server Component module. It should only be used from a Client Component."
-      );
-    }
-  });
-  var rscShim_global = require_rsc_shim();
-
-  return rscShim_global;
-
-})();

package/dist/rsc-shim.js

@@ -1,18 +0,0 @@
-'use strict';
-
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
-
-// src/rsc-shim.ts
-var require_rsc_shim = __commonJS({
-  "src/rsc-shim.ts"() {
-    throw new Error(
-      "This module cannot be imported from a Server Component module. It should only be used from a Client Component."
-    );
-  }
-});
-var rscShim = require_rsc_shim();
-
-module.exports = rscShim;

package/dist/rsc-shim.mjs

@@ -1,16 +0,0 @@
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
-
-// src/rsc-shim.ts
-var require_rsc_shim = __commonJS({
-  "src/rsc-shim.ts"() {
-    throw new Error(
-      "This module cannot be imported from a Server Component module. It should only be used from a Client Component."
-    );
-  }
-});
-var rscShim = require_rsc_shim();
-
-export { rscShim as default };