@osdk/react-devtools 0.5.0

package/build/esm/inspector/hooks/useAnimatedBounds.js

@@ -0,0 +1,167 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from "react";
+import { DEFAULT_CONVERGENCE_THRESHOLD, interpolate, INTERPOLATION_FACTORS } from "../utils/interpolation.js";
+class AnimationBoundsStore {
+  current = null;
+  animationFrameId = null;
+  listeners = new Set();
+  hasRenderedOnce = false;
+  constructor(targetBounds, interpolationFactor, convergenceThreshold, enabled) {
+    this.targetBounds = targetBounds;
+    this.interpolationFactor = interpolationFactor;
+    this.convergenceThreshold = convergenceThreshold;
+    this.enabled = enabled;
+    this.current = {
+      x: targetBounds.x,
+      y: targetBounds.y,
+      width: targetBounds.width,
+      height: targetBounds.height
+    };
+    this.hasRenderedOnce = true;
+    if (enabled) {
+      this.startAnimation();
+    }
+  }
+  subscribe = onStoreChange => {
+    this.listeners.add(onStoreChange);
+    return () => {
+      this.listeners.delete(onStoreChange);
+    };
+  };
+  getSnapshot = () => {
+    return this.current;
+  };
+  updateTarget(targetBounds, interpolationFactor, convergenceThreshold, enabled) {
+    this.targetBounds = targetBounds;
+    this.interpolationFactor = interpolationFactor;
+    this.convergenceThreshold = convergenceThreshold;
+    this.enabled = enabled;
+    if (!this.hasRenderedOnce || !enabled) {
+      this.cancelAnimation();
+      this.current = {
+        x: targetBounds.x,
+        y: targetBounds.y,
+        width: targetBounds.width,
+        height: targetBounds.height
+      };
+      this.hasRenderedOnce = true;
+      this.notify();
+      return;
+    }
+    this.cancelAnimation();
+    this.startAnimation();
+  }
+  dispose() {
+    this.cancelAnimation();
+    this.listeners.clear();
+  }
+  startAnimation() {
+    const animate = () => {
+      const targetX = this.targetBounds.x;
+      const targetY = this.targetBounds.y;
+      const targetWidth = this.targetBounds.width;
+      const targetHeight = this.targetBounds.height;
+      if (!this.current) {
+        this.current = {
+          x: targetX,
+          y: targetY,
+          width: targetWidth,
+          height: targetHeight
+        };
+        this.animationFrameId = null;
+        this.notify();
+        return;
+      }
+      const nextX = interpolate(this.current.x, targetX, this.interpolationFactor);
+      const nextY = interpolate(this.current.y, targetY, this.interpolationFactor);
+      const nextWidth = interpolate(this.current.width, targetWidth, this.interpolationFactor);
+      const nextHeight = interpolate(this.current.height, targetHeight, this.interpolationFactor);
+      const hasConverged = Math.abs(nextX - targetX) < this.convergenceThreshold && Math.abs(nextY - targetY) < this.convergenceThreshold && Math.abs(nextWidth - targetWidth) < this.convergenceThreshold && Math.abs(nextHeight - targetHeight) < this.convergenceThreshold;
+      if (hasConverged) {
+        this.current = {
+          x: targetX,
+          y: targetY,
+          width: targetWidth,
+          height: targetHeight
+        };
+        this.animationFrameId = null;
+      } else {
+        this.current = {
+          x: nextX,
+          y: nextY,
+          width: nextWidth,
+          height: nextHeight
+        };
+        this.animationFrameId = requestAnimationFrame(animate);
+      }
+      this.notify();
+    };
+    this.animationFrameId = requestAnimationFrame(animate);
+  }
+  cancelAnimation() {
+    if (this.animationFrameId != null) {
+      cancelAnimationFrame(this.animationFrameId);
+      this.animationFrameId = null;
+    }
+  }
+  notify() {
+    for (const listener of this.listeners) {
+      listener();
+    }
+  }
+}
+export function useAnimatedBounds(targetBounds, options = {}) {
+  const {
+    interpolationFactor = INTERPOLATION_FACTORS.selection,
+    convergenceThreshold = DEFAULT_CONVERGENCE_THRESHOLD,
+    enabled = true
+  } = options;
+  const storeRef = React.useRef(null);
+  if (targetBounds) {
+    if (storeRef.current) {
+      storeRef.current.updateTarget(targetBounds, interpolationFactor, convergenceThreshold, enabled);
+    } else {
+      storeRef.current = new AnimationBoundsStore(targetBounds, interpolationFactor, convergenceThreshold, enabled);
+    }
+  } else {
+    if (storeRef.current) {
+      storeRef.current.dispose();
+      storeRef.current = null;
+    }
+  }
+
+  // Deps use `targetBounds == null` (boolean) so callbacks only change when
+  // transitioning between null/non-null, not on every bounds update.
+  // The store handles internal updates via its own subscription mechanism.
+  const subscribe = React.useCallback(onStoreChange => {
+    const store = storeRef.current;
+    if (!store) {
+      return () => {};
+    }
+    return store.subscribe(onStoreChange);
+  }, [targetBounds == null]);
+  const getSnapshot = React.useCallback(() => {
+    const store = storeRef.current;
+    if (!store) {
+      return null;
+    }
+    return store.getSnapshot();
+  }, [targetBounds == null]);
+  return React.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+}
+//# sourceMappingURL=useAnimatedBounds.js.map

