@realsee/dnalogel 3.64.23-alpha.4 → 3.64.23-ke-webgpu.1

package/libs/shared-utils/three/Magnifier.js

@@ -1,48 +1,67 @@
-var b = Object.defineProperty;
-var C = (r, t, e) => t in r ? b(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
-var n = (r, t, e) => (C(r, typeof t != "symbol" ? t + "" : t, e), e);
-import { hammerExports as w } from "../../vendor/hammerjs/hammer.js";
-import * as y from "three";
-import { Subscribe as D } from "../Subscribe.js";
-class S {
+var w = Object.defineProperty;
+var R = (h, t, e) => t in h ? w(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e;
+var a = (h, t, e) => (R(h, typeof t != "symbol" ? t + "" : t, e), e);
+var u = (h, t, e) => new Promise((i, s) => {
+  var o = (n) => {
+    try {
+      r(e.next(n));
+    } catch (c) {
+      s(c);
+    }
+  }, f = (n) => {
+    try {
+      r(e.throw(n));
+    } catch (c) {
+      s(c);
+    }
+  }, r = (n) => n.done ? i(n.value) : Promise.resolve(n.value).then(o, f);
+  r((e = e.apply(h, t)).next());
+});
+import { hammerExports as D } from "../../vendor/hammerjs/hammer.js";
+import * as P from "three";
+import { Subscribe as O } from "../Subscribe.js";
+class T {
   constructor(t, e) {
-    n(this, "width");
-    n(this, "height");
-    n(this, "containerDom");
-    n(this, "hooks", new D());
-    n(this, "canvas", document.createElement("canvas"));
-    n(this, "config");
-    n(this, "state", { enabled: !1 });
-    n(this, "five");
-    n(this, "scale");
-    n(this, "offset", { x: 0, y: 0 });
-    n(this, "context");
-    n(this, "renderCenter", new y.Vector3());
-    n(this, "hammer");
-    n(this, "offsetRange");
-    n(this, "isPanning", !1);
-    n(this, "imageData", new ImageData(1, 1));
-    n(this, "onPanstart", () => {
+    a(this, "width");
+    a(this, "height");
+    a(this, "containerDom");
+    a(this, "hooks", new O());
+    a(this, "canvas", document.createElement("canvas"));
+    a(this, "config");
+    a(this, "state", { enabled: !1 });
+    a(this, "five");
+    a(this, "scale");
+    a(this, "offset", { x: 0, y: 0 });
+    a(this, "context");
+    a(this, "renderCenter", new P.Vector3());
+    a(this, "hammer");
+    a(this, "offsetRange");
+    a(this, "isPanning", !1);
+    a(this, "imageData", new ImageData(1, 1));
+    a(this, "renderPending", !1);
+    /** 在途期间是否又来了新的渲染请求，用于结束后补跑最后一帧 */
+    a(this, "renderRequested", !1);
+    a(this, "onPanstart", () => {
       this.isPanning = !0, this.canvas.style.boxShadow = "0 2px 30px 0 rgba(0,0,0,0.20)";
     });
-    n(this, "onPan", (t) => {
+    a(this, "onPan", (t) => {
       if (!this.isPanning || !this.offsetRange || this.hooks.emit("wantsPanGesture", t))
         return;
       const { translateX: i, translateY: s } = this.getPanOffset(t, this.offsetRange);
       this.canvas.style.transform = `translate3d(${i}px, ${s}px, 100px)`;
     });
-    n(this, "onPanend", (t) => {
+    a(this, "onPanend", (t) => {
       if (this.isPanning = !1, this.canvas.style.boxShadow = "none", !this.offsetRange)
         return;
       const { translateX: e, translateY: i } = this.getPanOffset(t, this.offsetRange);
       this.canvas.style.transform = `translate3d(${e}px, ${i}px, 100px)`, this.offset = { x: e, y: i };
     });
-    var s, h, o, a;
+    var s, o, f, r;
     if (!t.renderer) {
       console.error("Five Render 未初始化");
       return;
     }
-    this.five = t, this.scale = (s = e == null ? void 0 : e.scale) != null ? s : 2, this.width = (h = e == null ? void 0 : e.width) != null ? h : 190, this.height = (a = (o = e == null ? void 0 : e.height) != null ? o : e == null ? void 0 : e.width) != null ? a : 190, this.config = {
+    this.five = t, this.scale = (s = e == null ? void 0 : e.scale) != null ? s : 2, this.width = (o = e == null ? void 0 : e.width) != null ? o : 190, this.height = (r = (f = e == null ? void 0 : e.height) != null ? f : e == null ? void 0 : e.width) != null ? r : 190, this.config = {
       dragEnabled: (e == null ? void 0 : e.dragEnabled) || !1,
       autoFixPCPosition: (e == null ? void 0 : e.autoFixPCPosition) || !1,
       initialPosition: (e == null ? void 0 : e.initialPosition) || { left: "0", top: "0" }
@@ -50,7 +69,7 @@ class S {
     const i = this.canvas.getContext("2d");
     if (!i)
       throw new Error("CANNOT CREATE CONTEXT2D");
-    this.context = i, this.config.dragEnabled && (this.hammer = new w(this.canvas), this.hammer.on("pan", this.onPan), this.hammer.on("panstart", this.onPanstart), this.hammer.on("panend", this.onPanend)), this.initStyle();
+    this.context = i, this.config.dragEnabled && (this.hammer = new D(this.canvas), this.hammer.on("pan", this.onPan), this.hammer.on("panstart", this.onPanstart), this.hammer.on("panend", this.onPanend)), this.initStyle();
   }
   enable() {
     if (!this.state.enabled)
@@ -85,54 +104,94 @@ class S {
   resetOffset() {
     this.offset = { x: 0, y: 0 }, this.canvas.style.transform = "translate3d(0px, 0px, 100px)";
   }
+  /**
+   * WebGPU 不支持同步回读像素，five-webgpu 的 `getPixels()` 因此返回 `Promise`，本方法随之变为 async。
+   *
+   * 现有约 10 个调用点都是即发即忘（不 await），签名变化对它们透明；
+   * 但异步化带来了并发问题：逐帧调用时多个回读可能交错完成、乱序写入 canvas。
+   *
+   * 这里的策略是「丢中间帧、但绝不丢最后一帧」：
+   * 有回读在途时不再并发发起，只登记 `renderRequested`；当前这次结束后再补跑一次。
+   *
+   * ⚠️ 不能简单地「在途就 return」了事：调用方是先更新 `renderCenter` 再调 `render()` 的
+   * （见 renderWithPoint / renderWithScreenPoint）。若直接丢弃，手指抬起前的最后一次调用
+   * 恰好撞上在途回读时，这一帧就永远不会被渲染，放大镜会停在上一个位置不动。
+   * `renderOnce()` 每次都重新读 `this.renderCenter`，所以补跑拿到的是最新位置。
+   */
   render() {
-    if (!this.five.renderer || !this.containerDom)
-      return;
-    const { scale: t, context: e, width: i, height: s } = this, h = this.five.renderer.getSize(new y.Vector2()), [o, a] = (() => {
-      if (this.renderCenter.isVector3) {
-        const c = this.renderCenter.clone().project(this.five.camera);
-        return [(c.x + 1) / 2 * h.x, (c.y + 1) / 2 * h.y];
-      } else
-        return [this.renderCenter.x, h.y - this.renderCenter.y];
-    })(), f = 1, l = i / t, x = s / t, P = f * t, v = /* @__PURE__ */ new Map();
-    this.five.scene.traverse((c) => {
-      c.disableGetPixel === !0 && (v.set(c, c.visible), c.visible = !1);
+    return u(this, null, function* () {
+      if (!(!this.five.renderer || !this.containerDom)) {
+        if (this.renderPending) {
+          this.renderRequested = !0;
+          return;
+        }
+        this.renderPending = !0;
+        try {
+          do
+            this.renderRequested = !1, yield this.renderOnce();
+          while (this.renderRequested);
+        } finally {
+          this.renderPending = !1, this.renderRequested = !1;
+        }
+      }
     });
-    const u = this.five.getPixels(o - l / 2, a - l / 2, l, x, P);
-    v.forEach((c, p) => {
-      p.visible = c;
+  }
+  renderOnce() {
+    return u(this, null, function* () {
+      if (!this.five.renderer || !this.containerDom)
+        return;
+      const { scale: t, context: e, width: i, height: s } = this, o = this.five.renderer.getSize(new P.Vector2()), [f, r] = (() => {
+        if (this.renderCenter.isVector3) {
+          const l = this.renderCenter.clone().project(this.five.camera);
+          return [(l.x + 1) / 2 * o.x, (l.y + 1) / 2 * o.y];
+        } else
+          return [this.renderCenter.x, o.y - this.renderCenter.y];
+      })(), n = 1, c = i / t, g = s / t, p = n * t, v = /* @__PURE__ */ new Map();
+      this.five.scene.traverse((l) => {
+        l.disableGetPixel === !0 && (v.set(l, l.visible), l.visible = !1);
+      });
+      const b = this.five.getPixels(
+        f - c / 2,
+        r - c / 2,
+        c,
+        g,
+        p
+      );
+      v.forEach((l, C) => {
+        C.visible = l;
+      });
+      const y = yield b, x = Math.floor(i * n), m = Math.floor(s * n);
+      E(y, x, m), (this.imageData.width !== x || this.imageData.height !== m) && (this.imageData = new ImageData(x, m)), this.imageData.data.set(y), e.putImageData(this.imageData, 0, 0), this.canvas.style.visibility = "visible";
     });
-    const g = Math.floor(i * f), m = Math.floor(s * f);
-    R(u, g, m), (this.imageData.width !== g || this.imageData.height !== m) && (this.imageData = new ImageData(g, m)), this.imageData.data.set(u), e.putImageData(this.imageData, 0, 0), this.canvas.style.visibility = "visible";
   }
   getRenderCenter() {
     return this.renderCenter;
   }
   _appendTo(t) {
     if (this.resetOffset(), t.appendChild(this.canvas), !this.offsetRange) {
-      const e = this.canvas.getBoundingClientRect(), i = t.getBoundingClientRect(), s = i.right - e.right, h = i.bottom - e.bottom, o = i.left - e.left, a = i.top - e.top;
+      const e = this.canvas.getBoundingClientRect(), i = t.getBoundingClientRect(), s = i.right - e.right, o = i.bottom - e.bottom, f = i.left - e.left, r = i.top - e.top;
       this.offsetRange = {
-        min: { x: o, y: a },
-        max: { x: s, y: h }
+        min: { x: f, y: r },
+        max: { x: s, y: o }
       };
     }
   }
   autoFixPCPosition() {
     if (!this.containerDom)
       return;
-    const { width: t, height: e } = this, { clientWidth: i, clientHeight: s } = this.containerDom, [h, o, a] = (() => {
+    const { width: t, height: e } = this, { clientWidth: i, clientHeight: s } = this.containerDom, [o, f, r] = (() => {
       if (this.renderCenter.isVector3) {
-        const f = this.renderCenter.clone().project(this.five.camera);
+        const n = this.renderCenter.clone().project(this.five.camera);
         return [
           //
-          (f.x + 1) / 2 * i,
-          -(f.x - 1) / 2 * i,
-          -(f.y - 1) / 2 * s
+          (n.x + 1) / 2 * i,
+          -(n.x - 1) / 2 * i,
+          -(n.y - 1) / 2 * s
         ];
       } else
         return [this.renderCenter.x, i - this.renderCenter.x, this.renderCenter.y];
     })();
-    h < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = "90px") : a < 183 ? (this.canvas.style.top = "90px", this.canvas.style.left = -t / 2 + "px") : o < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = -t - 90 + "px") : (this.canvas.style.left = -t / 2 + "px", this.canvas.style.top = -e - 90 + "px"), this.canvas.style.transform = `translate3d(${h}px, ${a}px, 10px)`, this.offset = { x: h, y: a };
+    o < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = "90px") : r < 183 ? (this.canvas.style.top = "90px", this.canvas.style.left = -t / 2 + "px") : f < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = -t - 90 + "px") : (this.canvas.style.left = -t / 2 + "px", this.canvas.style.top = -e - 90 + "px"), this.canvas.style.transform = `translate3d(${o}px, ${r}px, 10px)`, this.offset = { x: o, y: r };
   }
   initStyle() {
     const t = this.canvas;
@@ -143,25 +202,25 @@ class S {
   getPanOffset(t, e) {
     const {
       min: { x: i, y: s },
-      max: { x: h, y: o }
-    } = e, a = this.offset.x + t.deltaX, f = this.offset.y + t.deltaY, l = Math.min(Math.max(a, i), h), x = Math.min(Math.max(f, s), o);
-    return { translateX: l, translateY: x };
+      max: { x: o, y: f }
+    } = e, r = this.offset.x + t.deltaX, n = this.offset.y + t.deltaY, c = Math.min(Math.max(r, i), o), g = Math.min(Math.max(n, s), f);
+    return { translateX: c, translateY: g };
   }
 }
-function d(r, t, e) {
-  const i = r[t], s = r[e];
-  i === void 0 || s === void 0 || (r[t] = s, r[e] = i);
+function d(h, t, e) {
+  const i = h[t], s = h[e];
+  i === void 0 || s === void 0 || (h[t] = s, h[e] = i);
 }
-function R(r, t, e) {
+function E(h, t, e) {
   const i = e / 2;
   for (let s = 1; s <= i; s++) {
-    const h = e - (s - 1);
-    for (let o = 1; o <= t; o++) {
-      const a = (s - 1) * t + o - 1, f = (h - 1) * t + o - 1;
-      d(r, a * 4 + 0, f * 4 + 0), d(r, a * 4 + 1, f * 4 + 1), d(r, a * 4 + 2, f * 4 + 2), d(r, a * 4 + 3, f * 4 + 3);
+    const o = e - (s - 1);
+    for (let f = 1; f <= t; f++) {
+      const r = (s - 1) * t + f - 1, n = (o - 1) * t + f - 1;
+      d(h, r * 4 + 0, n * 4 + 0), d(h, r * 4 + 1, n * 4 + 1), d(h, r * 4 + 2, n * 4 + 2), d(h, r * 4 + 3, n * 4 + 3);
     }
   }
 }
 export {
-  S as Magnifier
+  T as Magnifier
 };

package/libs/shared-utils/three/PointSelector/index.d.ts

@@ -1,4 +1,4 @@
-import type { Five } from '@realsee/five';
+import type { Five } from '@realsee/five-webgpu';
 import { PointSelectorHelper, type PointIntersection, type PointSelectorHelperConfig } from './utils/PointSelectorHelper';
 import type { Vector3 } from 'three';
 import * as THREE from 'three';
@@ -6,7 +6,12 @@ import { Subscribe } from '../../Subscribe';
 import type { LiteralString } from '../../../typings/utils.type';
 export type { PointIntersection };
 export type ActionIfNoIntersection = LiteralString<'virtualPoint' | 'lastPoint' | 'disable'>;
-export type AdherePoint = (Vector3 | THREE.Face3) & {
+/**
+ * r125 移除了 `THREE.Face3` 类，r183 的对应物是 `Face` —— 但它是纯 interface，无法 `instanceof`。
+ * 这里用结构判断代替：`Face` 有 `normal`，`Vector3` 没有。
+ */
+export declare function isFace(point: Vector3 | THREE.Face): point is THREE.Face;
+export type AdherePoint = (Vector3 | THREE.Face) & {
     /**
      * @description 被模型遮挡也能看到的点
      */

package/libs/shared-utils/three/PointSelector/index.js

@@ -1,29 +1,32 @@
-var R = Object.defineProperty, O = Object.defineProperties;
-var X = Object.getOwnPropertyDescriptors;
-var N = Object.getOwnPropertySymbols;
-var Y = Object.prototype.hasOwnProperty, B = Object.prototype.propertyIsEnumerable;
-var E = (l, h, e) => h in l ? R(l, h, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[h] = e, P = (l, h) => {
-  for (var e in h || (h = {}))
-    Y.call(h, e) && E(l, e, h[e]);
-  if (N)
-    for (var e of N(h))
-      B.call(h, e) && E(l, e, h[e]);
-  return l;
-}, M = (l, h) => O(l, X(h));
-var i = (l, h, e) => (E(l, typeof h != "symbol" ? h + "" : h, e), e);
-import { PointSelectorHelper as C } from "./utils/PointSelectorHelper.js";
-import { isTouchDevice as j } from "../../isTouchDevice.js";
-import * as o from "three";
-import { Subscribe as A } from "../../Subscribe.js";
-import { getIntersectByRaycaster as k, getVirtualIntersectByRaycaster as g } from "../../five/getPosition.js";
-import { getRaycasterByNdcPosition as G } from "../../five/getRaycasterByNdcPosition.js";
-import { CURSOR_NOT_ALLOW_URL as V } from "./utils/contents.js";
-import { rayOnLine as W } from "../../../Sculpt/utils/three/rayOnLine.js";
-import { THREERaycaster as z } from "../core/Raycaster.js";
-const _ = new o.Vector3(), w = () => !1;
-class se extends A {
+var O = Object.defineProperty, X = Object.defineProperties;
+var Y = Object.getOwnPropertyDescriptors;
+var x = Object.getOwnPropertySymbols;
+var B = Object.prototype.hasOwnProperty, C = Object.prototype.propertyIsEnumerable;
+var M = (c, a, e) => a in c ? O(c, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[a] = e, P = (c, a) => {
+  for (var e in a || (a = {}))
+    B.call(a, e) && M(c, e, a[e]);
+  if (x)
+    for (var e of x(a))
+      C.call(a, e) && M(c, e, a[e]);
+  return c;
+}, T = (c, a) => X(c, Y(a));
+var i = (c, a, e) => (M(c, typeof a != "symbol" ? a + "" : a, e), e);
+import { PointSelectorHelper as j } from "./utils/PointSelectorHelper.js";
+import { isTouchDevice as A } from "../../isTouchDevice.js";
+import * as h from "three";
+import { Subscribe as k } from "../../Subscribe.js";
+import { getIntersectByRaycaster as g, getVirtualIntersectByRaycaster as G } from "../../five/getPosition.js";
+import { getRaycasterByNdcPosition as W } from "../../five/getRaycasterByNdcPosition.js";
+import { CURSOR_NOT_ALLOW_URL as _ } from "./utils/contents.js";
+import { rayOnLine as z } from "../../../Sculpt/utils/three/rayOnLine.js";
+import { THREERaycaster as K } from "../core/Raycaster.js";
+const F = new h.Vector3(), w = () => !1;
+function L(c) {
+  return "normal" in c;
+}
+class oe extends k {
   constructor(e, t) {
-    var u, d, n, f;
+    var u, d, p, o;
     super();
     i(this, "_cursorError", !1);
     i(this, "actionIfNoIntersection", "virtualPoint");
@@ -117,8 +120,8 @@ class se extends A {
     i(this, "onMouseUp", (e) => {
       if (!this._mouseDownInfo)
         return;
-      const { clientX: t, clientY: s, timestamp: c } = this._mouseDownInfo;
-      Math.abs(e.clientX - t) < 2 && Math.abs(e.clientY - s) < 2 && performance.now() - c < 500 ? this.select() : this._mouseDownInfo = null;
+      const { clientX: t, clientY: s, timestamp: l } = this._mouseDownInfo;
+      Math.abs(e.clientX - t) < 2 && Math.abs(e.clientY - s) < 2 && performance.now() - l < 500 ? this.select() : this._mouseDownInfo = null;
     });
     i(this, "onTouchStart", (e) => {
       this._touchStartInfo = {
@@ -139,8 +142,8 @@ class se extends A {
       if (this.setPressDown) {
         let t = !1;
         if (this._touchStartInfo) {
-          const { clientX: s, clientY: c } = this._touchStartInfo;
-          (Math.abs(e.touches[0].clientX - s) > 2 || Math.abs(e.touches[0].clientY - c) > 2) && (t = !0);
+          const { clientX: s, clientY: l } = this._touchStartInfo;
+          (Math.abs(e.touches[0].clientX - s) > 2 || Math.abs(e.touches[0].clientY - l) > 2) && (t = !0);
         }
         t && (clearTimeout(this.setPressDown), this.setPressDown = void 0);
         return;
@@ -180,47 +183,53 @@ class se extends A {
      * @description: 根据鼠标位置计算焦点位置并更新
      */
     i(this, "updateByNdcPosition", (e) => {
-      var c, u, d;
-      const t = G(this.five, e);
-      let s = k(this.five, t);
+      var l, u, d, p;
+      const t = W(this.five, e);
+      let s = g(this.five, t);
       if (s) {
-        if (this.plane && this.planeMode === "vertical" && (s = M(P({}, s), {
-          point: this.plane.projectPoint(s.point, new o.Vector3()),
-          face: new o.Face3(0, 0, 0, this.plane.normal.clone()),
+        if (this.plane && this.planeMode === "vertical" && (s = T(P({}, s), {
+          point: this.plane.projectPoint(s.point, new h.Vector3()),
+          face: { normal: this.plane.normal.clone() },
           originalPoint: s.point.clone()
         })), this.plane && this.planeMode === "onlyPlane") {
-          const n = t.ray.intersectPlane(this.plane, _);
-          if (!n)
+          const o = t.ray.intersectPlane(this.plane, F);
+          if (!o)
             return !1;
           s = {
-            distance: this.five.camera.position.distanceTo(n),
-            point: n.clone(),
+            distance: this.five.camera.position.distanceTo(o),
+            point: o.clone(),
             originalPoint: s.point.clone(),
-            face: new o.Face3(0, 0, 0, this.plane.normal.clone()),
+            face: { normal: this.plane.normal.clone() },
             raycaster: t
           };
         }
         return this.updatePointSelectorHelperIntersect(s), this.lastIntersection = s, !0;
       }
       if (this.plane) {
-        const n = t.ray.intersectPlane(this.plane, _);
-        if (n) {
-          const f = {
-            distance: this.five.camera.position.distanceTo(n),
-            point: n.clone(),
-            object: new o.Object3D(),
-            face: new o.Face3(0, 0, 0, this.plane.normal.clone()),
+        const o = t.ray.intersectPlane(this.plane, F);
+        if (o) {
+          const S = {
+            distance: this.five.camera.position.distanceTo(o),
+            point: o.clone(),
+            object: new h.Object3D(),
+            face: { normal: this.plane.normal.clone() },
             raycaster: t,
             isVirtual: !0
           };
-          return this.updatePointSelectorHelperIntersect(f), !0;
+          return this.updatePointSelectorHelperIntersect(S), !0;
         }
       }
       if (this.actionIfNoIntersection === "lastPoint")
         return this.updatePointSelectorHelperIntersect(this.lastIntersection), !0;
       if (this.actionIfNoIntersection === "virtualPoint") {
-        const n = g(t, (c = this.lastIntersection) == null ? void 0 : c.distance);
-        return n.face = new o.Face3(0, 0, 0, (d = (u = this.lastIntersection) == null ? void 0 : u.face) == null ? void 0 : d.normal), n.isVirtual = !0, this.lastIntersection = n, this.updatePointSelectorHelperIntersect(n), !0;
+        const o = G(t, (l = this.lastIntersection) == null ? void 0 : l.distance);
+        return o.face = {
+          a: 0,
+          b: 0,
+          c: 0,
+          normal: (p = (d = (u = this.lastIntersection) == null ? void 0 : u.face) == null ? void 0 : d.normal) != null ? p : new h.Vector3(),
+          materialIndex: 0
+        }, o.isVirtual = !0, this.lastIntersection = o, this.updatePointSelectorHelperIntersect(o), !0;
       } else if (this.actionIfNoIntersection === "disable")
         return this.updatePointSelectorHelperIntersect(null), !1;
     });
@@ -228,77 +237,77 @@ class se extends A {
      * @description: 更新 pointSelectorHelper 的焦点位置
      */
     i(this, "updatePointSelectorHelperIntersect", (e) => {
-      var s, c, u, d, n, f, T, L;
+      var s, l, u, d, p, o, S, H;
       if (!e) {
-        this.pointSelectorHelper.hide(), this.pointSelectorHelper.position = e, this.emit("intersectionUpdate", e), this.five.getElement().style.cursor = V;
+        this.pointSelectorHelper.hide(), this.pointSelectorHelper.position = e, this.emit("intersectionUpdate", e), this.five.getElement().style.cursor = _;
         return;
       }
       this.onEnter(), this.cursorError || (this.five.getElement().style.cursor = "");
       const t = P({}, e);
       if (this.adhereEnabled && this.mouseNdcPosition && this.five.renderer) {
-        const S = {
+        const I = {
           x: this.mouseNdcPosition.x,
           y: 1 - this.mouseNdcPosition.y
-        }, H = this.five.renderer.getSize(new o.Vector2());
+        }, D = this.five.renderer.getSize(new h.Vector2());
         if (this.adhereEnabled && typeof this.adherePoints == "function" && typeof this.adhereRadius == "number") {
           for (const r of this.adherePlane) {
-            const a = r.distanceToPoint(e.point);
-            let p = r.projectPoint(e.point, new o.Vector3());
-            (!this.plane || this.plane.distanceToPoint(p) < 0.01) && (p = (c = (s = this.plane) == null ? void 0 : s.projectPoint(p, new o.Vector3())) != null ? c : p, a < this.adhereRadius && (t.point = p.clone(), t.adherePoint = p.clone(), this.plane || (t.face = new o.Face3(0, 0, 0, r.normal.clone())), t.isAdsorbed = !0));
+            const n = r.distanceToPoint(e.point);
+            let f = r.projectPoint(e.point, new h.Vector3());
+            (!this.plane || this.plane.distanceToPoint(f) < 0.01) && (f = (l = (s = this.plane) == null ? void 0 : s.projectPoint(f, new h.Vector3())) != null ? l : f, n < this.adhereRadius && (t.point = f.clone(), t.adherePoint = f.clone(), this.plane || (t.face = { normal: r.normal.clone() }), t.isAdsorbed = !0));
           }
           for (const r of this.adhereLine) {
-            let a = r.closestPointToPoint(e.point, !1, new o.Vector3());
-            if (a.distanceTo(e.point) < this.adhereRadius)
-              (!this.plane || this.plane.distanceToPoint(a) < 0.01) && (a = (d = (u = this.plane) == null ? void 0 : u.projectPoint(a, new o.Vector3())) != null ? d : a, t.point = a.clone(), t.adhereLine = r.clone(), t.isAdsorbed = !0);
+            let n = r.closestPointToPoint(e.point, !1, new h.Vector3());
+            if (n.distanceTo(e.point) < this.adhereRadius)
+              (!this.plane || this.plane.distanceToPoint(n) < 0.01) && (n = (d = (u = this.plane) == null ? void 0 : u.projectPoint(n, new h.Vector3())) != null ? d : n, t.point = n.clone(), t.adhereLine = r.clone(), t.isAdsorbed = !0);
             else {
-              const p = W({
-                raycaster: new z(this.five.camera.position, e.point.clone().sub(this.five.camera.position).normalize()),
+              const f = z({
+                raycaster: new K(this.five.camera.position, e.point.clone().sub(this.five.camera.position).normalize()),
                 line: r,
                 clampToLine: !1
-              }), v = p.clone().project(this.five.camera);
+              }), v = f.clone().project(this.five.camera);
               if (v.z <= 1) {
                 const y = {
                   x: (v.x + 1) / 2,
                   y: (1 - v.y) / 2
                 }, b = {
-                  x: Math.abs(y.x - S.x) * H.width,
-                  y: Math.abs(y.y - S.y) * H.height
+                  x: Math.abs(y.x - I.x) * D.width,
+                  y: Math.abs(y.y - I.y) * D.height
                 };
-                let m = p.clone();
-                b.x < 10 && b.y < 10 && (!this.plane || this.plane.distanceToPoint(m) < 0.01) && (m = (f = (n = this.plane) == null ? void 0 : n.projectPoint(m, new o.Vector3())) != null ? f : m, t.point = m.clone(), t.adhereLine = r.clone(), t.isAdsorbed = !0);
+                let m = f.clone();
+                b.x < 10 && b.y < 10 && (!this.plane || this.plane.distanceToPoint(m) < 0.01) && (m = (o = (p = this.plane) == null ? void 0 : p.projectPoint(m, new h.Vector3())) != null ? o : m, t.point = m.clone(), t.adhereLine = r.clone(), t.isAdsorbed = !0);
               }
             }
           }
           for (const r of this.adherePoints({ intersection: e, pointSelectorInstance: this })) {
-            const a = r instanceof o.Face3 ? new o.Vector3(r.a, r.b, r.c) : r;
-            if (a.IsAlwaysVisible = r.IsAlwaysVisible, this.plane && this.plane.distanceToPoint(a) > 0.01)
+            const n = L(r) ? new h.Vector3(r.a, r.b, r.c) : r;
+            if (n.IsAlwaysVisible = r.IsAlwaysVisible, this.plane && this.plane.distanceToPoint(n) > 0.01)
               continue;
-            if (a.distanceTo(e.point) < this.adhereRadius) {
-              t.point = (L = (T = this.plane) == null ? void 0 : T.projectPoint(a, new o.Vector3())) != null ? L : a.clone(), !this.plane && r instanceof o.Face3 && (t.face = r), t.isAdsorbed = !0;
+            if (n.distanceTo(e.point) < this.adhereRadius) {
+              t.point = (H = (S = this.plane) == null ? void 0 : S.projectPoint(n, new h.Vector3())) != null ? H : n.clone(), !this.plane && L(r) && (t.face = r), t.isAdsorbed = !0;
               break;
             } else {
-              const v = a.clone().project(this.five.camera);
+              const v = n.clone().project(this.five.camera);
               if (v.z > 1)
                 continue;
-              const y = this.five.renderer.getSize(new o.Vector2()), b = {
+              const y = this.five.renderer.getSize(new h.Vector2()), b = {
                 x: (v.x + 1) / 2,
                 y: (1 - v.y) / 2
               }, m = {
-                x: Math.abs(b.x - S.x) * y.width,
-                y: Math.abs(b.y - S.y) * y.height
+                x: Math.abs(b.x - I.x) * y.width,
+                y: Math.abs(b.y - I.y) * y.height
               };
               if (m.x < 10 && m.y < 10) {
-                let I = !1;
-                if (a.IsAlwaysVisible)
-                  I = !0;
+                let E = !1;
+                if (n.IsAlwaysVisible)
+                  E = !0;
                 else {
-                  const D = new o.Raycaster();
-                  D.setFromCamera(a.clone(), this.five.camera);
-                  const F = this.five.model.intersectRaycaster(D, void 0, !0)[0], x = 0.1, U = this.five.camera.position.distanceTo(a);
-                  F && F.distance < U + x && (I = !0);
+                  const V = new h.Raycaster();
+                  V.setFromCamera(new h.Vector2(n.x, n.y), this.five.camera);
+                  const N = this.five.model.intersectRaycaster(V)[0], U = 0.1, R = this.five.camera.position.distanceTo(n);
+                  N && N.distance < R + U && (E = !0);
                 }
-                if (I) {
-                  t.point = a.clone(), !this.plane && r instanceof o.Face3 && (t.face = r), t.isAdsorbed = !0;
+                if (E) {
+                  t.point = n.clone(), !this.plane && L(r) && (t.face = r), t.isAdsorbed = !0;
                   break;
                 }
               }
@@ -312,10 +321,10 @@ class se extends A {
       const t = this.five.getElement();
       if (!t)
         return null;
-      const { top: s, left: c, width: u, height: d } = t.getBoundingClientRect(), { clientX: n, clientY: f } = e;
+      const { top: s, left: l, width: u, height: d } = t.getBoundingClientRect(), { clientX: p, clientY: o } = e;
       return {
-        x: (n - c) / u,
-        y: 1 - (f - s) / d
+        x: (p - l) / u,
+        y: 1 - (o - s) / d
       };
     });
     i(this, "onFiveWantsPanGesture", () => {
@@ -329,14 +338,14 @@ class se extends A {
       this.emit("intersectionUpdate", e);
     });
     this.five = e, this.config = P(P({}, this.config), t), this.actionIfNoIntersection = (d = (u = t == null ? void 0 : t.actionIfNoIntersection) != null ? u : t == null ? void 0 : t.actionIfNoModelUnderMouse) != null ? d : "virtualPoint";
-    const s = (n = t == null ? void 0 : t.mode) != null ? n : "auto";
-    s === "auto" ? this.mode = j ? "fixed" : "cursor" : this.mode = s;
-    const c = {
+    const s = (p = t == null ? void 0 : t.mode) != null ? p : "auto";
+    s === "auto" ? this.mode = A ? "fixed" : "cursor" : this.mode = s;
+    const l = {
       autoFixPCPosition: this.mode === "cursor",
       initialPosition: this.mode === "fixed" ? { left: "35%", top: "20%" } : void 0
     };
-    this.pointSelectorHelper = new C(this.five, M(P({}, t == null ? void 0 : t.helper), {
-      magnifierParams: P(P({}, c), (f = t == null ? void 0 : t.helper) == null ? void 0 : f.magnifierParams)
+    this.pointSelectorHelper = new j(this.five, T(P({}, t == null ? void 0 : t.helper), {
+      magnifierParams: P(P({}, l), (o = t == null ? void 0 : t.helper) == null ? void 0 : o.magnifierParams)
     })), this.pointSelectorHelper.hide();
   }
   get position() {
@@ -356,7 +365,7 @@ class se extends A {
     return this._cursorError;
   }
   set cursorError(e) {
-    this._cursorError = e, this.five.getElement().style.cursor = e ? V : "", e ? this.pointSelectorHelper.hide() : this.pointSelectorHelper.show();
+    this._cursorError = e, this.five.getElement().style.cursor = e ? _ : "", e ? this.pointSelectorHelper.hide() : this.pointSelectorHelper.show();
   }
   set outOfFive(e) {
     this._outOfFive = e;
@@ -391,5 +400,6 @@ class se extends A {
   }
 }
 export {
-  se as PointSelector
+  oe as PointSelector,
+  L as isFace
 };

package/libs/shared-utils/three/PointSelector/utils/PointHelper.d.ts

@@ -1,16 +1,17 @@
 import * as THREE from 'three';
+import { MeshBasicNodeMaterial } from 'three/webgpu';
 import type { Intersection } from '../../../../typings/typings';
 import type { PointHelperAbstract } from './typing';
 import { CSS3DObjectPlus } from '../../../../CSS3DRenderPlugin/utils/three/CSS3DObject';
-import type { Five } from '@realsee/five';
+import type { Five } from '@realsee/five-webgpu';
 export interface MouseGroupParameter {
     isMobile?: boolean;
     useNormalVector?: boolean;
     ballColor?: number;
 }
-declare function createPlaneMesh(): THREE.Mesh<THREE.PlaneGeometry, THREE.MeshBasicMaterial>;
-declare function createLineMesh(): THREE.Mesh<THREE.TubeGeometry, THREE.ShaderMaterial>;
-declare function createBallMesh(): THREE.Mesh<THREE.SphereGeometry, THREE.MeshBasicMaterial>;
+declare function createPlaneMesh(): THREE.Mesh<THREE.PlaneGeometry, THREE.MeshBasicMaterial, THREE.Object3DEventMap>;
+declare function createLineMesh(): THREE.Mesh<THREE.TubeGeometry, MeshBasicNodeMaterial, THREE.Object3DEventMap>;
+declare function createBallMesh(): THREE.Mesh<THREE.SphereGeometry, THREE.MeshBasicMaterial, THREE.Object3DEventMap>;
 declare function createBorderMesh(): CSS3DObjectPlus<HTMLElement>;
 type PlanMesh = ReturnType<typeof createPlaneMesh>;
 type LineMesh = ReturnType<typeof createLineMesh>;