@react-three-dom/core 0.5.0 → 0.6.0

package/dist/index.cjs

@@ -2574,6 +2574,82 @@ function circlePath(center, radiusX, radiusY, steps = 36, pressure = 0.5) {
 function sleep2(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
+var _v = new three.Vector3();
+function projectWorld(point, camera, size) {
+  _v.set(point.x, point.y, point.z).project(camera);
+  if (_v.z > 1) return null;
+  return {
+    x: (_v.x + 1) / 2 * size.width,
+    y: (-_v.y + 1) / 2 * size.height
+  };
+}
+function clickAtWorld(point, _options = {}) {
+  const camera = getCamera();
+  const gl = getRenderer();
+  const size = getCanvasSize();
+  const canvas = gl.domElement;
+  const screen = projectWorld(point, camera, size);
+  if (!screen) {
+    r3fLog("interaction", `clickAtWorld(${point.x}, ${point.y}, ${point.z}) \u2014 behind camera, skipped`);
+    return { dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: true };
+  }
+  r3fLog("interaction", `clickAtWorld(${point.x}, ${point.y}, ${point.z}) \u2192 screen(${Math.round(screen.x)}, ${Math.round(screen.y)})`);
+  dispatchClick(canvas, screen);
+  return { dispatched: true, screenPoint: screen, behindCamera: false };
+}
+function doubleClickAtWorld(point, _options = {}) {
+  const camera = getCamera();
+  const gl = getRenderer();
+  const size = getCanvasSize();
+  const canvas = gl.domElement;
+  const screen = projectWorld(point, camera, size);
+  if (!screen) {
+    r3fLog("interaction", `doubleClickAtWorld(${point.x}, ${point.y}, ${point.z}) \u2014 behind camera, skipped`);
+    return { dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: true };
+  }
+  r3fLog("interaction", `doubleClickAtWorld(${point.x}, ${point.y}, ${point.z}) \u2192 screen(${Math.round(screen.x)}, ${Math.round(screen.y)})`);
+  dispatchDoubleClick(canvas, screen);
+  return { dispatched: true, screenPoint: screen, behindCamera: false };
+}
+function contextMenuAtWorld(point, _options = {}) {
+  const camera = getCamera();
+  const gl = getRenderer();
+  const size = getCanvasSize();
+  const canvas = gl.domElement;
+  const screen = projectWorld(point, camera, size);
+  if (!screen) {
+    r3fLog("interaction", `contextMenuAtWorld(${point.x}, ${point.y}, ${point.z}) \u2014 behind camera, skipped`);
+    return { dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: true };
+  }
+  r3fLog("interaction", `contextMenuAtWorld(${point.x}, ${point.y}, ${point.z}) \u2192 screen(${Math.round(screen.x)}, ${Math.round(screen.y)})`);
+  dispatchContextMenu(canvas, screen);
+  return { dispatched: true, screenPoint: screen, behindCamera: false };
+}
+function hoverAtWorld(point, _options = {}) {
+  const camera = getCamera();
+  const gl = getRenderer();
+  const size = getCanvasSize();
+  const canvas = gl.domElement;
+  const screen = projectWorld(point, camera, size);
+  if (!screen) {
+    r3fLog("interaction", `hoverAtWorld(${point.x}, ${point.y}, ${point.z}) \u2014 behind camera, skipped`);
+    return { dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: true };
+  }
+  r3fLog("interaction", `hoverAtWorld(${point.x}, ${point.y}, ${point.z}) \u2192 screen(${Math.round(screen.x)}, ${Math.round(screen.y)})`);
+  dispatchHover(canvas, screen);
+  return { dispatched: true, screenPoint: screen, behindCamera: false };
+}
+async function clickAtWorldSequence(points, options = {}) {
+  const { delayMs = 50, ...interactionOpts } = options;
+  const results = [];
+  for (let i = 0; i < points.length; i++) {
+    results.push(clickAtWorld(points[i], interactionOpts));
+    if (delayMs > 0 && i < points.length - 1) {
+      await new Promise((resolve) => setTimeout(resolve, delayMs));
+    }
+  }
+  return results;
+}
 
 // src/highlight/SelectionManager.ts
 var SelectionManager = class {
@@ -2829,6 +2905,9 @@ var Highlighter = class {
     this._hoverPollId = null;
     this._lastHoveredUuid = null;
     this._store = null;
+    /** When true, the hover poll is paused and showHoverHighlight is blocked. */
+    this._hoverPollSuppressed = false;
+    this._suppressTimer = null;
   }
   // -----------------------------------------------------------------------
   // Lifecycle
@@ -2851,6 +2930,11 @@ var Highlighter = class {
       this._unsubscribe = null;
     }
     this._stopHoverPolling();
+    if (this._suppressTimer) {
+      clearTimeout(this._suppressTimer);
+      this._suppressTimer = null;
+    }
+    this._hoverPollSuppressed = false;
     this.clearHoverHighlight();
     this._clearAllSelectionHighlights();
     this._scene = null;
@@ -2878,6 +2962,7 @@ var Highlighter = class {
   // -----------------------------------------------------------------------
   /** Show a hover highlight on the given object (replaces any previous hover). */
   showHoverHighlight(obj) {
+    if (this._hoverPollSuppressed) return;
     if (obj === this._hoverTarget) return;
     this._clearHoverVisuals();
     if (!this._scene) return;
@@ -2916,6 +3001,26 @@ var Highlighter = class {
     this.clearHoverHighlight();
     this._clearAllSelectionHighlights();
   }
+  /**
+   * Stop the hover poll, clear all hover state, and restart after a delay.
+   * This prevents the DevTools extension from re-applying highlights after
+   * inspect mode is disabled (the extension polls `$0` every 200ms and
+   * keeps writing `__r3fdom_hovered__`).
+   */
+  suppressHoverPoll(durationMs = 1500) {
+    this._hoverPollSuppressed = true;
+    this._stopHoverPolling();
+    this._clearHoverVisuals();
+    this._lastHoveredUuid = null;
+    window.__r3fdom_hovered__ = null;
+    if (this._suppressTimer) clearTimeout(this._suppressTimer);
+    this._suppressTimer = setTimeout(() => {
+      this._hoverPollSuppressed = false;
+      this._suppressTimer = null;
+      window.__r3fdom_hovered__ = null;
+      this._startHoverPolling();
+    }, durationMs);
+  }
   // -----------------------------------------------------------------------
   // Internal: selection highlights
   // -----------------------------------------------------------------------
@@ -2998,6 +3103,16 @@ var Highlighter = class {
     try {
       const hoveredEl = window.__r3fdom_hovered__;
       const uuid = hoveredEl?.getAttribute?.("data-uuid") ?? null;
+      if (this._hoverPollSuppressed) {
+        if (uuid) {
+          window.__r3fdom_hovered__ = null;
+        }
+        if (this._hoverTarget) {
+          this._clearHoverVisuals();
+        }
+        this._lastHoveredUuid = null;
+        return;
+      }
       if (uuid === this._lastHoveredUuid) return;
       this._lastHoveredUuid = uuid;
       if (!uuid) {
@@ -3120,9 +3235,12 @@ var InspectController = class {
     this._boundContextMenu = null;
     this._hoveredObject = null;
     this._cancelHoverReveal();
-    this._highlighter.clearHoverHighlight();
+    this._highlighter.clearAll();
+    this._highlighter.suppressHoverPoll();
+    this._selectionManager.clearSelection();
+    window.__r3fdom_hovered__ = null;
     window.__r3fdom_selected_element__ = null;
-    r3fLog("inspect", "InspectController disabled");
+    r3fLog("inspect", "InspectController disabled \u2014 highlights and selection cleared");
   }
   /** Disable and release all resources. */
   dispose() {
@@ -3446,6 +3564,11 @@ function exposeGlobalAPI(store, gl, cameraRef, selMgr, inspCtrl, mirror, canvasI
       const result = await drawPath(points, options);
       return { eventCount: result.eventCount, pointCount: result.pointCount };
     },
+    clickAtWorld: (point, options) => clickAtWorld(point, options),
+    doubleClickAtWorld: (point, options) => doubleClickAtWorld(point, options),
+    contextMenuAtWorld: (point, options) => contextMenuAtWorld(point, options),
+    hoverAtWorld: (point, options) => hoverAtWorld(point, options),
+    clickAtWorldSequence: (points, options) => clickAtWorldSequence(points, options),
     select: (idOrUuid) => {
       const obj = store.getObject3D(idOrUuid);
       if (obj && selMgr) selMgr.select(obj);
@@ -3669,6 +3792,11 @@ function createStubBridge(error, canvasId) {
     pointerMiss: () => {
     },
     drawPath: async () => ({ eventCount: 0, pointCount: 0 }),
+    clickAtWorld: () => ({ dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: false }),
+    doubleClickAtWorld: () => ({ dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: false }),
+    contextMenuAtWorld: () => ({ dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: false }),
+    hoverAtWorld: () => ({ dispatched: false, screenPoint: { x: 0, y: 0 }, behindCamera: false }),
+    clickAtWorldSequence: async () => [],
     select: () => {
     },
     clearSelection: () => {
@@ -3998,8 +4126,11 @@ exports.ThreeElement = ThreeElement;
 exports.applyAttributes = applyAttributes;
 exports.circlePath = circlePath;
 exports.click3D = click3D;
+exports.clickAtWorld = clickAtWorld;
+exports.clickAtWorldSequence = clickAtWorldSequence;
 exports.computeAttributes = computeAttributes;
 exports.contextMenu3D = contextMenu3D;
+exports.contextMenuAtWorld = contextMenuAtWorld;
 exports.createFlatSnapshot = createFlatSnapshot;
 exports.createSnapshot = createSnapshot;
 exports.curvePath = curvePath;
@@ -4012,6 +4143,7 @@ exports.dispatchPointerMiss = dispatchPointerMiss;
 exports.dispatchUnhover = dispatchUnhover;
 exports.dispatchWheel = dispatchWheel;
 exports.doubleClick3D = doubleClick3D;
+exports.doubleClickAtWorld = doubleClickAtWorld;
 exports.drag3D = drag3D;
 exports.drawPath = drawPath;
 exports.enableDebug = enableDebug;
@@ -4024,6 +4156,7 @@ exports.getSelectionManager = getSelectionManager;
 exports.getStore = getStore2;
 exports.getTagForType = getTagForType;
 exports.hover3D = hover3D;
+exports.hoverAtWorld = hoverAtWorld;
 exports.isDebugEnabled = isDebugEnabled;
 exports.isInFrustum = isInFrustum;
 exports.isPatched = isPatched;