package/build/esm/inspector/hooks/useAnimatedBounds.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnimatedBounds.js","names":["React","DEFAULT_CONVERGENCE_THRESHOLD","interpolate","INTERPOLATION_FACTORS","AnimationBoundsStore","current","animationFrameId","listeners","Set","hasRenderedOnce","constructor","targetBounds","interpolationFactor","convergenceThreshold","enabled","x","y","width","height","startAnimation","subscribe","onStoreChange","add","delete","getSnapshot","updateTarget","cancelAnimation","notify","dispose","clear","animate","targetX","targetY","targetWidth","targetHeight","nextX","nextY","nextWidth","nextHeight","hasConverged","Math","abs","requestAnimationFrame","cancelAnimationFrame","listener","useAnimatedBounds","options","selection","storeRef","useRef","useCallback","store","useSyncExternalStore"],"sources":["useAnimatedBounds.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from \"react\";\nimport type {\n  AnimatedBounds,\n  AnimationOptions,\n  OverlayBounds,\n} from \"../types.js\";\nimport {\n  DEFAULT_CONVERGENCE_THRESHOLD,\n  interpolate,\n  INTERPOLATION_FACTORS,\n} from \"../utils/interpolation.js\";\n\nclass AnimationBoundsStore {\n  private current: AnimatedBounds | null = null;\n  private animationFrameId: number | null = null;\n  private listeners: Set<() => void> = new Set();\n  private hasRenderedOnce = false;\n\n  constructor(\n    private targetBounds: OverlayBounds,\n    private interpolationFactor: number,\n    private convergenceThreshold: number,\n    private enabled: boolean,\n  ) {\n    this.current = {\n      x: targetBounds.x,\n      y: targetBounds.y,\n      width: targetBounds.width,\n      height: targetBounds.height,\n    };\n    this.hasRenderedOnce = true;\n\n    if (enabled) {\n      this.startAnimation();\n    }\n  }\n\n  subscribe = (onStoreChange: () => void): () => void => {\n    this.listeners.add(onStoreChange);\n    return () => {\n      this.listeners.delete(onStoreChange);\n    };\n  };\n\n  getSnapshot = (): AnimatedBounds | null => {\n    return this.current;\n  };\n\n  updateTarget(\n    targetBounds: OverlayBounds,\n    interpolationFactor: number,\n    convergenceThreshold: number,\n    enabled: boolean,\n  ): void {\n    this.targetBounds = targetBounds;\n    this.interpolationFactor = interpolationFactor;\n    this.convergenceThreshold = convergenceThreshold;\n    this.enabled = enabled;\n\n    if (!this.hasRenderedOnce || !enabled) {\n      this.cancelAnimation();\n      this.current = {\n        x: targetBounds.x,\n        y: targetBounds.y,\n        width: targetBounds.width,\n        height: targetBounds.height,\n      };\n      this.hasRenderedOnce = true;\n      this.notify();\n      return;\n    }\n\n    this.cancelAnimation();\n    this.startAnimation();\n  }\n\n  dispose(): void {\n    this.cancelAnimation();\n    this.listeners.clear();\n  }\n\n  private startAnimation(): void {\n    const animate = () => {\n      const targetX = this.targetBounds.x;\n      const targetY = this.targetBounds.y;\n      const targetWidth = this.targetBounds.width;\n      const targetHeight = this.targetBounds.height;\n\n      if (!this.current) {\n        this.current = {\n          x: targetX,\n          y: targetY,\n          width: targetWidth,\n          height: targetHeight,\n        };\n        this.animationFrameId = null;\n        this.notify();\n        return;\n      }\n\n      const nextX = interpolate(\n        this.current.x,\n        targetX,\n        this.interpolationFactor,\n      );\n      const nextY = interpolate(\n        this.current.y,\n        targetY,\n        this.interpolationFactor,\n      );\n      const nextWidth = interpolate(\n        this.current.width,\n        targetWidth,\n        this.interpolationFactor,\n      );\n      const nextHeight = interpolate(\n        this.current.height,\n        targetHeight,\n        this.interpolationFactor,\n      );\n\n      const hasConverged = Math.abs(nextX - targetX) < this.convergenceThreshold\n        && Math.abs(nextY - targetY) < this.convergenceThreshold\n        && Math.abs(nextWidth - targetWidth) < this.convergenceThreshold\n        && Math.abs(nextHeight - targetHeight) < this.convergenceThreshold;\n\n      if (hasConverged) {\n        this.current = {\n          x: targetX,\n          y: targetY,\n          width: targetWidth,\n          height: targetHeight,\n        };\n        this.animationFrameId = null;\n      } else {\n        this.current = {\n          x: nextX,\n          y: nextY,\n          width: nextWidth,\n          height: nextHeight,\n        };\n        this.animationFrameId = requestAnimationFrame(animate);\n      }\n      this.notify();\n    };\n\n    this.animationFrameId = requestAnimationFrame(animate);\n  }\n\n  private cancelAnimation(): void {\n    if (this.animationFrameId != null) {\n      cancelAnimationFrame(this.animationFrameId);\n      this.animationFrameId = null;\n    }\n  }\n\n  private notify(): void {\n    for (const listener of this.listeners) {\n      listener();\n    }\n  }\n}\n\nexport function useAnimatedBounds(\n  targetBounds: OverlayBounds | null,\n  options: AnimationOptions = {},\n): AnimatedBounds | null {\n  const {\n    interpolationFactor = INTERPOLATION_FACTORS.selection,\n    convergenceThreshold = DEFAULT_CONVERGENCE_THRESHOLD,\n    enabled = true,\n  } = options;\n\n  const storeRef = React.useRef<AnimationBoundsStore | null>(null);\n\n  if (targetBounds) {\n    if (storeRef.current) {\n      storeRef.current.updateTarget(\n        targetBounds,\n        interpolationFactor,\n        convergenceThreshold,\n        enabled,\n      );\n    } else {\n      storeRef.current = new AnimationBoundsStore(\n        targetBounds,\n        interpolationFactor,\n        convergenceThreshold,\n        enabled,\n      );\n    }\n  } else {\n    if (storeRef.current) {\n      storeRef.current.dispose();\n      storeRef.current = null;\n    }\n  }\n\n  // Deps use `targetBounds == null` (boolean) so callbacks only change when\n  // transitioning between null/non-null, not on every bounds update.\n  // The store handles internal updates via its own subscription mechanism.\n  const subscribe = React.useCallback((onStoreChange: () => void) => {\n    const store = storeRef.current;\n    if (!store) {\n      return () => {};\n    }\n    return store.subscribe(onStoreChange);\n  }, [targetBounds == null]);\n\n  const getSnapshot = React.useCallback((): AnimatedBounds | null => {\n    const store = storeRef.current;\n    if (!store) {\n      return null;\n    }\n    return store.getSnapshot();\n  }, [targetBounds == null]);\n\n  return React.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/esm/inspector/index.js

