@realsee/dnalogel 3.37.2 → 3.38.0

package/libs/ModelMakerPlugin/Controller.js

@@ -1,40 +1,40 @@
-var k = Object.defineProperty;
-var P = (h, a, e) => a in h ? k(h, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[a] = e;
-var n = (h, a, e) => (P(h, typeof a != "symbol" ? a + "" : a, e), e);
-var V = (h, a, e) => new Promise((i, r) => {
-  var t = (s) => {
+var I = Object.defineProperty;
+var D = (l, a, e) => a in l ? I(l, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[a] = e;
+var r = (l, a, e) => (D(l, typeof a != "symbol" ? a + "" : a, e), e);
+var j = (l, a, e) => new Promise((t, s) => {
+  var p = (h) => {
     try {
-      o(e.next(s));
-    } catch (d) {
-      r(d);
+      i(e.next(h));
+    } catch (m) {
+      s(m);
     }
-  }, l = (s) => {
+  }, n = (h) => {
     try {
-      o(e.throw(s));
-    } catch (d) {
-      r(d);
+      i(e.throw(h));
+    } catch (m) {
+      s(m);
     }
-  }, o = (s) => s.done ? i(s.value) : Promise.resolve(s.value).then(t, l);
-  o((e = e.apply(h, a)).next());
+  }, i = (h) => h.done ? t(h.value) : Promise.resolve(h.value).then(p, n);
+  i((e = e.apply(l, a)).next());
 });
-import { Controller as F } from "../base/BasePluginWithData.js";
-import * as p from "three";
-import { ModelMakerBoxItem as A } from "./item/boxItem.js";
-import { PrismMesh as C } from "../Sculpt/Meshes/Prism.js";
-import { anyPositionToVector3 as I } from "../shared-utils/positionToVector3.js";
-import { PolygonWithEdgeMesh as D } from "../Sculpt/Meshes/PolygonWithEdge.js";
+import { Controller as T } from "../base/BasePluginWithData.js";
+import * as c from "three";
+import { ModelMakerBoxItem as H } from "./item/boxItem.js";
+import { PrismMesh as k } from "../Sculpt/Meshes/Prism.js";
+import { anyPositionToVector3 as L } from "../shared-utils/positionToVector3.js";
+import { PolygonWithEdgeMesh as S } from "../Sculpt/Meshes/PolygonWithEdge.js";
 import "hammerjs";
 import "../vendor/@tweenjs/tween/dist/tween.esm.js.js";
 import "../CSS3DRenderPlugin/utils/three/CSS3DRender.js";
 import "../CSS3DRenderPlugin/utils/generateBehindFiveElement.js";
-import { waitFiveModelLoaded as T } from "../shared-utils/five/fiveModelLoad.js";
+import { waitFiveModelLoaded as z } from "../shared-utils/five/fiveModelLoad.js";
 import "animejs";
-import { notNil as R } from "../shared-utils/isNil.js";
-import { tagRendererMap as H } from "./utils/tagRenderer.js";
-import { ModelMakerPrismItem as L } from "./item/prismItem.js";
-import { ModelMakerPolygonItem as S } from "./item/polygonItem.js";
-import { boxVertex as u } from "../shared-utils/Object3DHelper/utils/boundingBox.js";
-import { getFiveDomEvent as z } from "./utils/getFiveDomEvent.js";
+import { notNil as P } from "../shared-utils/isNil.js";
+import { tagRendererMap as O } from "./utils/tagRenderer.js";
+import { ModelMakerPrismItem as B } from "./item/prismItem.js";
+import { ModelMakerPolygonItem as Q } from "./item/polygonItem.js";
+import { boxVertex as g } from "../shared-utils/Object3DHelper/utils/boundingBox.js";
+import { getFiveDomEvent as q } from "./utils/getFiveDomEvent.js";
 import "../base/BasePlugin.js";
 import "../shared-utils/Subscribe.js";
 import "../shared-utils/url/absoluteUrl.js";
@@ -79,119 +79,131 @@ import "../shared-utils/tag.js";
 import "../shared-utils/five/vector3ToScreen.js";
 import "../shared-utils/five/FiveDomEvents.js";
 import "../shared-utils/five/calculateThreeMouse.js";
-class Ke extends F {
-  constructor(e, i) {
-    var r;
+class Xe extends T {
+  constructor(e, t) {
+    var s, p;
     super(e);
-    n(this, "state");
-    n(this, "items", []);
-    n(this, "group", new p.Group());
-    n(this, "data");
-    n(this, "tagRendererMap", {});
-    n(this, "fiveDomEvents");
-    n(this, "zFightingOffset", 0);
-    n(this, "tagWrapper");
-    n(this, "occlusionVisibility");
-    n(this, "onFiveModeChange", (e) => {
-      const i = this.occlusionVisibility;
-      Array.isArray(i) && this.items.forEach((r) => {
-        r.model.setStyle instanceof Function && r.model.setStyle({ occlusionVisibility: i.includes(e) });
+    r(this, "state");
+    r(this, "items", []);
+    r(this, "group", new c.Group());
+    r(this, "data");
+    r(this, "tagRendererMap", {});
+    r(this, "fiveDomEvents");
+    r(this, "zFightingOffset", 0);
+    r(this, "tagWrapper");
+    r(this, "occlusionVisibility");
+    r(this, "occlusionMode");
+    r(this, "onFiveModeChange", (e) => {
+      const t = this.occlusionVisibility;
+      Array.isArray(t) && this.items.forEach((s) => {
+        s.model.setStyle instanceof Function && s.model.setStyle({ occlusionVisibility: t.includes(e) });
       });
     });
-    n(this, "handleEnable", () => {
-      var e, i;
-      this.five.scene.add(this.group), (i = (e = this.five.getElement()) == null ? void 0 : e.parentElement) == null || i.appendChild(this.tagWrapper), this.five.needsRender = !0, this.onFiveModeChange(this.five.getCurrentState().mode), this.five.on("modeChange", this.onFiveModeChange);
+    r(this, "handleEnable", () => {
+      var e, t;
+      this.five.scene.add(this.group), (t = (e = this.five.getElement()) == null ? void 0 : e.parentElement) == null || t.appendChild(this.tagWrapper), this.five.needsRender = !0, this.onFiveModeChange(this.five.getCurrentState().mode), this.five.on("modeChange", this.onFiveModeChange);
     });
-    n(this, "handleDisable", () => {
+    r(this, "handleDisable", () => {
       this.five.scene.remove(this.group), this.tagWrapper.remove(), this.five.needsRender = !0, this.five.off("modeChange", this.onFiveModeChange);
     });
-    n(this, "updateTagRenderer", () => {
+    r(this, "updateTagRenderer", () => {
       this.items.forEach((e) => {
-        var r;
-        const i = (r = this.tagRendererMap[e.type]) != null ? r : H[e.type];
-        i && e.__renderer !== i && (e.__renderer = i, typeof e.__disposeRenderer == "function" && e.__disposeRenderer(), e.tag.container.innerHTML = "", e.__disposeRenderer = i(e.tag.container, e));
+        var s;
+        const t = (s = this.tagRendererMap[e.type]) != null ? s : O[e.type];
+        t && e.__renderer !== t && (e.__renderer = t, typeof e.__disposeRenderer == "function" && e.__disposeRenderer(), e.tag.container.innerHTML = "", e.__disposeRenderer = t(e.tag.container, e));
       });
     });
-    this.group.name = "ModelMakerPluginGroup", this.state = { enabled: !0, visible: !0 }, this.occlusionVisibility = (r = i == null ? void 0 : i.occlusionVisibility) != null ? r : !1, this.fiveDomEvents = z(e), this.tagWrapper = (() => {
-      var l;
-      const t = document.createElement("div");
-      return t.style.position = "absolute", t.style.top = "0", t.style.left = "0", t.style.width = "100%", t.style.height = "100%", t.style.pointerEvents = "none", t.style.zIndex = `${(l = i == null ? void 0 : i.tagContainerZIndex) != null ? l : ""}`, t;
+    this.group.name = "ModelMakerPluginGroup", this.state = { enabled: !0, visible: !0 }, this.occlusionVisibility = (s = t == null ? void 0 : t.occlusionVisibility) != null ? s : !1, this.occlusionMode = (p = t == null ? void 0 : t.occlusionMode) != null ? p : "translucence", this.fiveDomEvents = q(e), this.tagWrapper = (() => {
+      var i;
+      const n = document.createElement("div");
+      return n.style.position = "absolute", n.style.top = "0", n.style.left = "0", n.style.width = "100%", n.style.height = "100%", n.style.pointerEvents = "none", n.style.zIndex = `${(i = t == null ? void 0 : t.tagContainerZIndex) != null ? i : ""}`, n;
     })(), e.scene.add(this.group), this.handleEnable(), window.__MODELMAKER_DEBUG__ = this;
   }
   load(e) {
-    return V(this, null, function* () {
-      var r;
-      if (this.clear(), this.data = e, yield T(this.five), this.data !== e)
+    return j(this, null, function* () {
+      var n;
+      if (this.clear(), this.data = e, yield z(this.five), this.data !== e)
         return;
       this.clear();
-      const i = typeof this.occlusionVisibility == "boolean" ? this.occlusionVisibility : !1;
-      (r = e == null ? void 0 : e.list) == null || r.forEach((t) => {
-        var l;
-        if (t.type === "triangles") {
-          const o = new D();
-          o.setPoints(t.object_data.points), o.setStyle({
-            color: t.object_data.color,
-            opacity: t.object_data.opacity,
-            lineColor: t.object_data.color,
-            occlusionVisibility: i
+      const t = typeof this.occlusionVisibility == "boolean" ? this.occlusionVisibility : !1, s = this.occlusionMode, p = 1.6;
+      (n = e == null ? void 0 : e.list) == null || n.forEach((i) => {
+        var h, m, w;
+        if (i.type === "triangles") {
+          const o = new S();
+          o.setPoints(i.object_data.points), o.setStyle({
+            color: i.object_data.color,
+            opacity: ((h = i.object_data.opacity) != null ? h : 0.4) / 2,
+            lineColor: i.object_data.color,
+            lineWidth: p,
+            occlusionVisibility: t,
+            occlusionMode: s
           }), this.fiveDomEvents.addEventListener(o, "hover", () => o.highlight()), this.fiveDomEvents.addEventListener(o, "unHover", () => o.unhighlight());
-          const s = new S({
+          const d = new Q({
             five: this.five,
             tagWrapper: this.tagWrapper,
             model: o,
             group: this.group,
-            type: t.type,
-            rawData: t
+            type: i.type,
+            rawData: i
           });
-          this.items.push(s);
-        } else if (t.type === "prism") {
-          const o = new C();
+          this.items.push(d);
+        } else if (i.type === "prism") {
+          const o = new k();
           this.zFightingOffset += 1e-4;
-          const s = t.object_data.points.map((c) => {
-            var b;
-            return [c[0], c[1] + ((b = t.object_data.fixedY) != null ? b : 0), c[2]];
+          const d = i.object_data.points.map((u) => {
+            var y;
+            return [u[0], u[1] + ((y = i.object_data.fixedY) != null ? y : 0), u[2]];
           });
-          s.push(s[0]);
-          const d = t.object_data.height + ((l = t.object_data.fixedHeight) != null ? l : 0) + this.zFightingOffset, g = I(s[0]).add(new p.Vector3().setY(d));
-          o.setPoints({ points: s, heightPoint: g }), o.setStyle({
-            color: t.object_data.color,
-            opacity: t.object_data.opacity,
-            lineColor: t.object_data.color,
-            occlusionVisibility: i
+          d.push(d[0]);
+          const v = i.object_data.height + ((m = i.object_data.fixedHeight) != null ? m : 0) + this.zFightingOffset, M = L(d[0]).add(new c.Vector3().setY(v));
+          o.setPoints({ points: d, heightPoint: M }), o.setStyle({
+            color: i.object_data.color,
+            opacity: ((w = i.object_data.opacity) != null ? w : 0.4) / 2,
+            lineColor: i.object_data.color,
+            lineWidth: p,
+            occlusionVisibility: t,
+            occlusionMode: s
           });
-          const f = new L({
+          const f = new B({
             five: this.five,
             tagWrapper: this.tagWrapper,
             model: o,
             group: this.group,
-            type: t.type,
-            rawData: t
+            type: i.type,
+            rawData: i
           });
           this.items.push(f);
-        } else if (t.type === "box") {
-          const o = new C(), { start: s, end: d, rotation: g = [0, 0, 0, 0], opacity: f, color: c } = t.object_data, b = new p.Vector3().fromArray(s), y = new p.Vector3().fromArray(d), W = new p.Euler().fromArray(g), v = new p.Quaternion().setFromEuler(W), w = v.clone().inverse(), E = new p.Vector3().lerpVectors(b, y, 0.5), M = E.clone().negate(), _ = b.clone().add(M).applyQuaternion(w), x = y.clone().add(M).applyQuaternion(w), m = new p.Box3(_.clone().max(x), _.clone().min(x));
+        } else if (i.type === "box") {
+          const o = new k(), { start: d, end: v, rotation: M = [0, 0, 0, 0], opacity: f, color: u } = i.object_data, y = new c.Vector3().fromArray(d), E = new c.Vector3().fromArray(v), F = new c.Euler().fromArray(M), _ = new c.Quaternion().setFromEuler(F), x = _.clone().inverse(), V = new c.Vector3().lerpVectors(y, E, 0.5), C = V.clone().negate(), R = y.clone().add(C).applyQuaternion(x), W = E.clone().add(C).applyQuaternion(x), b = new c.Box3(R.clone().max(W), R.clone().min(W));
           o.setPoints({
-            points: [u(m, 2), u(m, 3), u(m, 7), u(m, 6), u(m, 2)],
-            heightPoint: u(m, 0)
-          }), o.position.copy(E), o.quaternion.copy(v), o.setStyle({ color: c, opacity: f, lineColor: c, occlusionVisibility: i });
-          const j = new A({
+            points: [g(b, 2), g(b, 3), g(b, 7), g(b, 6), g(b, 2)],
+            heightPoint: g(b, 0)
+          }), o.position.copy(V), o.quaternion.copy(_), o.setStyle({
+            color: u,
+            opacity: (f != null ? f : 0.4) / 2,
+            lineColor: u,
+            lineWidth: p,
+            occlusionVisibility: t,
+            occlusionMode: s
+          });
+          const A = new H({
             five: this.five,
             tagWrapper: this.tagWrapper,
             model: o,
             group: this.group,
-            type: t.type,
-            rawData: t
+            type: i.type,
+            rawData: i
           });
-          this.items.push(j);
+          this.items.push(A);
         }
       }), this.five.needsRender = !0, this.state.enabled ? this.handleEnable() : this.handleDisable(), this.state.visible ? this.handleShow() : this.handleHide(), this.updateTagRenderer(), this.hooks.emit("dataLoaded", e);
     });
   }
   setState(e) {
-    R(e.enabled) && this.state.enabled !== e.enabled && (this.state.enabled = e.enabled, e.enabled ? this.handleEnable() : this.handleDisable(), this.hooks.emit(e.enabled ? "enable" : "disable", { userAction: "我不知道捏" }), this.hooks.emit("stateChange", { state: this.state, userAction: "我不知道捏" })), R(e.visible) && this.state.visible !== e.visible && (this.state.visible = e.visible, e.visible ? this.handleShow() : this.handleHide(), this.hooks.emit(e.visible ? "show" : "hide", { userAction: "我不知道捏" }), this.hooks.emit("stateChange", { state: this.state, userAction: "我不知道捏" }));
+    P(e.enabled) && this.state.enabled !== e.enabled && (this.state.enabled = e.enabled, e.enabled ? this.handleEnable() : this.handleDisable(), this.hooks.emit(e.enabled ? "enable" : "disable", { userAction: "我不知道捏" }), this.hooks.emit("stateChange", { state: this.state, userAction: "我不知道捏" })), P(e.visible) && this.state.visible !== e.visible && (this.state.visible = e.visible, e.visible ? this.handleShow() : this.handleHide(), this.hooks.emit(e.visible ? "show" : "hide", { userAction: "我不知道捏" }), this.hooks.emit("stateChange", { state: this.state, userAction: "我不知道捏" }));
   }
   getItemById(e) {
-    return this.items.find((i) => i.rawData.id === e);
+    return this.items.find((t) => t.rawData.id === e);
   }
   registerTagRenderer(e) {
     this.tagRendererMap = e, this.updateTagRenderer();
@@ -225,5 +237,5 @@ class Ke extends F {
   }
 }
 export {
-  Ke as Controller
+  Xe as Controller
 };

package/libs/ModelMakerPlugin/index.d.ts

@@ -3,6 +3,7 @@ import { Controller } from './Controller';
 export declare const ModelMakerPlugin: (five: import("@realsee/five").Five, config?: {
     tagContainerZIndex?: number;
     occlusionVisibility?: boolean | import("@realsee/five").Mode[];
+    occlusionMode?: "translucence" | "depthTest";
 }) => ModelMakerPluginType.ModelMakerController;
 export type { Controller as ModelMakerPluginInstance };
 export type { ModelMakerPluginType };

package/libs/Sculpt/Meshes/Box.d.ts

@@ -24,6 +24,7 @@ export declare class BoxMesh extends IObject3D {
     get lineColor(): THREE.Color;
     get lineWidth(): number;
     get occlusionVisibility(): boolean;
+    get occlusionMode(): "translucence" | "depthTest";
     constructor(params?: Partial<BoxStyle & BoxData>);
     setPoints(params: Partial<BoxData>): void;
     setBottomPoints(points: AnyPositions): void;

package/libs/Sculpt/Meshes/Box.js

@@ -1,7 +1,7 @@
-var p = Object.defineProperty;
-var a = (e, o, t) => o in e ? p(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t;
-var n = (e, o, t) => (a(e, typeof o != "symbol" ? o + "" : o, t), t);
-import { IObject3D as d } from "../../shared-utils/three/IObject3D.js";
+var d = Object.defineProperty;
+var p = (e, i, t) => i in e ? d(e, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[i] = t;
+var n = (e, i, t) => (p(e, typeof i != "symbol" ? i + "" : i, t), t);
+import { IObject3D as a } from "../../shared-utils/three/IObject3D.js";
 import { anyPositionToVector3 as c } from "../../shared-utils/positionToVector3.js";
 import "hammerjs";
 import "three";
@@ -12,7 +12,7 @@ import "animejs";
 import { notNil as r } from "../../shared-utils/isNil.js";
 import { RectangleWithEdgeMesh as P } from "./RectangleWithEdge.js";
 import { RectangleMesh as m } from "./Rectangle.js";
-class T extends d {
+class T extends a {
   constructor(t) {
     super();
     n(this, "name", "BoxMesh");
@@ -41,40 +41,45 @@ class T extends d {
     var t;
     return (t = this.bottomPlane) == null ? void 0 : t.occlusionVisibility;
   }
+  get occlusionMode() {
+    var t;
+    return (t = this.bottomPlane) == null ? void 0 : t.occlusionMode;
+  }
   setPoints(t) {
     r(t.heightPoint) && this.setTopHeightPoint(t.heightPoint), r(t.points) && this.setBottomPoints(t.points);
   }
   setBottomPoints(t) {
-    const i = t.map(c).filter(r);
-    if (i.length < 3) {
+    const o = t.map(c).filter(r);
+    if (o.length < 3) {
       console.error("Invalid position");
       return;
     }
-    this.bottomPlane.setPoints(i), this.heightPoint && this.setTopHeightPoint(this.heightPoint);
+    this.bottomPlane.setPoints(o), this.heightPoint && this.setTopHeightPoint(this.heightPoint);
   }
   setTopHeightPoint(t) {
     if (!this.bottomPlane.points.length)
       return;
-    const i = c(t);
-    this.heightPoint = i, this.addIfNotExists(this.topPlane);
-    const h = this.bottomPlane.projectPoint(i), s = i.clone().sub(h), l = this.bottomPlane.points.map((g) => g.clone().add(s));
+    const o = c(t);
+    this.heightPoint = o, this.addIfNotExists(this.topPlane);
+    const h = this.bottomPlane.projectPoint(o), s = o.clone().sub(h), l = this.bottomPlane.points.map((g) => g.clone().add(s));
     this.topPlane.setPoints(l), this.up.copy(s.clone().normalize()), this.setEdgePlanes();
   }
   setEdgePlanes() {
     for (let t = 0; t < 4; t++) {
-      let i = this.edgePlanes[t];
-      i || (this.edgePlanes[t] = new P({
+      let o = this.edgePlanes[t];
+      o || (this.edgePlanes[t] = new P({
         color: this.color,
         lineColor: this.lineColor,
         lineWidth: this.lineWidth,
-        occlusionVisibility: this.occlusionVisibility
-      }), i = this.edgePlanes[t]);
+        occlusionVisibility: this.occlusionVisibility,
+        occlusionMode: this.occlusionMode
+      }), o = this.edgePlanes[t]);
       const h = this.topPlane.sortedPoint, s = this.bottomPlane.sortedPoint, l = t === 3 ? 0 : t + 1;
-      i.setPoints([h[t], s[l], s[t]]), this.addIfNotExists(i);
+      o.setPoints([h[t], s[l], s[t]]), this.addIfNotExists(o);
     }
   }
   setStyle(t) {
-    this.planes.forEach((i) => i.setStyle(t));
+    this.planes.forEach((o) => o.setStyle(t));
   }
   highlight() {
     this.planes.forEach((t) => t.highlight());

package/libs/Sculpt/Meshes/Line.d.ts

@@ -14,10 +14,12 @@ export declare class LineMesh extends IObject3D {
     get color(): THREE.Color;
     get dashed(): boolean;
     get occlusionVisibility(): boolean;
+    get occlusionMode(): "translucence" | "depthTest";
     protected highlighted: boolean;
     private line;
     private backLine;
     private opacityBeforeHighlight;
+    private paramsStyle;
     constructor(params?: Partial<LineMeshStyle & LineData>);
     setPoints(points: AnyPositions): void;
     setResolution(width: number, height: number): void;

package/libs/Sculpt/Meshes/Line.js

@@ -1,24 +1,33 @@
 var k = Object.defineProperty;
-var E = (h, o, e) => o in h ? k(h, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[o] = e;
-var l = (h, o, e) => (E(h, typeof o != "symbol" ? o + "" : o, e), e);
-import * as r from "three";
-import { DEFAULT_LINE_COLOR as g, DEFAULT_LINE_WIDTH as w, DEFAULT_HIGHLIGHT_OPACITY as L } from "../utils/color.js";
-import { LineGeometry as y, LineMaterial as a, THREE_Line2 as H } from "../../shared-utils/five/FiveLine.js";
-import { anyPositionToVector3 as C } from "../../shared-utils/positionToVector3.js";
-import { IObject3D as D } from "../../shared-utils/three/IObject3D.js";
+var y = Object.getOwnPropertySymbols;
+var E = Object.prototype.hasOwnProperty, w = Object.prototype.propertyIsEnumerable;
+var u = (o, n, e) => n in o ? k(o, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[n] = e, f = (o, n) => {
+  for (var e in n || (n = {}))
+    E.call(n, e) && u(o, e, n[e]);
+  if (y)
+    for (var e of y(n))
+      w.call(n, e) && u(o, e, n[e]);
+  return o;
+};
+var s = (o, n, e) => (u(o, typeof n != "symbol" ? n + "" : n, e), e);
+import * as d from "three";
+import { DEFAULT_LINE_COLOR as L, DEFAULT_LINE_WIDTH as H, DEFAULT_HIGHLIGHT_OPACITY as b } from "../utils/color.js";
+import { LineGeometry as _, LineMaterial as C, THREE_Line2 as D } from "../../shared-utils/five/FiveLine.js";
+import { anyPositionToVector3 as M } from "../../shared-utils/positionToVector3.js";
+import { IObject3D as R } from "../../shared-utils/three/IObject3D.js";
 import "hammerjs";
 import "../../vendor/@tweenjs/tween/dist/tween.esm.js.js";
 import "../../CSS3DRenderPlugin/utils/three/CSS3DRender.js";
 import "../../CSS3DRenderPlugin/utils/generateBehindFiveElement.js";
 import "animejs";
-import { notNil as s } from "../../shared-utils/isNil.js";
-class b extends a {
+import { notNil as h } from "../../shared-utils/isNil.js";
+class S extends C {
   constructor(e) {
     var t, i;
     super(e);
-    l(this, "_three_color");
-    s(e == null ? void 0 : e.color) && (this.three_color = (t = e == null ? void 0 : e.color) != null ? t : 16777215), Object.keys(e).forEach((n) => {
-      ["color", "dashed", "dashScale", "dashSize", "gapSize", "resolution"].includes(n) || n in this && (this[n] = e[n]);
+    s(this, "_three_color");
+    h(e == null ? void 0 : e.color) && (this.three_color = (t = e == null ? void 0 : e.color) != null ? t : 16777215), Object.keys(e).forEach((l) => {
+      ["color", "dashed", "dashScale", "dashSize", "gapSize", "resolution"].includes(l) || l in this && (this[l] = e[l]);
     }), this.setDashed((i = e == null ? void 0 : e.dashed) != null ? i : !1);
   }
   get three_color() {
@@ -31,31 +40,33 @@ class b extends a {
     e ? this.defines.USE_DASH = "" : delete this.defines.USE_DASH, this.needsUpdate = !0;
   }
 }
-class _ extends H {
+class T extends D {
   constructor(e, t) {
     super(e, t);
-    l(this, "name", "Line3");
+    s(this, "name", "Line3");
   }
 }
-class P extends D {
+class z extends R {
   constructor(e) {
-    var c, d, f, u;
+    var r, c, a, g;
     super();
-    l(this, "name", "LineMesh");
-    l(this, "points");
-    l(this, "highlighted", !1);
-    l(this, "line");
-    l(this, "backLine");
-    l(this, "opacityBeforeHighlight");
-    const t = new y(), i = new b({
-      color: new r.Color((c = e == null ? void 0 : e.lineColor) != null ? c : g),
-      linewidth: (d = e == null ? void 0 : e.lineWidth) != null ? d : w,
+    s(this, "name", "LineMesh");
+    s(this, "points");
+    s(this, "highlighted", !1);
+    s(this, "line");
+    s(this, "backLine");
+    s(this, "opacityBeforeHighlight");
+    s(this, "paramsStyle", {});
+    this.paramsStyle = e != null ? e : {};
+    const t = new _(), i = new S({
+      color: new d.Color((r = e == null ? void 0 : e.lineColor) != null ? r : L),
+      linewidth: (c = e == null ? void 0 : e.lineWidth) != null ? c : H,
       dashScale: 40,
       opacity: 1,
       transparent: !0,
-      dashed: (f = e == null ? void 0 : e.dashed) != null ? f : !1
-    }), n = new b({
-      color: new r.Color((u = e == null ? void 0 : e.lineColor) != null ? u : g),
+      dashed: (a = e == null ? void 0 : e.dashed) != null ? a : !1
+    }), l = new S({
+      color: new d.Color((g = e == null ? void 0 : e.lineColor) != null ? g : L),
       linewidth: i == null ? void 0 : i.linewidth,
       dashScale: i.dashScale,
       depthTest: !1,
@@ -65,44 +76,50 @@ class P extends D {
       dashed: i.dashed,
       resolution: i.resolution
     });
-    this.line = new _(t, i), this.backLine = new _(t, n), this.line.renderOrder = 1, this.backLine.renderOrder = 0, this.line.name = "lineFrontMaterial", this.backLine.name = "lineBackMaterial", e && this.setStyle(e), e != null && e.points && this.setPoints(e.points);
+    this.line = new T(t, i), this.backLine = new T(t, l), this.line.renderOrder = 1, this.backLine.renderOrder = 0, this.line.name = "lineFrontMaterial", this.backLine.name = "lineBackMaterial", e && this.setStyle(e), e != null && e.points && this.setPoints(e.points);
   }
   get lineWidth() {
     return this.line.material.linewidth;
   }
   get color() {
-    return new r.Color(this.line.material.three_color);
+    return new d.Color(this.line.material.three_color);
   }
   get dashed() {
     return this.line.material.dashed;
   }
   get occlusionVisibility() {
-    return this.backLine.visible;
+    return this.backLine.visible || this.line.material.depthTest === !1;
+  }
+  get occlusionMode() {
+    return this.line.material.depthTest === !1 ? "depthTest" : "translucence";
   }
   setPoints(e) {
-    const t = e.map(C).filter(s);
+    const t = e.map(M).filter(h);
     if (this.points = t, t.length < 2)
       return;
     this.addIfNotExists(this.line, this.backLine);
-    const i = t.flatMap((n) => [n.x, n.y, n.z]);
-    i.length > 2 && (this.line.geometry.dispose(), this.line.geometry = new y(), this.backLine.geometry = this.line.geometry), this.line.geometry.setPositions(i), this.line.computeLineDistances(), this.needsRender = !0;
+    const i = t.flatMap((l) => [l.x, l.y, l.z]);
+    i.length > 2 && (this.line.geometry.dispose(), this.line.geometry = new _(), this.backLine.geometry = this.line.geometry), this.line.geometry.setPositions(i), this.line.computeLineDistances(), this.needsRender = !0;
   }
   setResolution(e, t) {
     const i = this.line.material.resolution;
     (i.x !== e || i.y !== t) && (i.set(e, t), this.needsRender = !0);
-    const n = this.backLine.material.resolution;
-    (n.x !== e || n.y !== t) && (n.set(e, t), this.needsRender = !0);
+    const l = this.backLine.material.resolution;
+    (l.x !== e || l.y !== t) && (l.set(e, t), this.needsRender = !0);
   }
   setStyle(e) {
-    s(e.lineColor) && (this.line.material.three_color = new r.Color(e.lineColor), this.backLine.material.three_color = new r.Color(e.lineColor)), s(e.lineWidth) && (this.line.material.linewidth = e.lineWidth, this.backLine.material.linewidth = e.lineWidth), s(e.dashed) && (this.line.material.setDashed(e.dashed), this.backLine.material.setDashed(e.dashed)), s(e.occlusionVisibility) && (this.backLine.visible = e.occlusionVisibility), this.needsRender = !0;
+    var l, r, c;
+    this.paramsStyle = f(f({}, this.paramsStyle), e), h(e.lineColor) && (this.line.material.three_color = new d.Color(e.lineColor), this.backLine.material.three_color = new d.Color(e.lineColor)), h(e.lineWidth) && (this.line.material.linewidth = e.lineWidth, this.backLine.material.linewidth = e.lineWidth), h(e.dashed) && (this.line.material.setDashed(e.dashed), this.backLine.material.setDashed(e.dashed));
+    const t = (l = e.occlusionVisibility) != null ? l : this.paramsStyle.occlusionVisibility, i = (c = (r = e.occlusionMode) != null ? r : this.paramsStyle.occlusionMode) != null ? c : "translucence";
+    h(t) && (t ? i === "depthTest" ? (this.line.material.depthTest = !1, this.backLine.visible = !1) : i === "translucence" && (this.line.material.depthTest = !0, this.backLine.visible = !0) : (this.line.material.depthTest = !0, this.backLine.visible = !1)), this.needsRender = !0;
   }
   highlight() {
-    this.highlighted || (this.highlighted = !0, this.opacityBeforeHighlight = this.line.material.opacity, this.line.material.opacity = this.opacityBeforeHighlight * L, this.backLine.material.opacity = this.backLine.material.opacity * L, this.needsRender = !0);
+    this.highlighted || (this.highlighted = !0, this.opacityBeforeHighlight = this.line.material.opacity, this.line.material.opacity = this.opacityBeforeHighlight * b, this.backLine.material.opacity = this.backLine.material.opacity * b, this.needsRender = !0);
   }
   unhighlight() {
     this.highlighted && (this.highlighted = !1, this.line.material.opacity = this.opacityBeforeHighlight, this.backLine.material.opacity = 0.2, this.needsRender = !0);
   }
 }
 export {
-  P as LineMesh
+  z as LineMesh
 };