react-debug-updates 0.1.0

package/dist/react-debug-updates.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-debug-updates.cjs","sources":["../src/causes.ts","../src/fiber.ts","../src/format.ts","../src/overlay.ts","../src/batcher.ts","../src/logger.ts"],"sourcesContent":["import type { Fiber, HookNode, UpdateCause } from \"./types.js\";\nimport { FiberTag } from \"./fiber.js\";\n\n// ────────────────────────────────────────────\n// Update cause detection\n// ────────────────────────────────────────────\n//\n// For function components, React stores hooks as a linked list on\n// fiber.memoizedState. In dev builds, _debugHookTypes lists hook names\n// in call order. We walk both in parallel, comparing memoizedState\n// on each node to find which hook's state actually changed.\n//\n// Caveat: useContext does NOT create a linked list node, so we skip it\n// when advancing the pointer, and detect it by elimination.\n\n/**\n * Hooks whose memoizedState changing can trigger a re-render.\n * We only report these — useEffect/useMemo/etc. don't cause re-renders.\n */\nconst STATE_HOOKS = new Set([\n  \"useState\",\n  \"useReducer\",\n  \"useSyncExternalStore\",\n]);\n\n/**\n * Hooks that do NOT create a node in the memoizedState linked list.\n * Currently only useContext — every other hook allocates a node.\n */\nconst HOOKS_WITHOUT_NODE = new Set([\"useContext\"]);\n\nexport function detectCauses(fiber: Fiber): UpdateCause[] {\n  const alternate = fiber.alternate;\n  if (!alternate) return [];\n\n  const causes: UpdateCause[] = [];\n\n  // ── Props changed (parent re-rendered us with new props) ──\n  if (fiber.memoizedProps !== alternate.memoizedProps) {\n    causes.push({ kind: \"props\" });\n  }\n\n  // ── Class component ──\n  if (fiber.tag === FiberTag.ClassComponent) {\n    if (fiber.memoizedState !== alternate.memoizedState) {\n      causes.push({ kind: \"class-state\" });\n    }\n    return causes;\n  }\n\n  // ── Function component hooks ──\n  const hookTypes = fiber._debugHookTypes;\n\n  if (!hookTypes) {\n    // No debug info (prod build) — best effort\n    if (fiber.memoizedState !== alternate.memoizedState) {\n      causes.push({ kind: \"unknown\" });\n    }\n    return causes;\n  }\n\n  let currentNode = fiber.memoizedState as HookNode | null;\n  let previousNode = alternate.memoizedState as HookNode | null;\n  let hasContextHook = false;\n  let anyStateHookChanged = false;\n\n  for (let i = 0; i < hookTypes.length; i++) {\n    const type = hookTypes[i];\n\n    // useContext has no linked list node — skip pointer advance\n    if (HOOKS_WITHOUT_NODE.has(type)) {\n      if (type === \"useContext\") hasContextHook = true;\n      continue;\n    }\n\n    if (STATE_HOOKS.has(type) && currentNode && previousNode) {\n      if (!Object.is(currentNode.memoizedState, previousNode.memoizedState)) {\n        anyStateHookChanged = true;\n        causes.push({\n          kind: \"hook\",\n          hookIndex: i,\n          hookType: type,\n          previousValue: previousNode.memoizedState,\n          nextValue: currentNode.memoizedState,\n        });\n      }\n    }\n\n    currentNode = currentNode?.next ?? null;\n    previousNode = previousNode?.next ?? null;\n  }\n\n  // If no state hook changed but component is self-triggered and has\n  // useContext → the context value must have changed.\n  if (\n    hasContextHook &&\n    !anyStateHookChanged &&\n    fiber.memoizedProps === alternate.memoizedProps\n  ) {\n    causes.push({ kind: \"hook\", hookType: \"useContext\" });\n  }\n\n  // If still nothing and self-triggered, mark unknown\n  if (causes.length === 0 && fiber.memoizedProps === alternate.memoizedProps) {\n    causes.push({ kind: \"unknown\" });\n  }\n\n  return causes;\n}\n","import type { Fiber, PendingEntry } from \"./types.js\";\nimport { detectCauses } from \"./causes.js\";\n\n// ────────────────────────────────────────────\n// Fiber tag constants\n// ────────────────────────────────────────────\n\nexport const FiberTag = {\n  FunctionComponent: 0,\n  ClassComponent: 1,\n  HostComponent: 5,\n  ForwardRef: 11,\n  SimpleMemoComponent: 15,\n  MemoComponent: 14,\n} as const;\n\nconst COMPONENT_TAGS = new Set<number>([\n  FiberTag.FunctionComponent,\n  FiberTag.ClassComponent,\n  FiberTag.ForwardRef,\n  FiberTag.SimpleMemoComponent,\n  FiberTag.MemoComponent,\n]);\n\nconst PerformedWork = 0b0000001;\n\n// ────────────────────────────────────────────\n// Fiber tree helpers\n// ────────────────────────────────────────────\n\nexport function getComponentName(fiber: Fiber): string | null {\n  const { type } = fiber;\n  if (!type || typeof type === \"string\") return null;\n  return type.displayName ?? type.name ?? null;\n}\n\nfunction isHTMLElement(value: unknown): value is HTMLElement {\n  return (\n    typeof value === \"object\" &&\n    value !== null &&\n    (value as Node).nodeType === 1 &&\n    typeof (value as HTMLElement).getBoundingClientRect === \"function\"\n  );\n}\n\nexport function findNearestDOMNode(fiber: Fiber): HTMLElement | null {\n  if (fiber.tag === FiberTag.HostComponent && isHTMLElement(fiber.stateNode)) {\n    return fiber.stateNode;\n  }\n  let child: Fiber | null = fiber.child;\n  while (child) {\n    const found = findNearestDOMNode(child);\n    if (found) return found;\n    child = child.sibling;\n  }\n  return null;\n}\n\nexport function getFiberPath(fiber: Fiber, maxDepth = 5): string {\n  const parts: string[] = [];\n  let current: Fiber | null = fiber.return;\n  let depth = 0;\n  while (current && depth < maxDepth) {\n    const name = getComponentName(current);\n    if (name) parts.unshift(name);\n    current = current.return;\n    depth++;\n  }\n  return parts.length ? parts.join(\" → \") : \"(root)\";\n}\n\n// ────────────────────────────────────────────\n// Self-triggered detection\n// ────────────────────────────────────────────\n\nfunction isSelfTriggered(fiber: Fiber): boolean {\n  const alternate = fiber.alternate;\n  if (!alternate) return false;\n  return fiber.memoizedProps === alternate.memoizedProps;\n}\n\n// ────────────────────────────────────────────\n// Collect pending entries from a fiber tree\n// ────────────────────────────────────────────\n\nexport function collectPending(\n  root: Fiber,\n  mode: \"self-triggered\" | \"all\",\n  trackCauses: boolean,\n): PendingEntry[] {\n  const entries: PendingEntry[] = [];\n  const selfTriggeredOnly = mode === \"self-triggered\";\n\n  function walk(fiber: Fiber) {\n    if (\n      COMPONENT_TAGS.has(fiber.tag) &&\n      fiber.flags & PerformedWork &&\n      fiber.alternate !== null &&\n      (!selfTriggeredOnly || isSelfTriggered(fiber))\n    ) {\n      const name = getComponentName(fiber);\n      if (name) {\n        entries.push({\n          component: name,\n          path: getFiberPath(fiber),\n          duration: fiber.actualDuration ?? 0,\n          domNode: findNearestDOMNode(fiber),\n          causes: trackCauses ? detectCauses(fiber) : [],\n        });\n      }\n    }\n    if (fiber.child) walk(fiber.child);\n    if (fiber.sibling) walk(fiber.sibling);\n  }\n\n  walk(root);\n  return entries;\n}\n","import type { UpdateCause } from \"./types.js\";\n\n// ────────────────────────────────────────────\n// Value formatting\n// ────────────────────────────────────────────\n\nexport function formatValue(value: unknown, maxLength = 50): string {\n  if (value === null) return \"null\";\n  if (value === undefined) return \"undefined\";\n  if (typeof value === \"boolean\") return String(value);\n  if (typeof value === \"number\") return String(value);\n  if (typeof value === \"function\")\n    return `ƒ ${(value as { name?: string }).name || \"anonymous\"}`;\n\n  if (typeof value === \"string\") {\n    const truncated =\n      value.length > maxLength ? value.slice(0, maxLength) + \"…\" : value;\n    return JSON.stringify(truncated);\n  }\n\n  if (Array.isArray(value)) return `Array(${value.length})`;\n\n  if (typeof value === \"object\") {\n    const name = (value as object).constructor?.name;\n    if (name && name !== \"Object\") return name;\n    const keys = Object.keys(value as object);\n    if (keys.length <= 3) return `{ ${keys.join(\", \")} }`;\n    return `{ ${keys.slice(0, 3).join(\", \")}, … }`;\n  }\n\n  return String(value);\n}\n\n// ────────────────────────────────────────────\n// Cause formatting\n// ────────────────────────────────────────────\n\n/** Compact summary for overlay labels. */\nexport function formatCausesShort(causes: UpdateCause[]): string {\n  if (causes.length === 0) return \"\";\n\n  const parts: string[] = [];\n  for (const cause of causes) {\n    if (cause.kind === \"props\") {\n      parts.push(\"props\");\n    } else if (cause.kind === \"class-state\") {\n      parts.push(\"state\");\n    } else if (cause.kind === \"hook\" && cause.hookType) {\n      const indexSuffix = cause.hookIndex != null ? `[${cause.hookIndex}]` : \"\";\n      parts.push(`${cause.hookType}${indexSuffix}`);\n    } else {\n      parts.push(\"?\");\n    }\n  }\n\n  return parts.join(\", \");\n}\n\n/** Detailed lines for console output. */\nexport function formatCausesConsole(causes: UpdateCause[]): string[] {\n  const lines: string[] = [];\n\n  for (const cause of causes) {\n    if (cause.kind === \"props\") {\n      lines.push(\"  ↳ props changed (parent re-rendered)\");\n    } else if (cause.kind === \"class-state\") {\n      lines.push(\"  ↳ class state changed\");\n    } else if (cause.kind === \"hook\" && cause.hookType) {\n      const indexSuffix =\n        cause.hookIndex != null ? `[${cause.hookIndex}]` : \"\";\n      const name = `${cause.hookType}${indexSuffix}`;\n\n      if (cause.previousValue !== undefined && cause.nextValue !== undefined) {\n        lines.push(\n          `  ↳ ${name}: ${formatValue(cause.previousValue)} → ${formatValue(cause.nextValue)}`,\n        );\n      } else {\n        lines.push(`  ↳ ${name} changed`);\n      }\n    } else {\n      lines.push(\"  ↳ unknown cause\");\n    }\n  }\n\n  return lines;\n}\n","// ────────────────────────────────────────────\n// Per-window overlay infrastructure\n// ────────────────────────────────────────────\n//\n// Performance:\n//  - Overlay elements pooled per window, reused via animationend\n//  - Single CSS @keyframes per window, no JS timers per element\n\nconst ANIMATION_NAME = \"__rdu-fade\";\n\nconst injectedWindows = new WeakSet<Window>();\n\nfunction ensureStylesheet(win: Window) {\n  if (injectedWindows.has(win)) return;\n  injectedWindows.add(win);\n\n  const style = win.document.createElement(\"style\");\n  style.textContent = `\n    @keyframes ${ANIMATION_NAME} {\n      0%   { opacity: 0; }\n      8%   { opacity: 1; }\n      40%  { opacity: 1; }\n      100% { opacity: 0; }\n    }\n    .${ANIMATION_NAME}-box {\n      position: fixed;\n      pointer-events: none;\n      box-sizing: border-box;\n      border-radius: 3px;\n      opacity: 0;\n      will-change: opacity;\n    }\n    .${ANIMATION_NAME}-label {\n      position: absolute;\n      top: -18px;\n      left: -1px;\n      font: 10px/16px ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, monospace;\n      padding: 0 4px;\n      color: #fff;\n      border-radius: 2px 2px 0 0;\n      white-space: nowrap;\n      pointer-events: none;\n    }\n  `;\n  win.document.head.appendChild(style);\n}\n\n// ────────────────────────────────────────────\n// Overlay root container\n// ────────────────────────────────────────────\n\nconst overlayRoots = new WeakMap<Window, HTMLDivElement>();\n\nfunction getOverlayRoot(win: Window): HTMLDivElement | null {\n  if (win.closed) return null;\n\n  const existing = overlayRoots.get(win);\n  if (existing?.isConnected) return existing;\n\n  ensureStylesheet(win);\n\n  const root = win.document.createElement(\"div\");\n  root.id = \"__react-debug-updates\";\n  Object.assign(root.style, {\n    position: \"fixed\",\n    top: \"0\",\n    left: \"0\",\n    width: \"0\",\n    height: \"0\",\n    overflow: \"visible\",\n    pointerEvents: \"none\",\n    zIndex: \"2147483647\",\n  } satisfies Partial<CSSStyleDeclaration>);\n  win.document.body.appendChild(root);\n\n  overlayRoots.set(win, root);\n  return root;\n}\n\n// ────────────────────────────────────────────\n// Element pool\n// ────────────────────────────────────────────\n\nconst pools = new WeakMap<Window, HTMLDivElement[]>();\n\nexport function acquireOverlay(win: Window): HTMLDivElement | null {\n  const root = getOverlayRoot(win);\n  if (!root) return null;\n\n  let pool = pools.get(win);\n  if (!pool) {\n    pool = [];\n    pools.set(win, pool);\n  }\n\n  const document = win.document;\n  let element = pool.pop();\n\n  if (!element) {\n    element = document.createElement(\"div\");\n    element.className = `${ANIMATION_NAME}-box`;\n\n    const label = document.createElement(\"span\");\n    label.className = `${ANIMATION_NAME}-label`;\n    element.appendChild(label);\n\n    element.addEventListener(\"animationend\", () => {\n      element!.style.animation = \"none\";\n      element!.remove();\n      pool!.push(element!);\n    });\n  }\n\n  root.appendChild(element);\n  return element;\n}\n\nexport function disposeAllOverlays() {\n  const mainRoot = overlayRoots.get(window);\n  mainRoot?.remove();\n  overlayRoots.delete(window);\n  pools.delete(window);\n}\n\nexport const OVERLAY_ANIMATION_NAME = ANIMATION_NAME;\n","import type { HighlightOptions, PendingEntry } from \"./types.js\";\nimport { formatCausesShort } from \"./format.js\";\nimport { acquireOverlay, OVERLAY_ANIMATION_NAME } from \"./overlay.js\";\n\n// ────────────────────────────────────────────\n// Heat color\n// ────────────────────────────────────────────\n\nfunction heatColor(count: number, alpha: number): string {\n  const normalizedCount = Math.min((count - 1) / 7, 1);\n  const hue = 200 - normalizedCount * 200;\n  const saturation = 85 + normalizedCount * 15;\n  const lightness = 55 - normalizedCount * 10;\n  return `hsla(${hue}, ${saturation}%, ${lightness}%, ${alpha})`;\n}\n\n// ────────────────────────────────────────────\n// Batched flush\n// ────────────────────────────────────────────\n//\n// Commit path just pushes lightweight refs (no DOM reads, no formatting).\n// Flush (setInterval): batched rect reads → batched DOM writes.\n\nexport const HIGHLIGHT_DEFAULTS: Required<HighlightOptions> = {\n  flushInterval: 250,\n  animationDuration: 1200,\n  showLabels: true,\n};\n\ninterface CoalescedEntry {\n  count: number;\n  totalDuration: number;\n  component: string;\n  domNode: HTMLElement;\n  ownerWindow: Window;\n  causeSummary: string;\n}\n\nexport function createBatcher(options: Required<HighlightOptions>) {\n  let pending: PendingEntry[] = [];\n  let timer: ReturnType<typeof setInterval> | null = null;\n\n  function flush() {\n    if (pending.length === 0) return;\n\n    const batch = pending;\n    pending = [];\n\n    // Coalesce by DOM node identity\n    const map = new Map<HTMLElement, CoalescedEntry>();\n\n    for (let i = 0; i < batch.length; i++) {\n      const entry = batch[i];\n      if (!entry.domNode) continue;\n\n      const existing = map.get(entry.domNode);\n      if (existing) {\n        existing.count++;\n        existing.totalDuration += entry.duration;\n      } else {\n        const win = entry.domNode.ownerDocument?.defaultView;\n        if (!win || win.closed) continue;\n        map.set(entry.domNode, {\n          count: 1,\n          totalDuration: entry.duration,\n          component: entry.component,\n          domNode: entry.domNode,\n          ownerWindow: win,\n          causeSummary: formatCausesShort(entry.causes),\n        });\n      }\n    }\n\n    // Read phase: batch all rect reads\n    const toShow: Array<{ coalesced: CoalescedEntry; rect: DOMRect }> = [];\n    for (const coalesced of map.values()) {\n      const rect = coalesced.domNode.getBoundingClientRect();\n      if (rect.width > 0 || rect.height > 0) {\n        toShow.push({ coalesced, rect });\n      }\n    }\n\n    // Write phase: position overlays\n    for (let i = 0; i < toShow.length; i++) {\n      const { coalesced, rect } = toShow[i];\n      const element = acquireOverlay(coalesced.ownerWindow);\n      if (!element) continue;\n\n      const fillColor = heatColor(coalesced.count, 0.18);\n      const borderColor = heatColor(coalesced.count, 0.75);\n      const labelBackground = heatColor(coalesced.count, 0.9);\n\n      const style = element.style;\n      style.top = `${rect.top}px`;\n      style.left = `${rect.left}px`;\n      style.width = `${rect.width}px`;\n      style.height = `${rect.height}px`;\n      style.backgroundColor = fillColor;\n      style.border = `1.5px solid ${borderColor}`;\n      style.animation = `${OVERLAY_ANIMATION_NAME} ${options.animationDuration}ms ease-out forwards`;\n\n      const label = element.firstElementChild as HTMLElement;\n      if (options.showLabels) {\n        const countText = coalesced.count > 1 ? ` ×${coalesced.count}` : \"\";\n        const durationText =\n          coalesced.totalDuration > 0\n            ? ` ${coalesced.totalDuration.toFixed(1)}ms`\n            : \"\";\n        const causeText = coalesced.causeSummary\n          ? ` (${coalesced.causeSummary})`\n          : \"\";\n        label.textContent = `${coalesced.component}${countText}${durationText}${causeText}`;\n        label.style.backgroundColor = labelBackground;\n      } else {\n        label.textContent = \"\";\n        label.style.backgroundColor = \"transparent\";\n      }\n    }\n  }\n\n  function push(entry: PendingEntry) {\n    pending.push(entry);\n    if (!timer) {\n      timer = setInterval(flush, options.flushInterval);\n    }\n  }\n\n  function dispose() {\n    if (timer) {\n      clearInterval(timer);\n      timer = null;\n    }\n    pending = [];\n  }\n\n  return { push, dispose };\n}\n","import type {\n  DevToolsHook,\n  FiberRoot,\n  LoggerOptions,\n  RenderEntry,\n  RenderLogger,\n} from \"./types.js\";\nimport { collectPending } from \"./fiber.js\";\nimport { formatCausesConsole } from \"./format.js\";\nimport { HIGHLIGHT_DEFAULTS, createBatcher } from \"./batcher.js\";\nimport { disposeAllOverlays } from \"./overlay.js\";\n\n/**\n * Attach a render logger to React's DevTools hook.\n *\n * Hooks into `__REACT_DEVTOOLS_GLOBAL_HOOK__.onCommitFiberRoot` to intercept\n * every React commit. Records re-render entries, optionally logs them to the\n * console, and optionally shows visual highlight overlays on re-rendered DOM nodes.\n *\n * Returns a `RenderLogger` handle, or `null` if the DevTools hook is not found.\n */\nexport function attachRenderLogger(\n  options: LoggerOptions = {},\n): RenderLogger | null {\n  const {\n    silent = false,\n    bufferSize = 500,\n    filter,\n    highlight = false,\n    mode = \"self-triggered\",\n    showCauses = false,\n  } = options;\n\n  const hook = (\n    window as unknown as { __REACT_DEVTOOLS_GLOBAL_HOOK__?: DevToolsHook }\n  ).__REACT_DEVTOOLS_GLOBAL_HOOK__;\n\n  if (!hook) {\n    console.warn(\n      \"[react-debug-updates] __REACT_DEVTOOLS_GLOBAL_HOOK__ not found. \" +\n        \"Make sure React DevTools or a dev build of React is active.\",\n    );\n    return null;\n  }\n\n  const highlightOptions = highlight\n    ? {\n        ...HIGHLIGHT_DEFAULTS,\n        ...(typeof highlight === \"object\" ? highlight : {}),\n      }\n    : null;\n\n  const batcher = highlightOptions ? createBatcher(highlightOptions) : null;\n\n  const entries: RenderEntry[] = [];\n  const previousOnCommit = hook.onCommitFiberRoot.bind(hook);\n\n  hook.onCommitFiberRoot = (\n    rendererID: number,\n    root: FiberRoot,\n    priorityLevel?: unknown,\n  ) => {\n    previousOnCommit(rendererID, root, priorityLevel);\n\n    const pendingEntries = collectPending(root.current, mode, showCauses);\n\n    for (let i = 0; i < pendingEntries.length; i++) {\n      const pendingEntry = pendingEntries[i];\n\n      const entry: RenderEntry = {\n        component: pendingEntry.component,\n        path: pendingEntry.path,\n        duration: pendingEntry.duration,\n        timestamp: performance.now(),\n        causes: pendingEntry.causes,\n      };\n\n      if (filter && !filter(entry)) continue;\n\n      if (entries.length >= bufferSize) entries.shift();\n      entries.push(entry);\n\n      batcher?.push(pendingEntry);\n    }\n\n    // Console output\n    if (!silent && pendingEntries.length > 0) {\n      console.groupCollapsed(\n        `%c⚛ ${pendingEntries.length} re-render${pendingEntries.length > 1 ? \"s\" : \"\"}`,\n        \"color: #61dafb; font-weight: bold\",\n      );\n\n      for (let i = 0; i < pendingEntries.length; i++) {\n        const pendingEntry = pendingEntries[i];\n        const durationText =\n          pendingEntry.duration > 0\n            ? ` (${pendingEntry.duration.toFixed(2)}ms)`\n            : \"\";\n        console.log(\n          `%c${pendingEntry.component}%c ${pendingEntry.path}${durationText}`,\n          \"color: #e8e82e; font-weight: bold\",\n          \"color: #888\",\n        );\n\n        if (showCauses && pendingEntry.causes.length > 0) {\n          const lines = formatCausesConsole(pendingEntry.causes);\n          for (const line of lines) {\n            console.log(`%c${line}`, \"color: #aaa\");\n          }\n        }\n      }\n\n      console.groupEnd();\n    }\n  };\n\n  const disconnect = () => {\n    hook.onCommitFiberRoot = previousOnCommit;\n    batcher?.dispose();\n    disposeAllOverlays();\n  };\n\n  if (!silent) {\n    console.log(\n      \"%c⚛ react-debug-updates attached\",\n      \"color: #61dafb; font-weight: bold\",\n    );\n  }\n\n  return { entries, disconnect };\n}\n"],"names":[],"mappings":"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"}