@@ -0,0 +1,40 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// Types
+
+// Components
+export { ComponentLabel } from "./components/ComponentLabel.js";
+export { InspectorBanner } from "./components/InspectorBanner.js";
+export { InspectorOverlay } from "./components/InspectorOverlay.js";
+export { SelectionHighlight } from "./components/SelectionHighlight.js";
+
+// Hooks
+export { useAnimatedBounds } from "./hooks/useAnimatedBounds.js";
+
+// Controller
+export { createInspectorController } from "./inspectorController.js";
+
+// Orchestrator
+export { ClickToInspectSystem } from "./ClickToInspectSystem.js";
+// Factory
+export { createClickToInspect } from "./createClickToInspect.js";
+
+// Utilities
+export { createElementBounds, getElementAtPosition } from "./utils/elementBounds.js";
+export { DEFAULT_CONVERGENCE_THRESHOLD, interpolate, INTERPOLATION_FACTORS } from "./utils/interpolation.js";
+export { computeLabelPosition, OFFSCREEN_POSITION } from "./utils/labelPositioning.js";
+//# sourceMappingURL=index.js.map

package/build/esm/inspector/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ComponentLabel","InspectorBanner","InspectorOverlay","SelectionHighlight","useAnimatedBounds","createInspectorController","ClickToInspectSystem","createClickToInspect","createElementBounds","getElementAtPosition","DEFAULT_CONVERGENCE_THRESHOLD","interpolate","INTERPOLATION_FACTORS","computeLabelPosition","OFFSCREEN_POSITION"],"sources":["index.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Types\nexport type {\n  AnimatedBounds,\n  AnimationOptions,\n  ComponentLabelProps,\n  HighlightVariant,\n  InspectedComponent,\n  InspectorController,\n  InspectorEventHandlers,\n  InspectorMode,\n  InspectorOptions,\n  InspectorOverlayProps,\n  InspectorState,\n  LabelPosition,\n  OverlayBounds,\n  SelectionHighlightProps,\n  SelectionLabelStatus,\n} from \"./types.js\";\n\n// Components\nexport { ComponentLabel } from \"./components/ComponentLabel.js\";\nexport { InspectorBanner } from \"./components/InspectorBanner.js\";\nexport { InspectorOverlay } from \"./components/InspectorOverlay.js\";\nexport { SelectionHighlight } from \"./components/SelectionHighlight.js\";\n\n// Hooks\nexport { useAnimatedBounds } from \"./hooks/useAnimatedBounds.js\";\n\n// Controller\nexport { createInspectorController } from \"./inspectorController.js\";\n\n// Orchestrator\nexport { ClickToInspectSystem } from \"./ClickToInspectSystem.js\";\nexport type { ClickToInspectOptions } from \"./ClickToInspectSystem.js\";\n\n// Factory\nexport { createClickToInspect } from \"./createClickToInspect.js\";\n\n// Utilities\nexport {\n  createElementBounds,\n  getElementAtPosition,\n} from \"./utils/elementBounds.js\";\nexport {\n  DEFAULT_CONVERGENCE_THRESHOLD,\n  interpolate,\n  INTERPOLATION_FACTORS,\n} from \"./utils/interpolation.js\";\nexport {\n  computeLabelPosition,\n  OFFSCREEN_POSITION,\n} from \"./utils/labelPositioning.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAmBA;AACA,SAASA,cAAc,QAAQ,gCAAgC;AAC/D,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,gBAAgB,QAAQ,kCAAkC;AACnE,SAASC,kBAAkB,QAAQ,oCAAoC;;AAEvE;AACA,SAASC,iBAAiB,QAAQ,8BAA8B;;AAEhE;AACA,SAASC,yBAAyB,QAAQ,0BAA0B;;AAEpE;AACA,SAASC,oBAAoB,QAAQ,2BAA2B;AAGhE;AACA,SAASC,oBAAoB,QAAQ,2BAA2B;;AAEhE;AACA,SACEC,mBAAmB,EACnBC,oBAAoB,QACf,0BAA0B;AACjC,SACEC,6BAA6B,EAC7BC,WAAW,EACXC,qBAAqB,QAChB,0BAA0B;AACjC,SACEC,oBAAoB,EACpBC,kBAAkB,QACb,6BAA6B","ignoreList":[]}

