bippy 0.3.16 → 0.3.17

package/README.md

@@ -82,7 +82,7 @@ while all of the information is there, it's not super easy to work with, and cha
 
 however, fibers aren't directly accessible by the user. so, we have to hack our way around to accessing it.
 
-luckily, react [reads from a property](https://github.com/facebook/react/blob/6a4b46cd70d2672bc4be59dcb5b8dede22ed0cef/packages/react-reconciler/src/reactFiberDevToolsHook.js#L48) in the window object: `window.__REACT_DEVTOOLS_GLOBAL_HOOK__` and runs handlers on it when certain events happen. this property must exist before react's bundle is executed. this is intended for react devtools, but we can use it to our advantage.
+luckily, react [reads from a property](https://github.com/facebook/react/blob/6a4b46cd70d2672bc4be59dcb5b8dede22ed0cef/packages/react-reconciler/src/ReactFiberDevToolsHook.js#L48) in the window object: `window.__REACT_DEVTOOLS_GLOBAL_HOOK__` and runs handlers on it when certain events happen. this property must exist before react's bundle is executed. this is intended for react devtools, but we can use it to our advantage.
 
 here's what it roughly looks like:
 
@@ -397,7 +397,7 @@ import { isValidFiber } from 'bippy';
 console.log(isValidFiber(fiber));
 ```
 
-## getFiberFromHostInstance
+### getFiberFromHostInstance
 
 returns the fiber associated with a given host instance (e.g., a DOM element).
 
@@ -408,7 +408,7 @@ const fiber = getFiberFromHostInstance(document.querySelector('div'));
 console.log(fiber);
 ```
 
-## getLatestFiber
+### getLatestFiber
 
 returns the latest fiber (since it may be double-buffered). usually use this in combination with `getFiberFromHostInstance`.
 
@@ -421,6 +421,28 @@ const latestFiber = getLatestFiber(
 console.log(latestFiber);
 ```
 
+### getFiberSource
+
+returns the source code location of a fiber.
+
+```typescript
+import { getFiberSource } from 'bippy/source';
+
+const fiber = getFiberFromHostInstance(document.querySelector('div'));
+
+console.log(await getFiberSource(fiber));
+```
+
+> note: in order to get accurate source locations in react >= 19, you need to add this in your `tsconfig.json`:
+>
+> ```json
+> {
+>   "compilerOptions": {
+>     "jsxImportSource": "bippy/dist"
+>   }
+> }
+> ```
+
 ## examples
 
 the best way to understand bippy is to [read the source code](https://github.com/aidenybai/bippy/blob/main/src/core.ts). here are some examples of how you can use it:

package/dist/{core-BS9Kf-6A.cjs → core-BBir3S-T.cjs}

@@ -6,158 +6,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+const require_rdt_hook = require('./rdt-hook-Cm8ZY78C.cjs');
 
-//#region src/rdt-hook.ts
-const version = "0.3.16";
-const BIPPY_INSTRUMENTATION_STRING = `bippy-${version}`;
-const objectDefineProperty = Object.defineProperty;
-const objectHasOwnProperty = Object.prototype.hasOwnProperty;
-const NO_OP = () => {};
-const checkDCE = (fn) => {
-	try {
-		const code = Function.prototype.toString.call(fn);
-		if (code.indexOf("^_^") > -1) setTimeout(() => {
-			throw new Error("React is running in production mode, but dead code elimination has not been applied. Read how to correctly configure React for production: https://reactjs.org/link/perf-use-production-build");
-		});
-	} catch {}
-};
-const isRealReactDevtools = (rdtHook = getRDTHook()) => {
-	return "getFiberRoots" in rdtHook;
-};
-let isReactRefreshOverride = false;
-let injectFnStr = void 0;
-const isReactRefresh = (rdtHook = getRDTHook()) => {
-	if (isReactRefreshOverride) return true;
-	if (typeof rdtHook.inject === "function") injectFnStr = rdtHook.inject.toString();
-	return Boolean(injectFnStr?.includes("(injected)"));
-};
-const onActiveListeners = new Set();
-const _renderers = new Set();
-const installRDTHook = (onActive) => {
-	const renderers = new Map();
-	let i = 0;
-	let rdtHook = {
-		checkDCE,
-		supportsFiber: true,
-		supportsFlight: true,
-		hasUnsupportedRendererAttached: false,
-		renderers,
-		onCommitFiberRoot: NO_OP,
-		onCommitFiberUnmount: NO_OP,
-		onPostCommitFiberRoot: NO_OP,
-		inject(renderer) {
-			const nextID = ++i;
-			renderers.set(nextID, renderer);
-			_renderers.add(renderer);
-			if (!rdtHook._instrumentationIsActive) {
-				rdtHook._instrumentationIsActive = true;
-				onActiveListeners.forEach((listener) => listener());
-			}
-			return nextID;
-		},
-		_instrumentationSource: BIPPY_INSTRUMENTATION_STRING,
-		_instrumentationIsActive: false
-	};
-	try {
-		objectDefineProperty(globalThis, "__REACT_DEVTOOLS_GLOBAL_HOOK__", {
-			get() {
-				return rdtHook;
-			},
-			set(newHook) {
-				if (newHook && typeof newHook === "object") {
-					const ourRenderers = rdtHook.renderers;
-					rdtHook = newHook;
-					if (ourRenderers.size > 0) {
-						ourRenderers.forEach((renderer, id) => {
-							_renderers.add(renderer);
-							newHook.renderers.set(id, renderer);
-						});
-						patchRDTHook(onActive);
-					}
-				}
-			},
-			configurable: true,
-			enumerable: true
-		});
-		const originalWindowHasOwnProperty = window.hasOwnProperty;
-		let hasRanHack = false;
-		objectDefineProperty(window, "hasOwnProperty", {
-			value: function() {
-				try {
-					if (!hasRanHack && arguments[0] === "__REACT_DEVTOOLS_GLOBAL_HOOK__") {
-						globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = void 0;
-						hasRanHack = true;
-						return -0;
-					}
-				} catch {}
-				return originalWindowHasOwnProperty.apply(this, arguments);
-			},
-			configurable: true,
-			writable: true
-		});
-	} catch {
-		patchRDTHook(onActive);
-	}
-	return rdtHook;
-};
-const patchRDTHook = (onActive) => {
-	if (onActive) onActiveListeners.add(onActive);
-	try {
-		const rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
-		if (!rdtHook) return;
-		if (!rdtHook._instrumentationSource) {
-			rdtHook.checkDCE = checkDCE;
-			rdtHook.supportsFiber = true;
-			rdtHook.supportsFlight = true;
-			rdtHook.hasUnsupportedRendererAttached = false;
-			rdtHook._instrumentationSource = BIPPY_INSTRUMENTATION_STRING;
-			rdtHook._instrumentationIsActive = false;
-			if (rdtHook.renderers.size) {
-				rdtHook._instrumentationIsActive = true;
-				onActiveListeners.forEach((listener) => listener());
-				return;
-			}
-			const prevInject = rdtHook.inject;
-			if (isReactRefresh(rdtHook) && !isRealReactDevtools()) {
-				isReactRefreshOverride = true;
-				const nextID = rdtHook.inject({ scheduleRefresh() {} });
-				if (nextID) rdtHook._instrumentationIsActive = true;
-			}
-			rdtHook.inject = (renderer) => {
-				const id = prevInject(renderer);
-				_renderers.add(renderer);
-				rdtHook._instrumentationIsActive = true;
-				onActiveListeners.forEach((listener) => listener());
-				return id;
-			};
-		}
-		if (rdtHook.renderers.size || rdtHook._instrumentationIsActive || isReactRefresh()) onActive?.();
-	} catch {}
-};
-const hasRDTHook = () => {
-	return objectHasOwnProperty.call(globalThis, "__REACT_DEVTOOLS_GLOBAL_HOOK__");
-};
-/**
-* Returns the current React DevTools global hook.
-*/
-const getRDTHook = (onActive) => {
-	if (!hasRDTHook()) return installRDTHook(onActive);
-	patchRDTHook(onActive);
-	return globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
-};
-const isClientEnvironment = () => {
-	return Boolean(typeof window !== "undefined" && (window.document?.createElement || window.navigator?.product === "ReactNative"));
-};
-/**
-* Usually used purely for side effect
-*/
-const safelyInstallRDTHook = () => {
-	try {
-		if (isClientEnvironment()) getRDTHook();
-	} catch {}
-};
-
-//#endregion
 //#region src/install-hook-script-string.ts
 const INSTALL_HOOK_SCRIPT_STRING = "(()=>{try{var t=()=>{};const n=new Map;let o=0;globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__={checkDCE:t,supportsFiber:!0,supportsFlight:!0,hasUnsupportedRendererAttached:!1,renderers:n,onCommitFiberRoot:t,onCommitFiberUnmount:t,onPostCommitFiberRoot:t,inject(t){var e=++o;return n.set(e,t),globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__._instrumentationIsActive=!0,e},_instrumentationIsActive:!1,_script:!0}}catch{}})()";
 
@@ -464,8 +314,8 @@ const detectReactBuildType = (renderer) => {
 * Returns `true` if bippy's instrumentation is active.
 */
 const isInstrumentationActive = () => {
-	const rdtHook = getRDTHook();
-	return Boolean(rdtHook._instrumentationIsActive) || isRealReactDevtools() || isReactRefresh();
+	const rdtHook = require_rdt_hook.getRDTHook();
+	return Boolean(rdtHook._instrumentationIsActive) || require_rdt_hook.isRealReactDevtools() || require_rdt_hook.isReactRefresh();
 };
 /**
 * Returns the latest fiber (since it may be double-buffered).
@@ -624,10 +474,10 @@ const createFiberVisitor = ({ onRender }) => {
 * });
 */
 const instrument = (options) => {
-	return getRDTHook(() => {
-		const rdtHook = getRDTHook();
+	return require_rdt_hook.getRDTHook(() => {
+		const rdtHook = require_rdt_hook.getRDTHook();
 		options.onActive?.();
-		rdtHook._instrumentationSource = options.name ?? BIPPY_INSTRUMENTATION_STRING;
+		rdtHook._instrumentationSource = options.name ?? require_rdt_hook.BIPPY_INSTRUMENTATION_STRING;
 		const prevOnCommitFiberRoot = rdtHook.onCommitFiberRoot;
 		if (options.onCommitFiberRoot) rdtHook.onCommitFiberRoot = (rendererID, root, priority) => {
 			if (prevOnCommitFiberRoot) prevOnCommitFiberRoot(rendererID, root, priority);
@@ -646,7 +496,7 @@ const instrument = (options) => {
 	});
 };
 const getFiberFromHostInstance = (hostInstance) => {
-	const rdtHook = getRDTHook();
+	const rdtHook = require_rdt_hook.getRDTHook();
 	for (const renderer of rdtHook.renderers.values()) try {
 		const fiber = renderer.findFiberByHostInstance?.(hostInstance);
 		if (fiber) return fiber;
@@ -661,16 +511,16 @@ const INSTALL_ERROR = new Error();
 const _fiberRoots = new Set();
 const secure = (options, secureOptions = {}) => {
 	const onActive = options.onActive;
-	const isRDTHookInstalled = hasRDTHook();
-	const isUsingRealReactDevtools = isRealReactDevtools();
-	const isUsingReactRefresh = isReactRefresh();
+	const isRDTHookInstalled = require_rdt_hook.hasRDTHook();
+	const isUsingRealReactDevtools = require_rdt_hook.isRealReactDevtools();
+	const isUsingReactRefresh = require_rdt_hook.isReactRefresh();
 	let timeout;
 	let isProduction = secureOptions.isProduction ?? false;
 	options.onActive = () => {
 		clearTimeout(timeout);
 		let isSecure = true;
 		try {
-			const rdtHook = getRDTHook();
+			const rdtHook = require_rdt_hook.getRDTHook();
 			for (const renderer of rdtHook.renderers.values()) {
 				const [majorVersion] = renderer.version.split(".");
 				if (Number(majorVersion) < (secureOptions.minReactMajorVersion ?? 17)) isSecure = false;
@@ -742,12 +592,6 @@ const onCommitFiberRoot = (handler) => {
 };
 
 //#endregion
-Object.defineProperty(exports, 'BIPPY_INSTRUMENTATION_STRING', {
-  enumerable: true,
-  get: function () {
-    return BIPPY_INSTRUMENTATION_STRING;
-  }
-});
 Object.defineProperty(exports, 'CONCURRENT_MODE_NUMBER', {
   enumerable: true,
   get: function () {
@@ -892,12 +736,6 @@ Object.defineProperty(exports, '_fiberRoots', {
     return _fiberRoots;
   }
 });
-Object.defineProperty(exports, '_renderers', {
-  enumerable: true,
-  get: function () {
-    return _renderers;
-  }
-});
 Object.defineProperty(exports, 'createFiberVisitor', {
   enumerable: true,
   get: function () {
@@ -976,12 +814,6 @@ Object.defineProperty(exports, 'getNearestHostFibers', {
     return getNearestHostFibers;
   }
 });
-Object.defineProperty(exports, 'getRDTHook', {
-  enumerable: true,
-  get: function () {
-    return getRDTHook;
-  }
-});
 Object.defineProperty(exports, 'getTimings', {
   enumerable: true,
   get: function () {
@@ -1000,30 +832,12 @@ Object.defineProperty(exports, 'hasMemoCache', {
     return hasMemoCache;
   }
 });
-Object.defineProperty(exports, 'hasRDTHook', {
-  enumerable: true,
-  get: function () {
-    return hasRDTHook;
-  }
-});
-Object.defineProperty(exports, 'installRDTHook', {
-  enumerable: true,
-  get: function () {
-    return installRDTHook;
-  }
-});
 Object.defineProperty(exports, 'instrument', {
   enumerable: true,
   get: function () {
     return instrument;
   }
 });
-Object.defineProperty(exports, 'isClientEnvironment', {
-  enumerable: true,
-  get: function () {
-    return isClientEnvironment;
-  }
-});
 Object.defineProperty(exports, 'isCompositeFiber', {
   enumerable: true,
   get: function () {
@@ -1042,18 +856,6 @@ Object.defineProperty(exports, 'isInstrumentationActive', {
     return isInstrumentationActive;
   }
 });
-Object.defineProperty(exports, 'isReactRefresh', {
-  enumerable: true,
-  get: function () {
-    return isReactRefresh;
-  }
-});
-Object.defineProperty(exports, 'isRealReactDevtools', {
-  enumerable: true,
-  get: function () {
-    return isRealReactDevtools;
-  }
-});
 Object.defineProperty(exports, 'isValidElement', {
   enumerable: true,
   get: function () {
@@ -1078,18 +880,6 @@ Object.defineProperty(exports, 'onCommitFiberRoot', {
     return onCommitFiberRoot;
   }
 });
-Object.defineProperty(exports, 'patchRDTHook', {
-  enumerable: true,
-  get: function () {
-    return patchRDTHook;
-  }
-});
-Object.defineProperty(exports, 'safelyInstallRDTHook', {
-  enumerable: true,
-  get: function () {
-    return safelyInstallRDTHook;
-  }
-});
 Object.defineProperty(exports, 'secure', {
   enumerable: true,
   get: function () {
@@ -1155,10 +945,4 @@ Object.defineProperty(exports, 'updateFiberRecursively', {
   get: function () {
     return updateFiberRecursively;
   }
-});
-Object.defineProperty(exports, 'version', {
-  enumerable: true,
-  get: function () {
-    return version;
-  }
 });

package/dist/core-D6O33Pnm.d.cts

@@ -0,0 +1,225 @@
+import { ContextDependency, Fiber, FiberRoot, MemoizedState, ReactDevToolsGlobalHook, ReactRenderer } from "./types-B532E9im.cjs";
+import * as React$1 from "react";
+
+//#region src/install-hook-script-string.d.ts
+declare const INSTALL_HOOK_SCRIPT_STRING = "(()=>{try{var t=()=>{};const n=new Map;let o=0;globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__={checkDCE:t,supportsFiber:!0,supportsFlight:!0,hasUnsupportedRendererAttached:!1,renderers:n,onCommitFiberRoot:t,onCommitFiberUnmount:t,onPostCommitFiberRoot:t,inject(t){var e=++o;return n.set(e,t),globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__._instrumentationIsActive=!0,e},_instrumentationIsActive:!1,_script:!0}}catch{}})()";
+
+//#endregion
+//#region src/rdt-hook.d.ts
+declare const version: string | undefined;
+declare const BIPPY_INSTRUMENTATION_STRING: string;
+declare const isRealReactDevtools: (rdtHook?: ReactDevToolsGlobalHook) => boolean;
+declare const isReactRefresh: (rdtHook?: ReactDevToolsGlobalHook) => boolean;
+declare const _renderers: Set<ReactRenderer>;
+declare const installRDTHook: (onActive?: () => unknown) => ReactDevToolsGlobalHook;
+declare const patchRDTHook: (onActive?: () => unknown) => void;
+declare const hasRDTHook: () => boolean;
+/**
+ * Returns the current React DevTools global hook.
+ */
+declare const getRDTHook: (onActive?: () => unknown) => ReactDevToolsGlobalHook;
+declare const isClientEnvironment: () => boolean;
+/**
+ * Usually used purely for side effect
+ */
+declare const safelyInstallRDTHook: () => void;
+
+//#endregion
+//#region src/core.d.ts
+declare const FunctionComponentTag = 0;
+declare const ClassComponentTag = 1;
+declare const HostRootTag = 3;
+declare const HostComponentTag = 5;
+declare const HostTextTag = 6;
+declare const FragmentTag = 7;
+declare const ContextConsumerTag = 9;
+declare const ForwardRefTag = 11;
+declare const SuspenseComponentTag = 13;
+declare const MemoComponentTag = 14;
+declare const SimpleMemoComponentTag = 15;
+declare const DehydratedSuspenseComponentTag = 18;
+declare const OffscreenComponentTag = 22;
+declare const LegacyHiddenComponentTag = 23;
+declare const HostHoistableTag = 26;
+declare const HostSingletonTag = 27;
+declare const CONCURRENT_MODE_NUMBER = 60111;
+declare const ELEMENT_TYPE_SYMBOL_STRING = "Symbol(react.element)";
+declare const TRANSITIONAL_ELEMENT_TYPE_SYMBOL_STRING = "Symbol(react.transitional.element)";
+declare const CONCURRENT_MODE_SYMBOL_STRING = "Symbol(react.concurrent_mode)";
+declare const DEPRECATED_ASYNC_MODE_SYMBOL_STRING = "Symbol(react.async_mode)";
+/**
+ * Returns `true` if object is a React Element.
+ *
+ * @see https://react.dev/reference/react/isValidElement
+ */
+declare const isValidElement: (element: unknown) => element is React$1.ReactElement;
+/**
+ * Returns `true` if object is a React Fiber.
+ */
+declare const isValidFiber: (fiber: unknown) => fiber is Fiber;
+/**
+ * Returns `true` if fiber is a host fiber. Host fibers are DOM nodes in react-dom, `View` in react-native, etc.
+ *
+ * @see https://reactnative.dev/architecture/glossary#host-view-tree-and-host-view
+ */
+declare const isHostFiber: (fiber: Fiber) => boolean;
+/**
+ * Returns `true` if fiber is a composite fiber. Composite fibers are fibers that can render (like functional components, class components, etc.)
+ *
+ * @see https://reactnative.dev/architecture/glossary#react-composite-components
+ */
+declare const isCompositeFiber: (fiber: Fiber) => boolean;
+/**
+ * Traverses up or down a {@link Fiber}'s contexts, return `true` to stop and select the current and previous context value.
+ */
+declare const traverseContexts: (fiber: Fiber, selector: (nextValue: ContextDependency<unknown> | null | undefined, prevValue: ContextDependency<unknown> | null | undefined) => boolean | void) => boolean;
+/**
+ * Traverses up or down a {@link Fiber}'s states, return `true` to stop and select the current and previous state value. This stores both state values and effects.
+ */
+declare const traverseState: (fiber: Fiber, selector: (nextValue: MemoizedState | null | undefined, prevValue: MemoizedState | null | undefined) => boolean | void) => boolean;
+/**
+ * Traverses up or down a {@link Fiber}'s props, return `true` to stop and select the current and previous props value.
+ */
+declare const traverseProps: (fiber: Fiber, selector: (propName: string, nextValue: unknown, prevValue: unknown) => boolean | void) => boolean;
+/**
+ * Returns `true` if the {@link Fiber} has rendered. Note that this does not mean the fiber has rendered in the current commit, just that it has rendered in the past.
+ */
+declare const didFiberRender: (fiber: Fiber) => boolean;
+/**
+ * Returns `true` if the {@link Fiber} has committed. Note that this does not mean the fiber has committed in the current commit, just that it has committed in the past.
+ */
+declare const didFiberCommit: (fiber: Fiber) => boolean;
+/**
+ * Returns all host {@link Fiber}s that have committed and rendered.
+ */
+declare const getMutatedHostFibers: (fiber: Fiber) => Fiber[];
+/**
+ * Returns the stack of {@link Fiber}s from the current fiber to the root fiber.
+ *
+ * @example
+ * ```ts
+ * [fiber, fiber.return, fiber.return.return, ...]
+ * ```
+ */
+declare const getFiberStack: (fiber: Fiber) => Fiber[];
+/**
+ * Returns `true` if the {@link Fiber} should be filtered out during reconciliation.
+ */
+declare const shouldFilterFiber: (fiber: Fiber) => boolean;
+/**
+ * Returns the nearest host {@link Fiber} to the current {@link Fiber}.
+ */
+declare const getNearestHostFiber: (fiber: Fiber, ascending?: boolean) => Fiber | null;
+/**
+ * Returns all host {@link Fiber}s in the tree that are associated with the current {@link Fiber}.
+ */
+declare const getNearestHostFibers: (fiber: Fiber) => Fiber[];
+/**
+ * Traverses up or down a {@link Fiber}, return `true` to stop and select a node.
+ */
+declare const traverseFiber: (fiber: Fiber | null, selector: (node: Fiber) => boolean | void, ascending?: boolean) => Fiber | null;
+/**
+ * Returns the timings of the {@link Fiber}.
+ *
+ * @example
+ * ```ts
+ * const { selfTime, totalTime } = getTimings(fiber);
+ * console.log(selfTime, totalTime);
+ * ```
+ */
+declare const getTimings: (fiber?: Fiber | null | undefined) => {
+  selfTime: number;
+  totalTime: number;
+};
+/**
+ * Returns `true` if the {@link Fiber} uses React Compiler's memo cache.
+ */
+declare const hasMemoCache: (fiber: Fiber) => boolean;
+/**
+ * Returns the type (e.g. component definition) of the {@link Fiber}
+ */
+declare const getType: (type: unknown) => React$1.ComponentType<unknown> | null;
+/**
+ * Returns the display name of the {@link Fiber} type.
+ */
+declare const getDisplayName: (type: unknown) => string | null;
+/**
+ * Returns the build type of the React renderer.
+ */
+declare const detectReactBuildType: (renderer: ReactRenderer) => "development" | "production";
+/**
+ * Returns `true` if bippy's instrumentation is active.
+ */
+declare const isInstrumentationActive: () => boolean;
+/**
+ * Returns the latest fiber (since it may be double-buffered).
+ */
+declare const getLatestFiber: (fiber: Fiber) => Fiber;
+type RenderPhase = 'mount' | 'update' | 'unmount';
+type RenderHandler = <S>(fiber: Fiber, phase: RenderPhase, state?: S) => unknown;
+declare const fiberIdMap: WeakMap<Fiber, number>;
+declare const setFiberId: (fiber: Fiber, id?: number) => void;
+declare const getFiberId: (fiber: Fiber) => number;
+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;
+/**
+ * Creates a fiber visitor function. Must pass a fiber root and a render handler.
+ * @example
+ * traverseRenderedFibers(root, (fiber, phase) => {
+ *   console.log(phase)
+ * })
+ */
+declare const traverseRenderedFibers: (root: FiberRoot, onRender: RenderHandler) => void;
+/**
+ * @deprecated use `traverseRenderedFibers` instead
+ */
+declare const createFiberVisitor: ({
+  onRender
+}: {
+  onRender: RenderHandler;
+  onError: (error: unknown) => unknown;
+}) => (<S>(_rendererID: number, root: FiberRoot | Fiber, _state?: S) => void);
+interface InstrumentationOptions {
+  onCommitFiberRoot?: (rendererID: number, root: FiberRoot, priority: void | number) => unknown;
+  onCommitFiberUnmount?: (rendererID: number, fiber: Fiber) => unknown;
+  onPostCommitFiberRoot?: (rendererID: number, root: FiberRoot) => unknown;
+  onActive?: () => unknown;
+  name?: string;
+}
+/**
+ * Instruments the DevTools hook.
+ * @example
+ * const hook = instrument({
+ *   onActive() {
+ *     console.log('initialized');
+ *   },
+ *   onCommitFiberRoot(rendererID, root) {
+ *     console.log('fiberRoot', root.current)
+ *   },
+ * });
+ */
+declare const instrument: (options: InstrumentationOptions) => ReactDevToolsGlobalHook;
+declare const getFiberFromHostInstance: <T>(hostInstance: T) => Fiber | null;
+declare const INSTALL_ERROR: Error;
+declare const _fiberRoots: Set<any>;
+declare const secure: (options: InstrumentationOptions, secureOptions?: {
+  minReactMajorVersion?: number;
+  dangerouslyRunInProduction?: boolean;
+  onError?: (error?: unknown) => unknown;
+  installCheckTimeout?: number;
+  isProduction?: boolean;
+}) => InstrumentationOptions;
+/**
+ * a wrapper around the {@link instrument} function that sets the `onCommitFiberRoot` hook.
+ *
+ * @example
+ * onCommitFiberRoot((root) => {
+ *   console.log(root.current);
+ * });
+ */
+declare const onCommitFiberRoot: (handler: (root: FiberRoot) => void) => ReactDevToolsGlobalHook;
+
+//#endregion
+export { BIPPY_INSTRUMENTATION_STRING, CONCURRENT_MODE_NUMBER, CONCURRENT_MODE_SYMBOL_STRING, ClassComponentTag, ContextConsumerTag, DEPRECATED_ASYNC_MODE_SYMBOL_STRING, DehydratedSuspenseComponentTag, ELEMENT_TYPE_SYMBOL_STRING, ForwardRefTag, FragmentTag, FunctionComponentTag, HostComponentTag, HostHoistableTag, HostRootTag, HostSingletonTag, HostTextTag, INSTALL_ERROR, INSTALL_HOOK_SCRIPT_STRING, InstrumentationOptions, LegacyHiddenComponentTag, MemoComponentTag, OffscreenComponentTag, RenderHandler, RenderPhase, SimpleMemoComponentTag, SuspenseComponentTag, TRANSITIONAL_ELEMENT_TYPE_SYMBOL_STRING, _fiberRoots, _renderers, createFiberVisitor, detectReactBuildType, didFiberCommit, didFiberRender, fiberIdMap, getDisplayName, getFiberFromHostInstance, getFiberId, getFiberStack, getLatestFiber, getMutatedHostFibers, getNearestHostFiber, getNearestHostFibers, getRDTHook, getTimings, getType, hasMemoCache, hasRDTHook, installRDTHook, instrument, isClientEnvironment, isCompositeFiber, isHostFiber, isInstrumentationActive, isReactRefresh, isRealReactDevtools, isValidElement, isValidFiber, mountFiberRecursively, onCommitFiberRoot, patchRDTHook, safelyInstallRDTHook, secure, setFiberId, shouldFilterFiber, traverseContexts, traverseFiber, traverseProps, traverseRenderedFibers, traverseState, unmountFiber, unmountFiberChildrenRecursively, updateFiberRecursively, version };