package/dist/react-debug-updates.js

@@ -0,0 +1,457 @@
+const STATE_HOOKS = /* @__PURE__ */ new Set([
+  "useState",
+  "useReducer",
+  "useSyncExternalStore"
+]);
+const HOOKS_WITHOUT_NODE = /* @__PURE__ */ new Set(["useContext"]);
+function detectCauses(fiber) {
+  const alternate = fiber.alternate;
+  if (!alternate) return [];
+  const causes = [];
+  if (fiber.memoizedProps !== alternate.memoizedProps) {
+    causes.push({ kind: "props" });
+  }
+  if (fiber.tag === FiberTag.ClassComponent) {
+    if (fiber.memoizedState !== alternate.memoizedState) {
+      causes.push({ kind: "class-state" });
+    }
+    return causes;
+  }
+  const hookTypes = fiber._debugHookTypes;
+  if (!hookTypes) {
+    if (fiber.memoizedState !== alternate.memoizedState) {
+      causes.push({ kind: "unknown" });
+    }
+    return causes;
+  }
+  let currentNode = fiber.memoizedState;
+  let previousNode = alternate.memoizedState;
+  let hasContextHook = false;
+  let anyStateHookChanged = false;
+  for (let i = 0; i < hookTypes.length; i++) {
+    const type = hookTypes[i];
+    if (HOOKS_WITHOUT_NODE.has(type)) {
+      if (type === "useContext") hasContextHook = true;
+      continue;
+    }
+    if (STATE_HOOKS.has(type) && currentNode && previousNode) {
+      if (!Object.is(currentNode.memoizedState, previousNode.memoizedState)) {
+        anyStateHookChanged = true;
+        causes.push({
+          kind: "hook",
+          hookIndex: i,
+          hookType: type,
+          previousValue: previousNode.memoizedState,
+          nextValue: currentNode.memoizedState
+        });
+      }
+    }
+    currentNode = (currentNode == null ? void 0 : currentNode.next) ?? null;
+    previousNode = (previousNode == null ? void 0 : previousNode.next) ?? null;
+  }
+  if (hasContextHook && !anyStateHookChanged && fiber.memoizedProps === alternate.memoizedProps) {
+    causes.push({ kind: "hook", hookType: "useContext" });
+  }
+  if (causes.length === 0 && fiber.memoizedProps === alternate.memoizedProps) {
+    causes.push({ kind: "unknown" });
+  }
+  return causes;
+}
+const FiberTag = {
+  FunctionComponent: 0,
+  ClassComponent: 1,
+  HostComponent: 5,
+  ForwardRef: 11,
+  SimpleMemoComponent: 15,
+  MemoComponent: 14
+};
+const COMPONENT_TAGS = /* @__PURE__ */ new Set([
+  FiberTag.FunctionComponent,
+  FiberTag.ClassComponent,
+  FiberTag.ForwardRef,
+  FiberTag.SimpleMemoComponent,
+  FiberTag.MemoComponent
+]);
+const PerformedWork = 1;
+function getComponentName(fiber) {
+  const { type } = fiber;
+  if (!type || typeof type === "string") return null;
+  return type.displayName ?? type.name ?? null;
+}
+function isHTMLElement(value) {
+  return typeof value === "object" && value !== null && value.nodeType === 1 && typeof value.getBoundingClientRect === "function";
+}
+function findNearestDOMNode(fiber) {
+  if (fiber.tag === FiberTag.HostComponent && isHTMLElement(fiber.stateNode)) {
+    return fiber.stateNode;
+  }
+  let child = fiber.child;
+  while (child) {
+    const found = findNearestDOMNode(child);
+    if (found) return found;
+    child = child.sibling;
+  }
+  return null;
+}
+function getFiberPath(fiber, maxDepth = 5) {
+  const parts = [];
+  let current = fiber.return;
+  let depth = 0;
+  while (current && depth < maxDepth) {
+    const name = getComponentName(current);
+    if (name) parts.unshift(name);
+    current = current.return;
+    depth++;
+  }
+  return parts.length ? parts.join(" → ") : "(root)";
+}
+function isSelfTriggered(fiber) {
+  const alternate = fiber.alternate;
+  if (!alternate) return false;
+  return fiber.memoizedProps === alternate.memoizedProps;
+}
+function collectPending(root, mode, trackCauses) {
+  const entries = [];
+  const selfTriggeredOnly = mode === "self-triggered";
+  function walk(fiber) {
+    if (COMPONENT_TAGS.has(fiber.tag) && fiber.flags & PerformedWork && fiber.alternate !== null && (!selfTriggeredOnly || isSelfTriggered(fiber))) {
+      const name = getComponentName(fiber);
+      if (name) {
+        entries.push({
+          component: name,
+          path: getFiberPath(fiber),
+          duration: fiber.actualDuration ?? 0,
+          domNode: findNearestDOMNode(fiber),
+          causes: trackCauses ? detectCauses(fiber) : []
+        });
+      }
+    }
+    if (fiber.child) walk(fiber.child);
+    if (fiber.sibling) walk(fiber.sibling);
+  }
+  walk(root);
+  return entries;
+}
+function formatValue(value, maxLength = 50) {
+  var _a;
+  if (value === null) return "null";
+  if (value === void 0) return "undefined";
+  if (typeof value === "boolean") return String(value);
+  if (typeof value === "number") return String(value);
+  if (typeof value === "function")
+    return `ƒ ${value.name || "anonymous"}`;
+  if (typeof value === "string") {
+    const truncated = value.length > maxLength ? value.slice(0, maxLength) + "…" : value;
+    return JSON.stringify(truncated);
+  }
+  if (Array.isArray(value)) return `Array(${value.length})`;
+  if (typeof value === "object") {
+    const name = (_a = value.constructor) == null ? void 0 : _a.name;
+    if (name && name !== "Object") return name;
+    const keys = Object.keys(value);
+    if (keys.length <= 3) return `{ ${keys.join(", ")} }`;
+    return `{ ${keys.slice(0, 3).join(", ")}, … }`;
+  }
+  return String(value);
+}
+function formatCausesShort(causes) {
+  if (causes.length === 0) return "";
+  const parts = [];
+  for (const cause of causes) {
+    if (cause.kind === "props") {
+      parts.push("props");
+    } else if (cause.kind === "class-state") {
+      parts.push("state");
+    } else if (cause.kind === "hook" && cause.hookType) {
+      const indexSuffix = cause.hookIndex != null ? `[${cause.hookIndex}]` : "";
+      parts.push(`${cause.hookType}${indexSuffix}`);
+    } else {
+      parts.push("?");
+    }
+  }
+  return parts.join(", ");
+}
+function formatCausesConsole(causes) {
+  const lines = [];
+  for (const cause of causes) {
+    if (cause.kind === "props") {
+      lines.push("  ↳ props changed (parent re-rendered)");
+    } else if (cause.kind === "class-state") {
+      lines.push("  ↳ class state changed");
+    } else if (cause.kind === "hook" && cause.hookType) {
+      const indexSuffix = cause.hookIndex != null ? `[${cause.hookIndex}]` : "";
+      const name = `${cause.hookType}${indexSuffix}`;
+      if (cause.previousValue !== void 0 && cause.nextValue !== void 0) {
+        lines.push(
+          `  ↳ ${name}: ${formatValue(cause.previousValue)} → ${formatValue(cause.nextValue)}`
+        );
+      } else {
+        lines.push(`  ↳ ${name} changed`);
+      }
+    } else {
+      lines.push("  ↳ unknown cause");
+    }
+  }
+  return lines;
+}
+const ANIMATION_NAME = "__rdu-fade";
+const injectedWindows = /* @__PURE__ */ new WeakSet();
+function ensureStylesheet(win) {
+  if (injectedWindows.has(win)) return;
+  injectedWindows.add(win);
+  const style = win.document.createElement("style");
+  style.textContent = `
+    @keyframes ${ANIMATION_NAME} {
+      0%   { opacity: 0; }
+      8%   { opacity: 1; }
+      40%  { opacity: 1; }
+      100% { opacity: 0; }
+    }
+    .${ANIMATION_NAME}-box {
+      position: fixed;
+      pointer-events: none;
+      box-sizing: border-box;
+      border-radius: 3px;
+      opacity: 0;
+      will-change: opacity;
+    }
+    .${ANIMATION_NAME}-label {
+      position: absolute;
+      top: -18px;
+      left: -1px;
+      font: 10px/16px ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+      padding: 0 4px;
+      color: #fff;
+      border-radius: 2px 2px 0 0;
+      white-space: nowrap;
+      pointer-events: none;
+    }
+  `;
+  win.document.head.appendChild(style);
+}
+const overlayRoots = /* @__PURE__ */ new WeakMap();
+function getOverlayRoot(win) {
+  if (win.closed) return null;
+  const existing = overlayRoots.get(win);
+  if (existing == null ? void 0 : existing.isConnected) return existing;
+  ensureStylesheet(win);
+  const root = win.document.createElement("div");
+  root.id = "__react-debug-updates";
+  Object.assign(root.style, {
+    position: "fixed",
+    top: "0",
+    left: "0",
+    width: "0",
+    height: "0",
+    overflow: "visible",
+    pointerEvents: "none",
+    zIndex: "2147483647"
+  });
+  win.document.body.appendChild(root);
+  overlayRoots.set(win, root);
+  return root;
+}
+const pools = /* @__PURE__ */ new WeakMap();
+function acquireOverlay(win) {
+  const root = getOverlayRoot(win);
+  if (!root) return null;
+  let pool = pools.get(win);
+  if (!pool) {
+    pool = [];
+    pools.set(win, pool);
+  }
+  const document = win.document;
+  let element = pool.pop();
+  if (!element) {
+    element = document.createElement("div");
+    element.className = `${ANIMATION_NAME}-box`;
+    const label = document.createElement("span");
+    label.className = `${ANIMATION_NAME}-label`;
+    element.appendChild(label);
+    element.addEventListener("animationend", () => {
+      element.style.animation = "none";
+      element.remove();
+      pool.push(element);
+    });
+  }
+  root.appendChild(element);
+  return element;
+}
+function disposeAllOverlays() {
+  const mainRoot = overlayRoots.get(window);
+  mainRoot == null ? void 0 : mainRoot.remove();
+  overlayRoots.delete(window);
+  pools.delete(window);
+}
+const OVERLAY_ANIMATION_NAME = ANIMATION_NAME;
+function heatColor(count, alpha) {
+  const normalizedCount = Math.min((count - 1) / 7, 1);
+  const hue = 200 - normalizedCount * 200;
+  const saturation = 85 + normalizedCount * 15;
+  const lightness = 55 - normalizedCount * 10;
+  return `hsla(${hue}, ${saturation}%, ${lightness}%, ${alpha})`;
+}
+const HIGHLIGHT_DEFAULTS = {
+  flushInterval: 250,
+  animationDuration: 1200,
+  showLabels: true
+};
+function createBatcher(options) {
+  let pending = [];
+  let timer = null;
+  function flush() {
+    var _a;
+    if (pending.length === 0) return;
+    const batch = pending;
+    pending = [];
+    const map = /* @__PURE__ */ new Map();
+    for (let i = 0; i < batch.length; i++) {
+      const entry = batch[i];
+      if (!entry.domNode) continue;
+      const existing = map.get(entry.domNode);
+      if (existing) {
+        existing.count++;
+        existing.totalDuration += entry.duration;
+      } else {
+        const win = (_a = entry.domNode.ownerDocument) == null ? void 0 : _a.defaultView;
+        if (!win || win.closed) continue;
+        map.set(entry.domNode, {
+          count: 1,
+          totalDuration: entry.duration,
+          component: entry.component,
+          domNode: entry.domNode,
+          ownerWindow: win,
+          causeSummary: formatCausesShort(entry.causes)
+        });
+      }
+    }
+    const toShow = [];
+    for (const coalesced of map.values()) {
+      const rect = coalesced.domNode.getBoundingClientRect();
+      if (rect.width > 0 || rect.height > 0) {
+        toShow.push({ coalesced, rect });
+      }
+    }
+    for (let i = 0; i < toShow.length; i++) {
+      const { coalesced, rect } = toShow[i];
+      const element = acquireOverlay(coalesced.ownerWindow);
+      if (!element) continue;
+      const fillColor = heatColor(coalesced.count, 0.18);
+      const borderColor = heatColor(coalesced.count, 0.75);
+      const labelBackground = heatColor(coalesced.count, 0.9);
+      const style = element.style;
+      style.top = `${rect.top}px`;
+      style.left = `${rect.left}px`;
+      style.width = `${rect.width}px`;
+      style.height = `${rect.height}px`;
+      style.backgroundColor = fillColor;
+      style.border = `1.5px solid ${borderColor}`;
+      style.animation = `${OVERLAY_ANIMATION_NAME} ${options.animationDuration}ms ease-out forwards`;
+      const label = element.firstElementChild;
+      if (options.showLabels) {
+        const countText = coalesced.count > 1 ? ` ×${coalesced.count}` : "";
+        const durationText = coalesced.totalDuration > 0 ? ` ${coalesced.totalDuration.toFixed(1)}ms` : "";
+        const causeText = coalesced.causeSummary ? ` (${coalesced.causeSummary})` : "";
+        label.textContent = `${coalesced.component}${countText}${durationText}${causeText}`;
+        label.style.backgroundColor = labelBackground;
+      } else {
+        label.textContent = "";
+        label.style.backgroundColor = "transparent";
+      }
+    }
+  }
+  function push(entry) {
+    pending.push(entry);
+    if (!timer) {
+      timer = setInterval(flush, options.flushInterval);
+    }
+  }
+  function dispose() {
+    if (timer) {
+      clearInterval(timer);
+      timer = null;
+    }
+    pending = [];
+  }
+  return { push, dispose };
+}
+function attachRenderLogger(options = {}) {
+  const {
+    silent = false,
+    bufferSize = 500,
+    filter,
+    highlight = false,
+    mode = "self-triggered",
+    showCauses = false
+  } = options;
+  const hook = window.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+  if (!hook) {
+    console.warn(
+      "[react-debug-updates] __REACT_DEVTOOLS_GLOBAL_HOOK__ not found. Make sure React DevTools or a dev build of React is active."
+    );
+    return null;
+  }
+  const highlightOptions = highlight ? {
+    ...HIGHLIGHT_DEFAULTS,
+    ...typeof highlight === "object" ? highlight : {}
+  } : null;
+  const batcher = highlightOptions ? createBatcher(highlightOptions) : null;
+  const entries = [];
+  const previousOnCommit = hook.onCommitFiberRoot.bind(hook);
+  hook.onCommitFiberRoot = (rendererID, root, priorityLevel) => {
+    previousOnCommit(rendererID, root, priorityLevel);
+    const pendingEntries = collectPending(root.current, mode, showCauses);
+    for (let i = 0; i < pendingEntries.length; i++) {
+      const pendingEntry = pendingEntries[i];
+      const entry = {
+        component: pendingEntry.component,
+        path: pendingEntry.path,
+        duration: pendingEntry.duration,
+        timestamp: performance.now(),
+        causes: pendingEntry.causes
+      };
+      if (filter && !filter(entry)) continue;
+      if (entries.length >= bufferSize) entries.shift();
+      entries.push(entry);
+      batcher == null ? void 0 : batcher.push(pendingEntry);
+    }
+    if (!silent && pendingEntries.length > 0) {
+      console.groupCollapsed(
+        `%c⚛ ${pendingEntries.length} re-render${pendingEntries.length > 1 ? "s" : ""}`,
+        "color: #61dafb; font-weight: bold"
+      );
+      for (let i = 0; i < pendingEntries.length; i++) {
+        const pendingEntry = pendingEntries[i];
+        const durationText = pendingEntry.duration > 0 ? ` (${pendingEntry.duration.toFixed(2)}ms)` : "";
+        console.log(
+          `%c${pendingEntry.component}%c ${pendingEntry.path}${durationText}`,
+          "color: #e8e82e; font-weight: bold",
+          "color: #888"
+        );
+        if (showCauses && pendingEntry.causes.length > 0) {
+          const lines = formatCausesConsole(pendingEntry.causes);
+          for (const line of lines) {
+            console.log(`%c${line}`, "color: #aaa");
+          }
+        }
+      }
+      console.groupEnd();
+    }
+  };
+  const disconnect = () => {
+    hook.onCommitFiberRoot = previousOnCommit;
+    batcher == null ? void 0 : batcher.dispose();
+    disposeAllOverlays();
+  };
+  if (!silent) {
+    console.log(
+      "%c⚛ react-debug-updates attached",
+      "color: #61dafb; font-weight: bold"
+    );
+  }
+  return { entries, disconnect };
+}
+export {
+  attachRenderLogger
+};
+//# sourceMappingURL=react-debug-updates.js.map