package/build/esm/inspector/inspectorController.js

@@ -0,0 +1,328 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { getFiberFromElement } from "../fiber/FiberAccess.js";
+import { getComponentName, getHookStates, getProps, getSourceLocation } from "../fiber/FiberInspection.js";
+import { isUserComponent } from "../fiber/FiberTags.js";
+import { findParentComponent } from "../fiber/traverseFiber.js";
+import { createElementBounds, getElementAtPosition } from "./utils/elementBounds.js";
+const OFFSCREEN_POSITION = -9999;
+const DEFAULT_THROTTLE_MS = 32;
+const DEFAULT_BOUNDS_REFRESH_INTERVAL_MS = 100;
+function createInitialState() {
+  return {
+    mode: "inactive",
+    mouseX: OFFSCREEN_POSITION,
+    mouseY: OFFSCREEN_POSITION,
+    hoveredElement: null,
+    selectedElement: null,
+    frozenElement: null,
+    inspectedComponent: null,
+    selectionBounds: null,
+    labelPosition: null,
+    labelStatus: "idle",
+    viewportVersion: 0
+  };
+}
+function extractComponentInfo(element, fiber) {
+  const name = getComponentName(fiber);
+  if (!name) {
+    return null;
+  }
+  const sourceLocation = getSourceLocation(fiber);
+  const props = getProps(fiber);
+  const hookStates = getHookStates(fiber);
+  return {
+    name,
+    fiber: new WeakRef(fiber),
+    element: new WeakRef(element),
+    sourceLocation,
+    props,
+    hookCount: hookStates.length
+  };
+}
+export function createInspectorController(options = {}) {
+  const {
+    containerElement = document.body,
+    throttleMs = DEFAULT_THROTTLE_MS,
+    boundsRefreshIntervalMs = DEFAULT_BOUNDS_REFRESH_INTERVAL_MS,
+    eventHandlers = {}
+  } = options;
+  let state = createInitialState();
+  const listeners = new Set();
+  let lastElementDetectionTime = 0;
+  let boundsRefreshIntervalId = null;
+  let abortController = null;
+  function setState(partial) {
+    state = {
+      ...state,
+      ...partial
+    };
+    listeners.forEach(listener => listener(state));
+  }
+  function handleMouseMove(event) {
+    if (state.mode === "inactive" || state.mode === "frozen") {
+      return;
+    }
+    const {
+      clientX,
+      clientY
+    } = event;
+    setState({
+      mouseX: clientX,
+      mouseY: clientY
+    });
+    const now = performance.now();
+    if (now - lastElementDetectionTime < throttleMs) {
+      return;
+    }
+    lastElementDetectionTime = now;
+    detectElementAtPosition(clientX, clientY);
+  }
+  function detectElementAtPosition(clientX, clientY) {
+    const element = getElementAtPosition(clientX, clientY, "[data-osdk-devtools-ignore]");
+    if (!element) {
+      setState({
+        hoveredElement: null,
+        inspectedComponent: null,
+        selectionBounds: null,
+        labelStatus: "idle"
+      });
+      eventHandlers.onHover?.(null);
+      return;
+    }
+    if (element === state.hoveredElement) {
+      return;
+    }
+    const fiber = getFiberFromElement(element);
+    if (!fiber) {
+      setState({
+        hoveredElement: element,
+        inspectedComponent: null,
+        selectionBounds: createElementBounds(element),
+        labelStatus: "idle"
+      });
+      eventHandlers.onHover?.(null);
+      return;
+    }
+    const componentFiber = isUserComponent(fiber) ? fiber : findParentComponent(fiber);
+    if (!componentFiber) {
+      setState({
+        hoveredElement: element,
+        inspectedComponent: null,
+        selectionBounds: createElementBounds(element),
+        labelStatus: "idle"
+      });
+      eventHandlers.onHover?.(null);
+      return;
+    }
+    const componentInfo = extractComponentInfo(element, componentFiber);
+    setState({
+      hoveredElement: element,
+      inspectedComponent: componentInfo,
+      selectionBounds: createElementBounds(element),
+      labelStatus: "hover"
+    });
+    if (componentInfo) {
+      eventHandlers.onHover?.(componentInfo);
+    }
+  }
+  function handleClick(event) {
+    if (state.mode === "inactive") {
+      return;
+    }
+    const target = event.target;
+    if (target.closest("[data-osdk-devtools-ignore]")) {
+      return;
+    }
+    event.preventDefault();
+    event.stopImmediatePropagation();
+    if (state.mode === "frozen") {
+      setState({
+        mode: "hover",
+        frozenElement: null,
+        labelStatus: "hover"
+      });
+      return;
+    }
+    if (state.hoveredElement && state.inspectedComponent) {
+      setState({
+        mode: "frozen",
+        frozenElement: state.hoveredElement,
+        selectedElement: state.hoveredElement,
+        labelStatus: "selected"
+      });
+      eventHandlers.onSelect?.(state.inspectedComponent);
+    }
+  }
+  function handleKeyDown(event) {
+    if (state.mode === "inactive") {
+      return;
+    }
+    if (event.key === "Escape") {
+      event.preventDefault();
+      event.stopImmediatePropagation();
+      if (state.mode === "frozen") {
+        setState({
+          mode: "hover",
+          frozenElement: null,
+          labelStatus: "hover"
+        });
+      } else {
+        deactivate();
+      }
+    }
+  }
+  function handleScroll() {
+    if (state.mode === "inactive") {
+      return;
+    }
+    setState({
+      viewportVersion: state.viewportVersion + 1
+    });
+    recalculateBounds();
+  }
+  function handleResize() {
+    if (state.mode === "inactive") {
+      return;
+    }
+    setState({
+      viewportVersion: state.viewportVersion + 1
+    });
+    recalculateBounds();
+  }
+  function recalculateBounds() {
+    const element = state.frozenElement ?? state.hoveredElement;
+    if (!element || !document.contains(element)) {
+      setState({
+        hoveredElement: null,
+        frozenElement: null,
+        inspectedComponent: null,
+        selectionBounds: null,
+        labelStatus: "idle"
+      });
+      return;
+    }
+    setState({
+      selectionBounds: createElementBounds(element)
+    });
+  }
+  function startBoundsRefreshInterval() {
+    if (boundsRefreshIntervalId) {
+      return;
+    }
+    boundsRefreshIntervalId = setInterval(recalculateBounds, boundsRefreshIntervalMs);
+  }
+  function stopBoundsRefreshInterval() {
+    if (boundsRefreshIntervalId) {
+      clearInterval(boundsRefreshIntervalId);
+      boundsRefreshIntervalId = null;
+    }
+  }
+  function attachEventListeners() {
+    abortController = new AbortController();
+    const {
+      signal
+    } = abortController;
+    containerElement.addEventListener("mousemove", handleMouseMove, {
+      signal,
+      passive: true
+    });
+    containerElement.addEventListener("click", handleClick, {
+      signal,
+      capture: true
+    });
+    document.addEventListener("keydown", handleKeyDown, {
+      signal,
+      capture: true
+    });
+    window.addEventListener("scroll", handleScroll, {
+      signal,
+      passive: true
+    });
+    window.addEventListener("resize", handleResize, {
+      signal,
+      passive: true
+    });
+  }
+  function detachEventListeners() {
+    if (abortController) {
+      abortController.abort();
+      abortController = null;
+    }
+  }
+  function deactivate() {
+    if (state.mode === "inactive") {
+      return;
+    }
+    detachEventListeners();
+    stopBoundsRefreshInterval();
+    setState(createInitialState());
+    eventHandlers.onDeactivate?.();
+  }
+  function freeze() {
+    if (state.mode !== "hover" || !state.hoveredElement) {
+      return;
+    }
+    setState({
+      mode: "frozen",
+      frozenElement: state.hoveredElement,
+      selectedElement: state.hoveredElement,
+      labelStatus: "selected"
+    });
+    if (state.inspectedComponent) {
+      eventHandlers.onSelect?.(state.inspectedComponent);
+    }
+  }
+  function getState() {
+    return state;
+  }
+  return {
+    activate: function activate() {
+      if (state.mode !== "inactive") {
+        return;
+      }
+      setState({
+        mode: "hover"
+      });
+      attachEventListeners();
+      startBoundsRefreshInterval();
+      eventHandlers.onActivate?.();
+    },
+    deactivate,
+    freeze,
+    unfreeze: function unfreeze() {
+      if (state.mode !== "frozen") {
+        return;
+      }
+      setState({
+        mode: "hover",
+        frozenElement: null,
+        labelStatus: "hover"
+      });
+    },
+    getState,
+    subscribe: function subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    destroy: function destroy() {
+      deactivate();
+      listeners.clear();
+    }
+  };
+}
+//# sourceMappingURL=inspectorController.js.map

