uidex 0.5.1 → 0.5.2

package/dist/index.d.cts

@@ -434,6 +434,11 @@ interface InspectorOptions {
         x: number;
         y: number;
     }) => void;
+    /** Fired when the cursor enters an iframe or otherwise leaves the inspectable document. */
+    onObscured?: (cursor: {
+        x: number;
+        y: number;
+    }) => void;
 }
 interface Inspector {
     mount(): void;

package/dist/index.d.ts

@@ -434,6 +434,11 @@ interface InspectorOptions {
         x: number;
         y: number;
     }) => void;
+    /** Fired when the cursor enters an iframe or otherwise leaves the inspectable document. */
+    onObscured?: (cursor: {
+        x: number;
+        y: number;
+    }) => void;
 }
 interface Inspector {
     mount(): void;

package/dist/index.js

@@ -3484,16 +3484,18 @@ function createCursorTooltip(deps) {
   const renderBody = () => {
     body.replaceChildren();
     if (typeof currentContent === "string") {
-      applyColor(DEFAULT_TOOLTIP_COLOR);
+      applyColor("#a1a1aa");
+      el2.style.opacity = "0.6";
       body.append(document.createTextNode(currentContent));
       return;
     }
     if (!currentContent) return;
+    el2.style.opacity = "1";
     const { entity, node } = currentContent;
     const style = KIND_STYLE[entity.kind];
     const demoted = entity.kind === "primitive";
     applyColor(style?.color ?? DEFAULT_TOOLTIP_COLOR);
-    el2.style.opacity = demoted ? "0.55" : "1";
+    if (demoted) el2.style.opacity = "0.55";
     if (style) {
       const svg2 = createLucideElement(style.icon);
       svg2.setAttribute("aria-hidden", "true");
@@ -3654,7 +3656,8 @@ function createInspector(options) {
     resolveAll = (target) => defaultResolveAllMatches(target, registry),
     onHover,
     onSelect,
-    onCycle
+    onCycle,
+    onObscured
   } = options;
   let mounted = false;
   let currentEl = null;
@@ -3663,6 +3666,13 @@ function createInspector(options) {
   let layerIndex = 0;
   let lastCursor = { x: 0, y: 0 };
   const makeStack = () => stack.length > 0 ? { matches: stack, index: layerIndex, current: stack[layerIndex] } : null;
+  const onDocumentLeave = () => {
+    currentEl = null;
+    stack = [];
+    layerIndex = 0;
+    session.highlight.unhover();
+    onObscured?.(lastCursor);
+  };
   const onMouseMove = (e) => {
     if (!(e.target instanceof Element)) return;
     const matches = resolveAll(e.target);
@@ -3715,6 +3725,7 @@ function createInspector(options) {
         document.head.appendChild(cursorStyleEl);
       }
       document.addEventListener("mousemove", onMouseMove);
+      document.addEventListener("mouseleave", onDocumentLeave);
       document.addEventListener("click", onClick, true);
       document.addEventListener("contextmenu", onContextMenu, true);
     },
@@ -3729,6 +3740,7 @@ function createInspector(options) {
         cursorStyleEl = null;
       }
       document.removeEventListener("mousemove", onMouseMove);
+      document.removeEventListener("mouseleave", onDocumentLeave);
       document.removeEventListener("click", onClick, true);
       document.removeEventListener("contextmenu", onContextMenu, true);
       session.highlight.unhover();
@@ -4636,6 +4648,10 @@ function createSurfaceShell(options) {
     },
     onCycle: (stack, cursor) => {
       showStack(stack, cursor);
+    },
+    onObscured: (cursor) => {
+      overlay.hide();
+      tooltip.update("iframe", cursor);
     }
   });
   cleanup.add(inspector);