package/dist/react-debug-updates.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-debug-updates.js","sources":["../src/causes.ts","../src/fiber.ts","../src/format.ts","../src/overlay.ts","../src/batcher.ts","../src/logger.ts"],"sourcesContent":["import type { Fiber, HookNode, UpdateCause } from \"./types.js\";\nimport { FiberTag } from \"./fiber.js\";\n\n// ────────────────────────────────────────────\n// Update cause detection\n// ────────────────────────────────────────────\n//\n// For function components, React stores hooks as a linked list on\n// fiber.memoizedState. In dev builds, _debugHookTypes lists hook names\n// in call order. We walk both in parallel, comparing memoizedState\n// on each node to find which hook's state actually changed.\n//\n// Caveat: useContext does NOT create a linked list node, so we skip it\n// when advancing the pointer, and detect it by elimination.\n\n/**\n * Hooks whose memoizedState changing can trigger a re-render.\n * We only report these — useEffect/useMemo/etc. don't cause re-renders.\n */\nconst STATE_HOOKS = new Set([\n  \"useState\",\n  \"useReducer\",\n  \"useSyncExternalStore\",\n]);\n\n/**\n * Hooks that do NOT create a node in the memoizedState linked list.\n * Currently only useContext — every other hook allocates a node.\n */\nconst HOOKS_WITHOUT_NODE = new Set([\"useContext\"]);\n\nexport function detectCauses(fiber: Fiber): UpdateCause[] {\n  const alternate = fiber.alternate;\n  if (!alternate) return [];\n\n  const causes: UpdateCause[] = [];\n\n  // ── Props changed (parent re-rendered us with new props) ──\n  if (fiber.memoizedProps !== alternate.memoizedProps) {\n    causes.push({ kind: \"props\" });\n  }\n\n  // ── Class component ──\n  if (fiber.tag === FiberTag.ClassComponent) {\n    if (fiber.memoizedState !== alternate.memoizedState) {\n      causes.push({ kind: \"class-state\" });\n    }\n    return causes;\n  }\n\n  // ── Function component hooks ──\n  const hookTypes = fiber._debugHookTypes;\n\n  if (!hookTypes) {\n    // No debug info (prod build) — best effort\n    if (fiber.memoizedState !== alternate.memoizedState) {\n      causes.push({ kind: \"unknown\" });\n    }\n    return causes;\n  }\n\n  let currentNode = fiber.memoizedState as HookNode | null;\n  let previousNode = alternate.memoizedState as HookNode | null;\n  let hasContextHook = false;\n  let anyStateHookChanged = false;\n\n  for (let i = 0; i < hookTypes.length; i++) {\n    const type = hookTypes[i];\n\n    // useContext has no linked list node — skip pointer advance\n    if (HOOKS_WITHOUT_NODE.has(type)) {\n      if (type === \"useContext\") hasContextHook = true;\n      continue;\n    }\n\n    if (STATE_HOOKS.has(type) && currentNode && previousNode) {\n      if (!Object.is(currentNode.memoizedState, previousNode.memoizedState)) {\n        anyStateHookChanged = true;\n        causes.push({\n          kind: \"hook\",\n          hookIndex: i,\n          hookType: type,\n          previousValue: previousNode.memoizedState,\n          nextValue: currentNode.memoizedState,\n        });\n      }\n    }\n\n    currentNode = currentNode?.next ?? null;\n    previousNode = previousNode?.next ?? null;\n  }\n\n  // If no state hook changed but component is self-triggered and has\n  // useContext → the context value must have changed.\n  if (\n    hasContextHook &&\n    !anyStateHookChanged &&\n    fiber.memoizedProps === alternate.memoizedProps\n  ) {\n    causes.push({ kind: \"hook\", hookType: \"useContext\" });\n  }\n\n  // If still nothing and self-triggered, mark unknown\n  if (causes.length === 0 && fiber.memoizedProps === alternate.memoizedProps) {\n    causes.push({ kind: \"unknown\" });\n  }\n\n  return causes;\n}\n","import type { Fiber, PendingEntry } from \"./types.js\";\nimport { detectCauses } from \"./causes.js\";\n\n// ────────────────────────────────────────────\n// Fiber tag constants\n// ────────────────────────────────────────────\n\nexport const FiberTag = {\n  FunctionComponent: 0,\n  ClassComponent: 1,\n  HostComponent: 5,\n  ForwardRef: 11,\n  SimpleMemoComponent: 15,\n  MemoComponent: 14,\n} as const;\n\nconst COMPONENT_TAGS = new Set<number>([\n  FiberTag.FunctionComponent,\n  FiberTag.ClassComponent,\n  FiberTag.ForwardRef,\n  FiberTag.SimpleMemoComponent,\n  FiberTag.MemoComponent,\n]);\n\nconst PerformedWork = 0b0000001;\n\n// ────────────────────────────────────────────\n// Fiber tree helpers\n// ────────────────────────────────────────────\n\nexport function getComponentName(fiber: Fiber): string | null {\n  const { type } = fiber;\n  if (!type || typeof type === \"string\") return null;\n  return type.displayName ?? type.name ?? null;\n}\n\nfunction isHTMLElement(value: unknown): value is HTMLElement {\n  return (\n    typeof value === \"object\" &&\n    value !== null &&\n    (value as Node).nodeType === 1 &&\n    typeof (value as HTMLElement).getBoundingClientRect === \"function\"\n  );\n}\n\nexport function findNearestDOMNode(fiber: Fiber): HTMLElement | null {\n  if (fiber.tag === FiberTag.HostComponent && isHTMLElement(fiber.stateNode)) {\n    return fiber.stateNode;\n  }\n  let child: Fiber | null = fiber.child;\n  while (child) {\n    const found = findNearestDOMNode(child);\n    if (found) return found;\n    child = child.sibling;\n  }\n  return null;\n}\n\nexport function getFiberPath(fiber: Fiber, maxDepth = 5): string {\n  const parts: string[] = [];\n  let current: Fiber | null = fiber.return;\n  let depth = 0;\n  while (current && depth < maxDepth) {\n    const name = getComponentName(current);\n    if (name) parts.unshift(name);\n    current = current.return;\n    depth++;\n  }\n  return parts.length ? parts.join(\" → \") : \"(root)\";\n}\n\n// ────────────────────────────────────────────\n// Self-triggered detection\n// ────────────────────────────────────────────\n\nfunction isSelfTriggered(fiber: Fiber): boolean {\n  const alternate = fiber.alternate;\n  if (!alternate) return false;\n  return fiber.memoizedProps === alternate.memoizedProps;\n}\n\n// ────────────────────────────────────────────\n// Collect pending entries from a fiber tree\n// ────────────────────────────────────────────\n\nexport function collectPending(\n  root: Fiber,\n  mode: \"self-triggered\" | \"all\",\n  trackCauses: boolean,\n): PendingEntry[] {\n  const entries: PendingEntry[] = [];\n  const selfTriggeredOnly = mode === \"self-triggered\";\n\n  function walk(fiber: Fiber) {\n    if (\n      COMPONENT_TAGS.has(fiber.tag) &&\n      fiber.flags & PerformedWork &&\n      fiber.alternate !== null &&\n      (!selfTriggeredOnly || isSelfTriggered(fiber))\n    ) {\n      const name = getComponentName(fiber);\n      if (name) {\n        entries.push({\n          component: name,\n          path: getFiberPath(fiber),\n          duration: fiber.actualDuration ?? 0,\n          domNode: findNearestDOMNode(fiber),\n          causes: trackCauses ? detectCauses(fiber) : [],\n        });\n      }\n    }\n    if (fiber.child) walk(fiber.child);\n    if (fiber.sibling) walk(fiber.sibling);\n  }\n\n  walk(root);\n  return entries;\n}\n","import type { UpdateCause } from \"./types.js\";\n\n// ────────────────────────────────────────────\n// Value formatting\n// ────────────────────────────────────────────\n\nexport function formatValue(value: unknown, maxLength = 50): string {\n  if (value === null) return \"null\";\n  if (value === undefined) return \"undefined\";\n  if (typeof value === \"boolean\") return String(value);\n  if (typeof value === \"number\") return String(value);\n  if (typeof value === \"function\")\n    return `ƒ ${(value as { name?: string }).name || \"anonymous\"}`;\n\n  if (typeof value === \"string\") {\n    const truncated =\n      value.length > maxLength ? value.slice(0, maxLength) + \"…\" : value;\n    return JSON.stringify(truncated);\n  }\n\n  if (Array.isArray(value)) return `Array(${value.length})`;\n\n  if (typeof value === \"object\") {\n    const name = (value as object).constructor?.name;\n    if (name && name !== \"Object\") return name;\n    const keys = Object.keys(value as object);\n    if (keys.length <= 3) return `{ ${keys.join(\", \")} }`;\n    return `{ ${keys.slice(0, 3).join(\", \")}, … }`;\n  }\n\n  return String(value);\n}\n\n// ────────────────────────────────────────────\n// Cause formatting\n// ────────────────────────────────────────────\n\n/** Compact summary for overlay labels. */\nexport function formatCausesShort(causes: UpdateCause[]): string {\n  if (causes.length === 0) return \"\";\n\n  const parts: string[] = [];\n  for (const cause of causes) {\n    if (cause.kind === \"props\") {\n      parts.push(\"props\");\n    } else if (cause.kind === \"class-state\") {\n      parts.push(\"state\");\n    } else if (cause.kind === \"hook\" && cause.hookType) {\n      const indexSuffix = cause.hookIndex != null ? `[${cause.hookIndex}]` : \"\";\n      parts.push(`${cause.hookType}${indexSuffix}`);\n    } else {\n      parts.push(\"?\");\n    }\n  }\n\n  return parts.join(\", \");\n}\n\n/** Detailed lines for console output. */\nexport function formatCausesConsole(causes: UpdateCause[]): string[] {\n  const lines: string[] = [];\n\n  for (const cause of causes) {\n    if (cause.kind === \"props\") {\n      lines.push(\"  ↳ props changed (parent re-rendered)\");\n    } else if (cause.kind === \"class-state\") {\n      lines.push(\"  ↳ class state changed\");\n    } else if (cause.kind === \"hook\" && cause.hookType) {\n      const indexSuffix =\n        cause.hookIndex != null ? `[${cause.hookIndex}]` : \"\";\n      const name = `${cause.hookType}${indexSuffix}`;\n\n      if (cause.previousValue !== undefined && cause.nextValue !== undefined) {\n        lines.push(\n          `  ↳ ${name}: ${formatValue(cause.previousValue)} → ${formatValue(cause.nextValue)}`,\n        );\n      } else {\n        lines.push(`  ↳ ${name} changed`);\n      }\n    } else {\n      lines.push(\"  ↳ unknown cause\");\n    }\n  }\n\n  return lines;\n}\n","// ────────────────────────────────────────────\n// Per-window overlay infrastructure\n// ────────────────────────────────────────────\n//\n// Performance:\n//  - Overlay elements pooled per window, reused via animationend\n//  - Single CSS @keyframes per window, no JS timers per element\n\nconst ANIMATION_NAME = \"__rdu-fade\";\n\nconst injectedWindows = new WeakSet<Window>();\n\nfunction ensureStylesheet(win: Window) {\n  if (injectedWindows.has(win)) return;\n  injectedWindows.add(win);\n\n  const style = win.document.createElement(\"style\");\n  style.textContent = `\n    @keyframes ${ANIMATION_NAME} {\n      0%   { opacity: 0; }\n      8%   { opacity: 1; }\n      40%  { opacity: 1; }\n      100% { opacity: 0; }\n    }\n    .${ANIMATION_NAME}-box {\n      position: fixed;\n      pointer-events: none;\n      box-sizing: border-box;\n      border-radius: 3px;\n      opacity: 0;\n      will-change: opacity;\n    }\n    .${ANIMATION_NAME}-label {\n      position: absolute;\n      top: -18px;\n      left: -1px;\n      font: 10px/16px ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, monospace;\n      padding: 0 4px;\n      color: #fff;\n      border-radius: 2px 2px 0 0;\n      white-space: nowrap;\n      pointer-events: none;\n    }\n  `;\n  win.document.head.appendChild(style);\n}\n\n// ────────────────────────────────────────────\n// Overlay root container\n// ────────────────────────────────────────────\n\nconst overlayRoots = new WeakMap<Window, HTMLDivElement>();\n\nfunction getOverlayRoot(win: Window): HTMLDivElement | null {\n  if (win.closed) return null;\n\n  const existing = overlayRoots.get(win);\n  if (existing?.isConnected) return existing;\n\n  ensureStylesheet(win);\n\n  const root = win.document.createElement(\"div\");\n  root.id = \"__react-debug-updates\";\n  Object.assign(root.style, {\n    position: \"fixed\",\n    top: \"0\",\n    left: \"0\",\n    width: \"0\",\n    height: \"0\",\n    overflow: \"visible\",\n    pointerEvents: \"none\",\n    zIndex: \"2147483647\",\n  } satisfies Partial<CSSStyleDeclaration>);\n  win.document.body.appendChild(root);\n\n  overlayRoots.set(win, root);\n  return root;\n}\n\n// ────────────────────────────────────────────\n// Element pool\n// ────────────────────────────────────────────\n\nconst pools = new WeakMap<Window, HTMLDivElement[]>();\n\nexport function acquireOverlay(win: Window): HTMLDivElement | null {\n  const root = getOverlayRoot(win);\n  if (!root) return null;\n\n  let pool = pools.get(win);\n  if (!pool) {\n    pool = [];\n    pools.set(win, pool);\n  }\n\n  const document = win.document;\n  let element = pool.pop();\n\n  if (!element) {\n    element = document.createElement(\"div\");\n    element.className = `${ANIMATION_NAME}-box`;\n\n    const label = document.createElement(\"span\");\n    label.className = `${ANIMATION_NAME}-label`;\n    element.appendChild(label);\n\n    element.addEventListener(\"animationend\", () => {\n      element!.style.animation = \"none\";\n      element!.remove();\n      pool!.push(element!);\n    });\n  }\n\n  root.appendChild(element);\n  return element;\n}\n\nexport function disposeAllOverlays() {\n  const mainRoot = overlayRoots.get(window);\n  mainRoot?.remove();\n  overlayRoots.delete(window);\n  pools.delete(window);\n}\n\nexport const OVERLAY_ANIMATION_NAME = ANIMATION_NAME;\n","import type { HighlightOptions, PendingEntry } from \"./types.js\";\nimport { formatCausesShort } from \"./format.js\";\nimport { acquireOverlay, OVERLAY_ANIMATION_NAME } from \"./overlay.js\";\n\n// ────────────────────────────────────────────\n// Heat color\n// ────────────────────────────────────────────\n\nfunction heatColor(count: number, alpha: number): string {\n  const normalizedCount = Math.min((count - 1) / 7, 1);\n  const hue = 200 - normalizedCount * 200;\n  const saturation = 85 + normalizedCount * 15;\n  const lightness = 55 - normalizedCount * 10;\n  return `hsla(${hue}, ${saturation}%, ${lightness}%, ${alpha})`;\n}\n\n// ────────────────────────────────────────────\n// Batched flush\n// ────────────────────────────────────────────\n//\n// Commit path just pushes lightweight refs (no DOM reads, no formatting).\n// Flush (setInterval): batched rect reads → batched DOM writes.\n\nexport const HIGHLIGHT_DEFAULTS: Required<HighlightOptions> = {\n  flushInterval: 250,\n  animationDuration: 1200,\n  showLabels: true,\n};\n\ninterface CoalescedEntry {\n  count: number;\n  totalDuration: number;\n  component: string;\n  domNode: HTMLElement;\n  ownerWindow: Window;\n  causeSummary: string;\n}\n\nexport function createBatcher(options: Required<HighlightOptions>) {\n  let pending: PendingEntry[] = [];\n  let timer: ReturnType<typeof setInterval> | null = null;\n\n  function flush() {\n    if (pending.length === 0) return;\n\n    const batch = pending;\n    pending = [];\n\n    // Coalesce by DOM node identity\n    const map = new Map<HTMLElement, CoalescedEntry>();\n\n    for (let i = 0; i < batch.length; i++) {\n      const entry = batch[i];\n      if (!entry.domNode) continue;\n\n      const existing = map.get(entry.domNode);\n      if (existing) {\n        existing.count++;\n        existing.totalDuration += entry.duration;\n      } else {\n        const win = entry.domNode.ownerDocument?.defaultView;\n        if (!win || win.closed) continue;\n        map.set(entry.domNode, {\n          count: 1,\n          totalDuration: entry.duration,\n          component: entry.component,\n          domNode: entry.domNode,\n          ownerWindow: win,\n          causeSummary: formatCausesShort(entry.causes),\n        });\n      }\n    }\n\n    // Read phase: batch all rect reads\n    const toShow: Array<{ coalesced: CoalescedEntry; rect: DOMRect }> = [];\n    for (const coalesced of map.values()) {\n      const rect = coalesced.domNode.getBoundingClientRect();\n      if (rect.width > 0 || rect.height > 0) {\n        toShow.push({ coalesced, rect });\n      }\n    }\n\n    // Write phase: position overlays\n    for (let i = 0; i < toShow.length; i++) {\n      const { coalesced, rect } = toShow[i];\n      const element = acquireOverlay(coalesced.ownerWindow);\n      if (!element) continue;\n\n      const fillColor = heatColor(coalesced.count, 0.18);\n      const borderColor = heatColor(coalesced.count, 0.75);\n      const labelBackground = heatColor(coalesced.count, 0.9);\n\n      const style = element.style;\n      style.top = `${rect.top}px`;\n      style.left = `${rect.left}px`;\n      style.width = `${rect.width}px`;\n      style.height = `${rect.height}px`;\n      style.backgroundColor = fillColor;\n      style.border = `1.5px solid ${borderColor}`;\n      style.animation = `${OVERLAY_ANIMATION_NAME} ${options.animationDuration}ms ease-out forwards`;\n\n      const label = element.firstElementChild as HTMLElement;\n      if (options.showLabels) {\n        const countText = coalesced.count > 1 ? ` ×${coalesced.count}` : \"\";\n        const durationText =\n          coalesced.totalDuration > 0\n            ? ` ${coalesced.totalDuration.toFixed(1)}ms`\n            : \"\";\n        const causeText = coalesced.causeSummary\n          ? ` (${coalesced.causeSummary})`\n          : \"\";\n        label.textContent = `${coalesced.component}${countText}${durationText}${causeText}`;\n        label.style.backgroundColor = labelBackground;\n      } else {\n        label.textContent = \"\";\n        label.style.backgroundColor = \"transparent\";\n      }\n    }\n  }\n\n  function push(entry: PendingEntry) {\n    pending.push(entry);\n    if (!timer) {\n      timer = setInterval(flush, options.flushInterval);\n    }\n  }\n\n  function dispose() {\n    if (timer) {\n      clearInterval(timer);\n      timer = null;\n    }\n    pending = [];\n  }\n\n  return { push, dispose };\n}\n","import type {\n  DevToolsHook,\n  FiberRoot,\n  LoggerOptions,\n  RenderEntry,\n  RenderLogger,\n} from \"./types.js\";\nimport { collectPending } from \"./fiber.js\";\nimport { formatCausesConsole } from \"./format.js\";\nimport { HIGHLIGHT_DEFAULTS, createBatcher } from \"./batcher.js\";\nimport { disposeAllOverlays } from \"./overlay.js\";\n\n/**\n * Attach a render logger to React's DevTools hook.\n *\n * Hooks into `__REACT_DEVTOOLS_GLOBAL_HOOK__.onCommitFiberRoot` to intercept\n * every React commit. Records re-render entries, optionally logs them to the\n * console, and optionally shows visual highlight overlays on re-rendered DOM nodes.\n *\n * Returns a `RenderLogger` handle, or `null` if the DevTools hook is not found.\n */\nexport function attachRenderLogger(\n  options: LoggerOptions = {},\n): RenderLogger | null {\n  const {\n    silent = false,\n    bufferSize = 500,\n    filter,\n    highlight = false,\n    mode = \"self-triggered\",\n    showCauses = false,\n  } = options;\n\n  const hook = (\n    window as unknown as { __REACT_DEVTOOLS_GLOBAL_HOOK__?: DevToolsHook }\n  ).__REACT_DEVTOOLS_GLOBAL_HOOK__;\n\n  if (!hook) {\n    console.warn(\n      \"[react-debug-updates] __REACT_DEVTOOLS_GLOBAL_HOOK__ not found. \" +\n        \"Make sure React DevTools or a dev build of React is active.\",\n    );\n    return null;\n  }\n\n  const highlightOptions = highlight\n    ? {\n        ...HIGHLIGHT_DEFAULTS,\n        ...(typeof highlight === \"object\" ? highlight : {}),\n      }\n    : null;\n\n  const batcher = highlightOptions ? createBatcher(highlightOptions) : null;\n\n  const entries: RenderEntry[] = [];\n  const previousOnCommit = hook.onCommitFiberRoot.bind(hook);\n\n  hook.onCommitFiberRoot = (\n    rendererID: number,\n    root: FiberRoot,\n    priorityLevel?: unknown,\n  ) => {\n    previousOnCommit(rendererID, root, priorityLevel);\n\n    const pendingEntries = collectPending(root.current, mode, showCauses);\n\n    for (let i = 0; i < pendingEntries.length; i++) {\n      const pendingEntry = pendingEntries[i];\n\n      const entry: RenderEntry = {\n        component: pendingEntry.component,\n        path: pendingEntry.path,\n        duration: pendingEntry.duration,\n        timestamp: performance.now(),\n        causes: pendingEntry.causes,\n      };\n\n      if (filter && !filter(entry)) continue;\n\n      if (entries.length >= bufferSize) entries.shift();\n      entries.push(entry);\n\n      batcher?.push(pendingEntry);\n    }\n\n    // Console output\n    if (!silent && pendingEntries.length > 0) {\n      console.groupCollapsed(\n        `%c⚛ ${pendingEntries.length} re-render${pendingEntries.length > 1 ? \"s\" : \"\"}`,\n        \"color: #61dafb; font-weight: bold\",\n      );\n\n      for (let i = 0; i < pendingEntries.length; i++) {\n        const pendingEntry = pendingEntries[i];\n        const durationText =\n          pendingEntry.duration > 0\n            ? ` (${pendingEntry.duration.toFixed(2)}ms)`\n            : \"\";\n        console.log(\n          `%c${pendingEntry.component}%c ${pendingEntry.path}${durationText}`,\n          \"color: #e8e82e; font-weight: bold\",\n          \"color: #888\",\n        );\n\n        if (showCauses && pendingEntry.causes.length > 0) {\n          const lines = formatCausesConsole(pendingEntry.causes);\n          for (const line of lines) {\n            console.log(`%c${line}`, \"color: #aaa\");\n          }\n        }\n      }\n\n      console.groupEnd();\n    }\n  };\n\n  const disconnect = () => {\n    hook.onCommitFiberRoot = previousOnCommit;\n    batcher?.dispose();\n    disposeAllOverlays();\n  };\n\n  if (!silent) {\n    console.log(\n      \"%c⚛ react-debug-updates attached\",\n      \"color: #61dafb; font-weight: bold\",\n    );\n  }\n\n  return { entries, disconnect };\n}\n"],"names":[],"mappings":"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"}