package/build/esm/inspector/inspectorController.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspectorController.js","names":["getFiberFromElement","getComponentName","getHookStates","getProps","getSourceLocation","isUserComponent","findParentComponent","createElementBounds","getElementAtPosition","OFFSCREEN_POSITION","DEFAULT_THROTTLE_MS","DEFAULT_BOUNDS_REFRESH_INTERVAL_MS","createInitialState","mode","mouseX","mouseY","hoveredElement","selectedElement","frozenElement","inspectedComponent","selectionBounds","labelPosition","labelStatus","viewportVersion","extractComponentInfo","element","fiber","name","sourceLocation","props","hookStates","WeakRef","hookCount","length","createInspectorController","options","containerElement","document","body","throttleMs","boundsRefreshIntervalMs","eventHandlers","state","listeners","Set","lastElementDetectionTime","boundsRefreshIntervalId","abortController","setState","partial","forEach","listener","handleMouseMove","event","clientX","clientY","now","performance","detectElementAtPosition","onHover","componentFiber","componentInfo","handleClick","target","closest","preventDefault","stopImmediatePropagation","onSelect","handleKeyDown","key","deactivate","handleScroll","recalculateBounds","handleResize","contains","startBoundsRefreshInterval","setInterval","stopBoundsRefreshInterval","clearInterval","attachEventListeners","AbortController","signal","addEventListener","passive","capture","window","detachEventListeners","abort","onDeactivate","freeze","getState","activate","onActivate","unfreeze","subscribe","add","delete","destroy","clear"],"sources":["inspectorController.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { getFiberFromElement } from \"../fiber/FiberAccess.js\";\nimport {\n  getComponentName,\n  getHookStates,\n  getProps,\n  getSourceLocation,\n} from \"../fiber/FiberInspection.js\";\nimport { isUserComponent } from \"../fiber/FiberTags.js\";\nimport { findParentComponent } from \"../fiber/traverseFiber.js\";\nimport type { Fiber } from \"../fiber/types.js\";\nimport type {\n  InspectedComponent,\n  InspectorController,\n  InspectorOptions,\n  InspectorState,\n} from \"./types.js\";\nimport {\n  createElementBounds,\n  getElementAtPosition,\n} from \"./utils/elementBounds.js\";\n\nconst OFFSCREEN_POSITION = -9999;\nconst DEFAULT_THROTTLE_MS = 32;\nconst DEFAULT_BOUNDS_REFRESH_INTERVAL_MS = 100;\n\nfunction createInitialState(): InspectorState {\n  return {\n    mode: \"inactive\",\n    mouseX: OFFSCREEN_POSITION,\n    mouseY: OFFSCREEN_POSITION,\n    hoveredElement: null,\n    selectedElement: null,\n    frozenElement: null,\n    inspectedComponent: null,\n    selectionBounds: null,\n    labelPosition: null,\n    labelStatus: \"idle\",\n    viewportVersion: 0,\n  };\n}\n\nfunction extractComponentInfo(\n  element: Element,\n  fiber: Fiber,\n): InspectedComponent | null {\n  const name = getComponentName(fiber);\n  if (!name) {\n    return null;\n  }\n\n  const sourceLocation = getSourceLocation(fiber);\n  const props = getProps(fiber);\n  const hookStates = getHookStates(fiber);\n\n  return {\n    name,\n    fiber: new WeakRef(fiber),\n    element: new WeakRef(element),\n    sourceLocation,\n    props,\n    hookCount: hookStates.length,\n  };\n}\n\nexport function createInspectorController(\n  options: InspectorOptions = {},\n): InspectorController {\n  const {\n    containerElement = document.body,\n    throttleMs = DEFAULT_THROTTLE_MS,\n    boundsRefreshIntervalMs = DEFAULT_BOUNDS_REFRESH_INTERVAL_MS,\n    eventHandlers = {},\n  } = options;\n\n  let state = createInitialState();\n  const listeners = new Set<(state: InspectorState) => void>();\n  let lastElementDetectionTime = 0;\n  let boundsRefreshIntervalId: ReturnType<typeof setInterval> | null = null;\n  let abortController: AbortController | null = null;\n\n  function setState(partial: Partial<InspectorState>): void {\n    state = { ...state, ...partial };\n    listeners.forEach((listener) => listener(state));\n  }\n\n  function handleMouseMove(event: MouseEvent): void {\n    if (state.mode === \"inactive\" || state.mode === \"frozen\") {\n      return;\n    }\n\n    const { clientX, clientY } = event;\n    setState({ mouseX: clientX, mouseY: clientY });\n\n    const now = performance.now();\n    if (now - lastElementDetectionTime < throttleMs) {\n      return;\n    }\n    lastElementDetectionTime = now;\n\n    detectElementAtPosition(clientX, clientY);\n  }\n\n  function detectElementAtPosition(clientX: number, clientY: number): void {\n    const element = getElementAtPosition(\n      clientX,\n      clientY,\n      \"[data-osdk-devtools-ignore]\",\n    );\n\n    if (!element) {\n      setState({\n        hoveredElement: null,\n        inspectedComponent: null,\n        selectionBounds: null,\n        labelStatus: \"idle\",\n      });\n      eventHandlers.onHover?.(null);\n      return;\n    }\n\n    if (element === state.hoveredElement) {\n      return;\n    }\n\n    const fiber = getFiberFromElement(element);\n    if (!fiber) {\n      setState({\n        hoveredElement: element,\n        inspectedComponent: null,\n        selectionBounds: createElementBounds(element),\n        labelStatus: \"idle\",\n      });\n      eventHandlers.onHover?.(null);\n      return;\n    }\n\n    const componentFiber = isUserComponent(fiber)\n      ? fiber\n      : findParentComponent(fiber);\n    if (!componentFiber) {\n      setState({\n        hoveredElement: element,\n        inspectedComponent: null,\n        selectionBounds: createElementBounds(element),\n        labelStatus: \"idle\",\n      });\n      eventHandlers.onHover?.(null);\n      return;\n    }\n\n    const componentInfo = extractComponentInfo(element, componentFiber);\n    setState({\n      hoveredElement: element,\n      inspectedComponent: componentInfo,\n      selectionBounds: createElementBounds(element),\n      labelStatus: \"hover\",\n    });\n\n    if (componentInfo) {\n      eventHandlers.onHover?.(componentInfo);\n    }\n  }\n\n  function handleClick(event: MouseEvent): void {\n    if (state.mode === \"inactive\") {\n      return;\n    }\n\n    const target = event.target as Element;\n\n    if (target.closest(\"[data-osdk-devtools-ignore]\")) {\n      return;\n    }\n\n    event.preventDefault();\n    event.stopImmediatePropagation();\n\n    if (state.mode === \"frozen\") {\n      setState({ mode: \"hover\", frozenElement: null, labelStatus: \"hover\" });\n      return;\n    }\n\n    if (state.hoveredElement && state.inspectedComponent) {\n      setState({\n        mode: \"frozen\",\n        frozenElement: state.hoveredElement,\n        selectedElement: state.hoveredElement,\n        labelStatus: \"selected\",\n      });\n      eventHandlers.onSelect?.(state.inspectedComponent);\n    }\n  }\n\n  function handleKeyDown(event: KeyboardEvent): void {\n    if (state.mode === \"inactive\") {\n      return;\n    }\n\n    if (event.key === \"Escape\") {\n      event.preventDefault();\n      event.stopImmediatePropagation();\n\n      if (state.mode === \"frozen\") {\n        setState({ mode: \"hover\", frozenElement: null, labelStatus: \"hover\" });\n      } else {\n        deactivate();\n      }\n    }\n  }\n\n  function handleScroll(): void {\n    if (state.mode === \"inactive\") {\n      return;\n    }\n    setState({ viewportVersion: state.viewportVersion + 1 });\n    recalculateBounds();\n  }\n\n  function handleResize(): void {\n    if (state.mode === \"inactive\") {\n      return;\n    }\n    setState({ viewportVersion: state.viewportVersion + 1 });\n    recalculateBounds();\n  }\n\n  function recalculateBounds(): void {\n    const element = state.frozenElement ?? state.hoveredElement;\n    if (!element || !document.contains(element)) {\n      setState({\n        hoveredElement: null,\n        frozenElement: null,\n        inspectedComponent: null,\n        selectionBounds: null,\n        labelStatus: \"idle\",\n      });\n      return;\n    }\n\n    setState({ selectionBounds: createElementBounds(element) });\n  }\n\n  function startBoundsRefreshInterval(): void {\n    if (boundsRefreshIntervalId) {\n      return;\n    }\n    boundsRefreshIntervalId = setInterval(\n      recalculateBounds,\n      boundsRefreshIntervalMs,\n    );\n  }\n\n  function stopBoundsRefreshInterval(): void {\n    if (boundsRefreshIntervalId) {\n      clearInterval(boundsRefreshIntervalId);\n      boundsRefreshIntervalId = null;\n    }\n  }\n\n  function attachEventListeners(): void {\n    abortController = new AbortController();\n    const { signal } = abortController;\n\n    containerElement.addEventListener(\"mousemove\", handleMouseMove, {\n      signal,\n      passive: true,\n    });\n    containerElement.addEventListener(\"click\", handleClick, {\n      signal,\n      capture: true,\n    });\n    document.addEventListener(\"keydown\", handleKeyDown, {\n      signal,\n      capture: true,\n    });\n    window.addEventListener(\"scroll\", handleScroll, { signal, passive: true });\n    window.addEventListener(\"resize\", handleResize, { signal, passive: true });\n  }\n\n  function detachEventListeners(): void {\n    if (abortController) {\n      abortController.abort();\n      abortController = null;\n    }\n  }\n\n  function activate(): void {\n    if (state.mode !== \"inactive\") {\n      return;\n    }\n\n    setState({ mode: \"hover\" });\n    attachEventListeners();\n    startBoundsRefreshInterval();\n    eventHandlers.onActivate?.();\n  }\n\n  function deactivate(): void {\n    if (state.mode === \"inactive\") {\n      return;\n    }\n\n    detachEventListeners();\n    stopBoundsRefreshInterval();\n    setState(createInitialState());\n    eventHandlers.onDeactivate?.();\n  }\n\n  function freeze(): void {\n    if (state.mode !== \"hover\" || !state.hoveredElement) {\n      return;\n    }\n\n    setState({\n      mode: \"frozen\",\n      frozenElement: state.hoveredElement,\n      selectedElement: state.hoveredElement,\n      labelStatus: \"selected\",\n    });\n\n    if (state.inspectedComponent) {\n      eventHandlers.onSelect?.(state.inspectedComponent);\n    }\n  }\n\n  function unfreeze(): void {\n    if (state.mode !== \"frozen\") {\n      return;\n    }\n\n    setState({\n      mode: \"hover\",\n      frozenElement: null,\n      labelStatus: \"hover\",\n    });\n  }\n\n  function getState(): InspectorState {\n    return state;\n  }\n\n  function subscribe(listener: (state: InspectorState) => void): () => void {\n    listeners.add(listener);\n    return () => listeners.delete(listener);\n  }\n\n  function destroy(): void {\n    deactivate();\n    listeners.clear();\n  }\n\n  return {\n    activate,\n    deactivate,\n    freeze,\n    unfreeze,\n    getState,\n    subscribe,\n    destroy,\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/build/esm/inspector/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/build/esm/inspector/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["types.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { Fiber, SourceLocation } from \"../fiber/types.js\";\n\nexport interface OverlayBounds {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  borderRadius: string;\n  transform: string;\n}\n\nexport interface LabelPosition {\n  left: number;\n  top: number;\n  arrowLeft: number;\n  arrowPosition: \"top\" | \"bottom\";\n}\n\nexport interface InspectedComponent {\n  name: string;\n  fiber: WeakRef<Fiber>;\n  element: WeakRef<Element>;\n  sourceLocation: SourceLocation | null;\n  props: Record<string, unknown>;\n  hookCount: number;\n}\n\nexport type SelectionLabelStatus = \"idle\" | \"hover\" | \"selected\" | \"copying\";\n\nexport type InspectorMode = \"inactive\" | \"hover\" | \"frozen\";\n\nexport interface InspectorState {\n  mode: InspectorMode;\n  mouseX: number;\n  mouseY: number;\n  hoveredElement: Element | null;\n  selectedElement: Element | null;\n  frozenElement: Element | null;\n  inspectedComponent: InspectedComponent | null;\n  selectionBounds: OverlayBounds | null;\n  labelPosition: LabelPosition | null;\n  labelStatus: SelectionLabelStatus;\n  viewportVersion: number;\n}\n\nexport interface InspectorEventHandlers {\n  onActivate: () => void;\n  onDeactivate: () => void;\n  onSelect: (component: InspectedComponent) => void;\n  onHover: (component: InspectedComponent | null) => void;\n  onOpenSource: (sourceLocation: SourceLocation) => void;\n}\n\nexport interface InspectorOptions {\n  containerElement?: HTMLElement;\n  throttleMs?: number;\n  boundsRefreshIntervalMs?: number;\n  eventHandlers?: Partial<InspectorEventHandlers>;\n  zIndex?: number;\n}\n\nexport interface AnimationOptions {\n  interpolationFactor?: number;\n  convergenceThreshold?: number;\n  enabled?: boolean;\n}\n\nexport interface AnimatedBounds {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\nexport type HighlightVariant = \"hover\" | \"selected\" | \"frozen\";\n\nexport interface SelectionHighlightProps {\n  bounds: OverlayBounds | null;\n  variant: HighlightVariant;\n  animationOptions?: AnimationOptions;\n  visible: boolean;\n}\n\nexport interface ComponentLabelProps {\n  component: InspectedComponent | null;\n  bounds: OverlayBounds | null;\n  mouseX: number;\n  mouseY: number;\n  status: SelectionLabelStatus;\n  onOpenSource?: (sourceLocation: SourceLocation) => void;\n  visible: boolean;\n}\n\nexport interface InspectorOverlayProps {\n  state: InspectorState;\n  eventHandlers?: Partial<InspectorEventHandlers>;\n  animationOptions?: AnimationOptions;\n  zIndex?: number;\n}\n\nexport interface InspectorController {\n  activate: () => void;\n  deactivate: () => void;\n  freeze: () => void;\n  unfreeze: () => void;\n  getState: () => InspectorState;\n  subscribe: (listener: (state: InspectorState) => void) => () => void;\n  destroy: () => void;\n}\n"],"mappings":"","ignoreList":[]}