u-space 0.0.5 → 0.0.7

package/dist/index.js

@@ -1,20 +1,27 @@
-import { Raycaster as me, Vector2 as S, RenderPipeline as Ae, Sphere as ge, Box3 as fe, Spherical as T, Matrix4 as Re, Quaternion as _e, Vector4 as Ne, Vector3 as ee, MathUtils as Ue, PMREMGenerator as De, OrthographicCamera as $, TimestampQuery as je, Cache as ke, EventDispatcher as Ge, Timer as Fe, PerspectiveCamera as X, WebGPURenderer as He, PCFShadowMap as ze, AgXToneMapping as $e, Scene as We, Color as te, MeshStandardNodeMaterial as I, Loader as Qe, LoaderUtils as L, FileLoader as we, TextureLoader as ye, Group as Q, SRGBColorSpace as ve, RepeatWrapping as ne, BufferGeometry as Ke, BufferAttribute as ie, Mesh as F, FrontSide as Xe, BackSide as qe, DoubleSide as Ye, REVISION as re, CubeTextureLoader as Je, EquirectangularReflectionMapping as Ze, Sprite as Ve, AnimationMixer as et, LoopRepeat as tt, LoopOnce as st, SphereGeometry as nt, TubeGeometry as it, LineCurve3 as rt, CatmullRomCurve3 as at, SpriteNodeMaterial as ot, CanvasTexture as ct, ShapeGeometry as ht, Shape as be, ExtrudeGeometry as lt, PlaneGeometry as dt, CircleGeometry as pt } from "three/webgpu";
-import { pass as Z, blendColor as ut, color as U, uv as ae, time as q, pow as Y, sin as oe, mix as J, mx_noise_float as ce, Fn as Te, userData as G, materialColor as he, select as V, materialOpacity as mt, vec3 as gt } from "three/tsl";
-import Ce from "camera-controls";
-import { RoomEnvironment as ft } from "three/addons/environments/RoomEnvironment.js";
-import { ViewHelper as wt } from "three/addons/helpers/ViewHelper.js";
-import { GLTFLoader as xe } from "three/addons/loaders/GLTFLoader.js";
-import { FBXLoader as yt } from "three/addons/loaders/FBXLoader.js";
-import { OBJLoader as vt } from "three/addons/loaders/OBJLoader.js";
-import { STLLoader as bt } from "three/addons/loaders/STLLoader.js";
-import { DRACOLoader as Tt } from "three/addons/loaders/DRACOLoader.js";
-import { KTX2Loader as Ct } from "three/addons/loaders/KTX2Loader.js";
-import { MeshoptDecoder as le } from "three/addons/libs/meshopt_decoder.module.js";
-import { HDRLoader as xt } from "three/addons/loaders/HDRLoader.js";
-import { clone as Mt } from "three/addons/utils/SkeletonUtils.js";
-import { Color as D } from "three";
-import { Easing as d, Tween as Et } from "three/addons/libs/tween.module.js";
-class Ot {
+import { Raycaster as Te, Vector2 as R, RenderPipeline as $e, PerspectiveCamera as K, Sphere as Se, Box3 as xe, Spherical as C, Matrix4 as We, Quaternion as Ke, Vector4 as Qe, Vector3 as oe, MathUtils as Xe, PMREMGenerator as qe, OrthographicCamera as Q, TimestampQuery as Ye, Cache as Je, EventDispatcher as Ze, Timer as Ve, WebGPURenderer as et, PCFShadowMap as tt, AgXToneMapping as st, Scene as it, Color as V, MeshStandardNodeMaterial as L, Loader as nt, LoaderUtils as I, FileLoader as Ee, TextureLoader as Me, Group as ee, SRGBColorSpace as Pe, RepeatWrapping as ce, BufferGeometry as rt, BufferAttribute as he, Mesh as z, FrontSide as at, BackSide as ot, DoubleSide as ct, REVISION as le, CubeTextureLoader as ht, EquirectangularReflectionMapping as lt, Sprite as dt, AnimationMixer as pt, LoopRepeat as ut, LoopOnce as mt, SphereGeometry as gt, TubeGeometry as ft, LineCurve3 as yt, CatmullRomCurve3 as wt, SpriteNodeMaterial as vt, CanvasTexture as bt, ShapeGeometry as Ct, Shape as Oe, ExtrudeGeometry as Tt, PlaneGeometry as St, CircleGeometry as xt } from "three/webgpu";
+import { pass as re, mrt as Et, output as Mt, add as de, blendColor as Pt, emissive as Ot, normalView as Rt, velocity as It, color as j, uv as pe, time as X, pow as q, sin as ae, mix as Y, mx_noise_float as ue, Fn as Re, userData as O, materialColor as me, select as J, materialOpacity as Lt, vec3 as At } from "three/tsl";
+import { bloom as Nt } from "three/addons/tsl/display/BloomNode.js";
+import { ssgi as Bt } from "three/addons/tsl/display/SSGINode.js";
+import { traa as _t } from "three/addons/tsl/display/TRAANode.js";
+import Ie from "camera-controls";
+import { RoomEnvironment as Dt } from "three/addons/environments/RoomEnvironment.js";
+import { ViewHelper as jt } from "three/addons/helpers/ViewHelper.js";
+import { CSS2DRenderer as Ut, CSS2DObject as kt } from "three/addons/renderers/CSS2DRenderer.js";
+import { CSS2DObject as pi } from "three/addons/renderers/CSS2DRenderer.js";
+import { CSS3DRenderer as Gt, CSS3DSprite as Ft, CSS3DObject as zt } from "three/addons/renderers/CSS3DRenderer.js";
+import { CSS3DObject as mi, CSS3DSprite as gi } from "three/addons/renderers/CSS3DRenderer.js";
+import { GLTFLoader as Le } from "three/addons/loaders/GLTFLoader.js";
+import { FBXLoader as Ht } from "three/addons/loaders/FBXLoader.js";
+import { OBJLoader as $t } from "three/addons/loaders/OBJLoader.js";
+import { STLLoader as Wt } from "three/addons/loaders/STLLoader.js";
+import { DRACOLoader as Kt } from "three/addons/loaders/DRACOLoader.js";
+import { KTX2Loader as Qt } from "three/addons/loaders/KTX2Loader.js";
+import { MeshoptDecoder as ge } from "three/addons/libs/meshopt_decoder.module.js";
+import { HDRLoader as Xt } from "three/addons/loaders/HDRLoader.js";
+import { clone as qt } from "three/addons/utils/SkeletonUtils.js";
+import { Color as U } from "three";
+import { Easing as u, Tween as Yt } from "three/addons/libs/tween.module.js";
+class Jt {
   /** The type of event (e.g., 'click', 'pointerdown'). */
   type;
   /** The original 3D object that triggered the event. */
@@ -42,15 +49,15 @@ class Ot {
     return this._propagationStopped;
   }
 }
-class Pt {
+class Zt {
   domElement;
   scene;
   camera;
-  raycaster = new me();
-  pointer = new S();
+  raycaster = new Te();
+  pointer = new R();
   hoveredObject = null;
   pointerDownTime = 0;
-  pointerDownPos = new S();
+  pointerDownPos = new R();
   clickTimer = null;
   longPressThreshold = 500;
   moveThreshold = 0.01;
@@ -85,16 +92,16 @@ class Pt {
   /**
    * Dispatches an event to the target object and bubbles up the parent chain.
    */
-  _dispatchToTarget(e, t, s, n) {
-    const i = new Ot({
+  _dispatchToTarget(e, t, s, i) {
+    const n = new Jt({
       type: e,
       target: t,
       intersect: s,
-      originalEvent: n
+      originalEvent: i
     });
     let r = t;
-    for (; r && !i.propagationStopped; )
-      i.currentTarget = r, r.dispatchEvent({ type: e, event: i }), r = r.parent;
+    for (; r && !n.propagationStopped; )
+      n.currentTarget = r, r.dispatchEvent({ type: e, event: n }), r = r.parent;
   }
   /**
    * Handles a DOM event by raycasting and dispatching to the first intersected object.
@@ -103,8 +110,8 @@ class Pt {
     this._updatePointer(t);
     const s = this._getIntersects();
     if (s.length === 0) return;
-    const n = s[0];
-    this._dispatchToTarget(e, n.object, n, t);
+    const i = s[0];
+    this._dispatchToTarget(e, i.object, i, t);
   }
   _onClick = (e) => {
     const t = Date.now() - this.pointerDownTime, s = this.pointer.distanceTo(this.pointerDownPos);
@@ -137,8 +144,8 @@ class Pt {
   _onPointerMove = (e) => {
     if (!this.pointerMoveEventsEnabled) return;
     this._updatePointer(e);
-    const t = this._getIntersects(), s = t.length > 0 ? t[0].object : null, n = t.length > 0 ? t[0] : null;
-    this.hoveredObject !== s && (this.hoveredObject && this._dispatchToTarget("pointerleave", this.hoveredObject, null, e), this.hoveredObject = s, s && n && this._dispatchToTarget("pointerenter", s, n, e)), s && n && this._dispatchToTarget("pointermove", s, n, e);
+    const t = this._getIntersects(), s = t.length > 0 ? t[0].object : null, i = t.length > 0 ? t[0] : null;
+    this.hoveredObject !== s && (this.hoveredObject && this._dispatchToTarget("pointerleave", this.hoveredObject, null, e), this.hoveredObject = s, s && i && this._dispatchToTarget("pointerenter", s, i, e)), s && i && this._dispatchToTarget("pointermove", s, i, e);
   };
   /**
    * Cleans up event listeners.
@@ -147,7 +154,7 @@ class Pt {
     this.domElement.removeEventListener("click", this._onClick), this.domElement.removeEventListener("dblclick", this._onDblClick), this.domElement.removeEventListener("contextmenu", this._onContextMenu), this.domElement.removeEventListener("pointerdown", this._onPointerDown), this.domElement.removeEventListener("pointerup", this._onPointerUp), this.domElement.removeEventListener("pointermove", this._onPointerMove), this.hoveredObject = null;
   }
 }
-class St {
+class Vt {
   idMap = /* @__PURE__ */ new Map();
   nameMap = /* @__PURE__ */ new Map();
   typeMap = /* @__PURE__ */ new Map();
@@ -250,54 +257,151 @@ class St {
     return this.allObjects.size;
   }
 }
-class Lt extends Ae {
+class es extends $e {
   scene;
   camera;
-  currentOutputNode;
+  scenePass;
   needsUpdateOutputNode;
-  #e;
+  #r;
+  #t;
+  #s = !1;
+  #a = { strength: 1, radius: 0, threshold: 0 };
+  #c = null;
+  #n = !1;
+  #e = {
+    sliceCount: 1,
+    stepCount: 12,
+    aoIntensity: 1,
+    giIntensity: 10,
+    radius: 12,
+    thickness: 1
+  };
+  #h = null;
+  #o = !1;
+  #l = null;
+  #d = null;
   constructor(...e) {
-    const [t, s, n] = e;
-    super(t), this.scene = s, this.camera = n, this.currentOutputNode = Z(s, n), this.needsUpdateOutputNode = !0, this.#e = /* @__PURE__ */ new Set();
+    const [t, s, i] = e;
+    super(t), this.scene = s, this.camera = i, this.scenePass = re(s, i), this.needsUpdateOutputNode = !0, this.#r = /* @__PURE__ */ new Set(), this.#t = [], this.#p();
+  }
+  /** @deprecated Use `scenePass` instead */
+  get currentOutputNode() {
+    return this.scenePass;
   }
   addOverlayPass(e) {
-    this.#e.add(e), this.needsUpdateOutputNode = !0;
+    this.#r.add(e), this.needsUpdateOutputNode = !0;
   }
   removeOverlayPass(e) {
-    this.#e.delete(e), this.needsUpdateOutputNode = !0;
+    this.#r.delete(e), this.needsUpdateOutputNode = !0;
   }
   setCamera(e) {
-    this.camera = e, this.needsUpdateOutputNode = !0;
+    this.camera = e, this.#i();
   }
+  /** @deprecated Use `setOutputComposer` instead */
   setCurrentOutputNode(e) {
-    this.currentOutputNode.dispose(), this.currentOutputNode = e, this.needsUpdateOutputNode = !0;
+    this.setOutputComposer(() => e);
   }
+  /** @deprecated Use `setOutputComposer(null)` instead */
   resetCurrentOutputNode() {
-    this.currentOutputNode.dispose(), this.currentOutputNode = Z(this.scene, this.camera), this.needsUpdateOutputNode = !0;
+    this.setOutputComposer(null);
+  }
+  setOutputComposer(e) {
+    this.#d = e, this.needsUpdateOutputNode = !0;
+  }
+  enableBloom(e) {
+    e && Object.assign(this.#a, e), this.#s = !0, this.#i();
+  }
+  disableBloom() {
+    this.#s = !1, this.#c = null, this.#i();
+  }
+  updateBloom(e) {
+    Object.assign(this.#a, e), this.#s && (this.needsUpdateOutputNode = !0);
+  }
+  enableSSGI(e) {
+    e && Object.assign(this.#e, e), this.#n = !0, this.#i();
+  }
+  disableSSGI() {
+    this.#n = !1, this.#h = null, this.#i();
+  }
+  updateSSGI(e) {
+    if (Object.assign(this.#e, e), this.#h) {
+      const t = this.#h;
+      e.sliceCount !== void 0 && (t.sliceCount.value = e.sliceCount), e.stepCount !== void 0 && (t.stepCount.value = e.stepCount), e.aoIntensity !== void 0 && (t.aoIntensity.value = e.aoIntensity), e.giIntensity !== void 0 && (t.giIntensity.value = e.giIntensity), e.radius !== void 0 && (t.radius.value = e.radius), e.thickness !== void 0 && (t.thickness.value = e.thickness);
+    }
+  }
+  enableTRAA() {
+    this.#o = !0, this.#i();
+  }
+  disableTRAA() {
+    this.#o = !1, this.#l = null, this.#i();
+  }
+  #i() {
+    const e = this.scenePass;
+    this.scenePass = re(this.scene, this.camera), this.#p(), this.needsUpdateOutputNode = !0, e.dispose();
+  }
+  #p() {
+    if (this.#s || this.#n || this.#o) {
+      const t = { output: Mt };
+      this.#s && (t.emissive = Ot), this.#n && (t.normal = Rt), this.#o && (t.velocity = It), this.scenePass.setMRT(Et(t));
+    }
   }
-  #t() {
-    let e = this.currentOutputNode;
-    this.#e.size > 0 && this.#e.forEach((t) => {
-      e = ut(e, t);
+  #u() {
+    for (const e of this.#t)
+      e.dispose();
+    this.#t = [];
+  }
+  #m() {
+    let e = this.scenePass.getTextureNode();
+    if (this.#n)
+      if (!(this.camera instanceof K))
+        console.warn("RenderPipeline: SSGI requires a PerspectiveCamera, skipping.");
+      else {
+        const t = this.scenePass.getTextureNode(), s = this.scenePass.getTextureNode("depth"), i = this.scenePass.getTextureNode("normal"), n = Bt(t, s, i, this.camera);
+        n.sliceCount.value = this.#e.sliceCount, n.stepCount.value = this.#e.stepCount, n.aoIntensity.value = this.#e.aoIntensity, n.giIntensity.value = this.#e.giIntensity, n.radius.value = this.#e.radius, n.thickness.value = this.#e.thickness, this.#h = n, e = de(e, n), this.#t.push(n);
+      }
+    if (this.#s) {
+      const t = this.scenePass.getTextureNode("emissive");
+      this.#c = Nt(
+        t,
+        this.#a.strength,
+        this.#a.radius,
+        this.#a.threshold
+      ), e = de(e, this.#c), this.#t.push(this.#c);
+    }
+    return e;
+  }
+  #g() {
+    this.#u();
+    let e;
+    if (this.#d ? e = this.#d(this.scenePass) : this.#s || this.#n ? e = this.#m() : e = this.scenePass, this.#o) {
+      const t = this.scenePass.getTextureNode("depth"), s = this.scenePass.getTextureNode("velocity");
+      this.#l = _t(e, t, s, this.camera), this.#t.push(this.#l), e = this.#l;
+    }
+    this.#r.size > 0 && this.#r.forEach((t) => {
+      const s = Pt(e, t);
+      this.#t.push(s), e = s;
     }), this.outputNode = e, this.needsUpdate = !0;
   }
   render() {
-    this.needsUpdateOutputNode && (this.#t(), this.needsUpdateOutputNode = !1), super.render();
+    this.needsUpdateOutputNode && (this.#g(), this.needsUpdateOutputNode = !1), super.render();
+  }
+  dispose() {
+    this.#u(), this.scenePass.dispose(), super.dispose();
   }
 }
-const It = {
-  Vector2: S,
-  Vector3: ee,
-  Vector4: Ne,
-  Quaternion: _e,
-  Matrix4: Re,
-  Spherical: T,
-  Box3: fe,
-  Sphere: ge,
-  Raycaster: me
+const ts = {
+  Vector2: R,
+  Vector3: oe,
+  Vector4: Qe,
+  Quaternion: Ke,
+  Matrix4: We,
+  Spherical: C,
+  Box3: xe,
+  Sphere: Se,
+  Raycaster: Te
 };
-Ce.install({ THREE: It });
-class Bt extends Ce {
+Ie.install({ THREE: ts });
+class ss extends Ie {
   constructor(...e) {
     super(...e), this.minDistance = 0.2, this.smoothTime = 0.2, this.dollySpeed = 0.2;
   }
@@ -305,62 +409,69 @@ class Bt extends Ce {
    * Set absolute angle for azimuth to avoid spinning
    */
   absoluteRotations() {
-    this.azimuthAngle = At(this.azimuthAngle, 0);
+    this.azimuthAngle = is(this.azimuthAngle, 0);
   }
   async flyToBox(e, t = {}) {
     if (e.isEmpty())
       return console.warn("CameraControls.flyToBox: The provided Box3 is empty."), !1;
     this.absoluteRotations();
-    const { viewpoint: s = "frontTop", enableTransition: n = !0, padding: i = 0.1, cover: r = !1 } = t, a = [];
+    const { viewpoint: s = "frontTop", enableTransition: i = !0, padding: n = 0.1, cover: r = !1 } = t, o = [];
     if (s !== "current") {
-      const o = de[s.toUpperCase()] ?? de.FRONTTOP, h = o.theta, l = o.phi;
-      a.push(
-        this.fitToBox(e, n, {
-          paddingLeft: i,
-          paddingRight: i,
-          paddingTop: i,
-          paddingBottom: i,
+      const c = fe[s.toUpperCase()] ?? fe.FRONTTOP, h = c.theta, l = c.phi;
+      o.push(
+        this.fitToBox(e, i, {
+          paddingLeft: n,
+          paddingRight: n,
+          paddingTop: n,
+          paddingBottom: n,
           cover: r
         })
-      ), a.push(this.rotateTo(h, l, n));
+      ), o.push(this.rotateTo(h, l, i));
     } else {
-      const o = new ge();
-      e.getBoundingSphere(o), o.radius += i, a.push(this.fitToSphere(o, n));
+      const c = new Se();
+      e.getBoundingSphere(c), c.radius += n, o.push(this.fitToSphere(c, i));
     }
-    return await Promise.all(a), !0;
+    return await Promise.all(o), !0;
   }
   async flyToObject(e, t = {}) {
-    const s = new fe().setFromObject(e);
+    const s = new xe().setFromObject(e);
     return this.flyToBox(s, t);
   }
+  async setCameraViewpoint(e, t = !0) {
+    const { position: s, target: i, zoom: n = this.camera.zoom } = e;
+    return Promise.all([
+      this.zoomTo(n, t),
+      this.setLookAt(s.x, s.y, s.z, i.x, i.y, i.z, t)
+    ]);
+  }
 }
-const de = {
-  LEFT: new T(0, Math.PI / 2, -Math.PI / 2),
-  RIGHT: new T(0, Math.PI / 2, Math.PI / 2),
-  FRONT: new T(0, Math.PI / 2, 0),
-  BACK: new T(0, Math.PI / 2, Math.PI),
-  TOP: new T(0, 0, 0),
-  BOTTOM: new T(0, Math.PI, 0),
-  FRONTTOP: new T(0, Math.PI / 4, 0),
-  BACKTOP: new T(0, Math.PI / 4, Math.PI),
-  LEFTTOP: new T(0, Math.PI / 4, -Math.PI / 2),
-  RIGHTTOP: new T(0, Math.PI / 4, Math.PI / 2),
-  LEFTFRONTTOP: new T(0, Math.PI / 4, -Math.PI / 4),
-  RIGHTFRONTTOP: new T(0, Math.PI / 4, Math.PI / 4),
-  LEFTBACKTOP: new T(0, Math.PI / 4, -Math.PI / 4 * 3),
-  RIGHTBACKTOP: new T(0, Math.PI / 4, Math.PI / 4 * 3)
+const fe = {
+  LEFT: new C(0, Math.PI / 2, -Math.PI / 2),
+  RIGHT: new C(0, Math.PI / 2, Math.PI / 2),
+  FRONT: new C(0, Math.PI / 2, 0),
+  BACK: new C(0, Math.PI / 2, Math.PI),
+  TOP: new C(0, 0, 0),
+  BOTTOM: new C(0, Math.PI, 0),
+  FRONTTOP: new C(0, Math.PI / 4, 0),
+  BACKTOP: new C(0, Math.PI / 4, Math.PI),
+  LEFTTOP: new C(0, Math.PI / 4, -Math.PI / 2),
+  RIGHTTOP: new C(0, Math.PI / 4, Math.PI / 2),
+  LEFTFRONTTOP: new C(0, Math.PI / 4, -Math.PI / 4),
+  RIGHTFRONTTOP: new C(0, Math.PI / 4, Math.PI / 4),
+  LEFTBACKTOP: new C(0, Math.PI / 4, -Math.PI / 4 * 3),
+  RIGHTBACKTOP: new C(0, Math.PI / 4, Math.PI / 4 * 3)
 };
-function At(c, e) {
-  const t = c - e;
-  return Ue.euclideanModulo(t + Math.PI, Math.PI * 2) - Math.PI;
+function is(a, e) {
+  const t = a - e;
+  return Xe.euclideanModulo(t + Math.PI, Math.PI * 2) - Math.PI;
 }
-class Rt {
-  environment = new ft();
+class ns {
+  environment = new Dt();
   renderer;
   pmremGenerator;
   envMap = null;
   constructor(e) {
-    this.renderer = e, this.pmremGenerator = new De(e);
+    this.renderer = e, this.pmremGenerator = new qe(e);
   }
   update() {
     this.envMap || (this.envMap = this.pmremGenerator.fromScene(this.environment).texture);
@@ -369,20 +480,20 @@ class Rt {
     this.pmremGenerator.dispose(), this.envMap?.dispose();
   }
 }
-const z = 128;
-class _t extends wt {
+const $ = 128;
+class rs extends jt {
   viewer;
   overlayPass;
   constructor(e) {
     super(e.camera, e.el), this.viewer = e;
-    const t = new $(-2, 2, 2, -2, 0, 4);
-    t.position.set(0, 0, 2), this.overlayPass = Z(this, t), this.setLabels("x", "y", "z");
+    const t = new Q(-2, 2, 2, -2, 0, 4);
+    t.position.set(0, 0, 2), this.overlayPass = re(this, t), this.setLabels("x", "y", "z");
   }
   _update = () => {
     this.quaternion.copy(this.viewer.camera.quaternion).invert();
     const e = this.location;
     let t, s;
-    e.left !== null ? t = e.left : t = this.viewer.el.offsetWidth - z - e.right, e.top !== null ? s = e.top : s = this.viewer.el.offsetHeight - z - e.bottom, this.overlayPass.setViewport(t, s, z, z);
+    e.left !== null ? t = e.left : t = this.viewer.el.offsetWidth - $ - e.right, e.top !== null ? s = e.top : s = this.viewer.el.offsetHeight - $ - e.bottom, this.overlayPass.setViewport(t, s, $, $);
   };
   enable() {
     return this.viewer.renderPipeline.addOverlayPass(this.overlayPass), this.viewer.addEventListener("beforeRender", this._update), this.viewer.render(), this;
@@ -391,7 +502,42 @@ class _t extends wt {
     return this.viewer.renderPipeline.removeOverlayPass(this.overlayPass), this.viewer.removeEventListener("beforeRender", this._update), this.viewer.render(), this;
   }
 }
-class Nt {
+const Ae = "position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;", as = Ae + "z-index:0;", os = Ae + "z-index:1;";
+class cs {
+  el;
+  css2dRenderer = null;
+  css3dRenderer = null;
+  constructor(e) {
+    this.el = e, getComputedStyle(e).position === "static" && (e.style.position = "relative");
+  }
+  initCSS2DRenderer() {
+    const e = new Ut();
+    return e.setSize(this.el.clientWidth, this.el.clientHeight), e.domElement.style.cssText = os, this.el.appendChild(e.domElement), this.css2dRenderer = e, e;
+  }
+  initCSS3DRenderer() {
+    const e = new Gt();
+    return e.setSize(this.el.clientWidth, this.el.clientHeight), e.domElement.style.cssText = as, this.el.appendChild(e.domElement), this.css3dRenderer = e, e;
+  }
+  createCSS2DObject(e) {
+    return this.css2dRenderer || this.initCSS2DRenderer(), new kt(e);
+  }
+  createCSS25DObject(e) {
+    return this.css3dRenderer || this.initCSS3DRenderer(), new Ft(e);
+  }
+  createCSS3DObject(e) {
+    return this.css3dRenderer || this.initCSS3DRenderer(), new zt(e);
+  }
+  render(e, t) {
+    this.css2dRenderer && this.css2dRenderer.render(e, t), this.css3dRenderer && this.css3dRenderer.render(e, t);
+  }
+  resize(e, t) {
+    this.css2dRenderer && this.css2dRenderer.setSize(e, t), this.css3dRenderer && this.css3dRenderer.setSize(e, t);
+  }
+  dispose() {
+    this.css2dRenderer && (this.el.removeChild(this.css2dRenderer.domElement), this.css2dRenderer = null), this.css3dRenderer && (this.el.removeChild(this.css3dRenderer.domElement), this.css3dRenderer = null);
+  }
+}
+class hs {
   el;
   renderer;
   container;
@@ -406,19 +552,19 @@ class Nt {
     this.el = e, this.renderer = t;
     const s = document.createElement("div");
     s.style.position = "absolute", s.style.left = "12px", s.style.bottom = "12px", s.style.fontSize = "12px", s.style.color = "#fff", s.style.pointerEvents = "none", this.container = s;
-    function n(r, a = !0) {
-      const o = document.createElement("span");
-      return a && (o.style.marginLeft = "6px"), o.innerText = r, o;
+    function i(r, o = !0) {
+      const c = document.createElement("span");
+      return o && (c.style.marginLeft = "6px"), c.innerText = r, c;
     }
-    function i() {
+    function n() {
       return document.createElement("br");
     }
-    this.drawCallsText = n("0"), this.frameCallsText = n("0"), this.trianglesText = n("0"), this.linesText = n("0"), this.pointsText = n("0"), this.timestampText = n("0"), this.container.appendChild(n("draw calls", !1)), this.container.appendChild(this.drawCallsText), this.container.appendChild(i()), this.container.appendChild(n("frame calls", !1)), this.container.appendChild(this.frameCallsText), this.container.appendChild(i()), this.container.appendChild(n("triangles", !1)), this.container.appendChild(this.trianglesText), this.container.appendChild(i()), this.container.appendChild(n("points", !1)), this.container.appendChild(this.pointsText), this.container.appendChild(i()), this.container.appendChild(n("lines", !1)), this.container.appendChild(this.linesText), this.container.appendChild(i()), this.container.appendChild(n("timestamp", !1)), this.container.appendChild(this.timestampText), this.container.appendChild(i());
+    this.drawCallsText = i("0"), this.frameCallsText = i("0"), this.trianglesText = i("0"), this.linesText = i("0"), this.pointsText = i("0"), this.timestampText = i("0"), this.container.appendChild(i("draw calls", !1)), this.container.appendChild(this.drawCallsText), this.container.appendChild(n()), this.container.appendChild(i("frame calls", !1)), this.container.appendChild(this.frameCallsText), this.container.appendChild(n()), this.container.appendChild(i("triangles", !1)), this.container.appendChild(this.trianglesText), this.container.appendChild(n()), this.container.appendChild(i("points", !1)), this.container.appendChild(this.pointsText), this.container.appendChild(n()), this.container.appendChild(i("lines", !1)), this.container.appendChild(this.linesText), this.container.appendChild(n()), this.container.appendChild(i("timestamp", !1)), this.container.appendChild(this.timestampText), this.container.appendChild(n());
   }
   update() {
     if (this._enabled) {
       const { render: e } = this.renderer.info;
-      this.drawCallsText.innerText = e.drawCalls.toString(), this.frameCallsText.innerText = e.frameCalls.toString(), this.trianglesText.innerText = e.triangles.toString(), this.pointsText.innerText = e.points.toString(), this.linesText.innerText = e.lines.toString(), this.renderer.resolveTimestampsAsync(je.RENDER).then((t) => {
+      this.drawCallsText.innerText = e.drawCalls.toString(), this.frameCallsText.innerText = e.frameCalls.toString(), this.trianglesText.innerText = e.triangles.toString(), this.pointsText.innerText = e.points.toString(), this.linesText.innerText = e.lines.toString(), this.renderer.resolveTimestampsAsync(Ye.RENDER).then((t) => {
         this.timestampText.innerText = t?.toFixed(2) ?? "0";
       });
     }
@@ -433,8 +579,8 @@ class Nt {
     this.disable();
   }
 }
-ke.enabled = !0;
-class Cs extends Ge {
+Je.enabled = !0;
+class ei extends Ze {
   el;
   renderer;
   scene;
@@ -447,14 +593,15 @@ class Cs extends Ge {
   interactionManager;
   objectManager;
   viewerHelper;
+  cssRenderer;
   frameCount = 1;
   frameloop = "demand";
   constructor({ el: e, rendererOptions: t }) {
-    super(), this.el = e, this.renderer = this._initRenderer(t), this.scene = this.createScene(), this.camera = this.createPerspectiveCamera(), this.info = new Nt(this.el, this.renderer), this.controls = new Bt(this.camera, this.renderer.domElement), this.renderPipeline = new Lt(this.renderer, this.scene, this.camera), this.timer = new Fe(), this.roomEnvironment = new Rt(this.renderer), this.interactionManager = new Pt(this.renderer.domElement, this.scene, this.camera), this.objectManager = new St(), this.viewerHelper = new _t(this), window.addEventListener("resize", this.onWindowResize);
+    super(), this.el = e, this.renderer = this._initRenderer(t), this.scene = this.createScene(), this.camera = this.createPerspectiveCamera(), this.info = new hs(this.el, this.renderer), this.controls = new ss(this.camera, this.renderer.domElement), this.renderPipeline = new es(this.renderer, this.scene, this.camera), this.timer = new Ve(), this.roomEnvironment = new ns(this.renderer), this.interactionManager = new Zt(this.renderer.domElement, this.scene, this.camera), this.objectManager = new Vt(), this.viewerHelper = new rs(this), this.cssRenderer = new cs(this.el), window.addEventListener("resize", this.onWindowResize);
   }
   onWindowResize = () => {
     const e = this.el.clientWidth, t = this.el.clientHeight;
-    this.camera instanceof X ? (this.camera.aspect = e / t, this.camera.updateProjectionMatrix()) : this.camera instanceof $ && (this.camera.left = -e / 2, this.camera.right = e / 2, this.camera.top = t / 2, this.camera.bottom = -t / 2, this.camera.updateProjectionMatrix()), this.renderer.setSize(e, t), this.render();
+    this.camera instanceof K ? (this.camera.aspect = e / t, this.camera.updateProjectionMatrix()) : this.camera instanceof Q && (this.camera.left = -e / 2, this.camera.right = e / 2, this.camera.top = t / 2, this.camera.bottom = -t / 2, this.camera.updateProjectionMatrix()), this.renderer.setSize(e, t), this.cssRenderer.resize(e, t), this.render();
   };
   async init() {
     await this.renderer.init(), this.roomEnvironment.update(), this.scene.environment = this.roomEnvironment.envMap;
@@ -463,7 +610,7 @@ class Cs extends Ge {
     this.camera = e, this.controls.camera = e, this.interactionManager.setCamera(e), this.renderPipeline.setCamera(e), this.onWindowResize(), this.dispatchEvent({ type: "cameraChange", camera: e });
   }
   setCameraByType(e) {
-    e === "perspective" && !(this.camera instanceof X) ? this.setCamera(this.createPerspectiveCamera()) : e === "orthographic" && !(this.camera instanceof $) && this.setCamera(this.createOrthographicCamera());
+    e === "perspective" && !(this.camera instanceof K) ? this.setCamera(this.createPerspectiveCamera()) : e === "orthographic" && !(this.camera instanceof Q) && this.setCamera(this.createOrthographicCamera());
   }
   render(e = 1) {
     return this.frameCount += e, new Promise((t) => {
@@ -478,28 +625,28 @@ class Cs extends Ge {
     const t = this.timer.getDelta();
     this.dispatchEvent({ type: "beforeControlsUpdate", time: e, delta: t });
     let s = this.controls.update(t);
-    this.dispatchEvent({ type: "afterControlsUpdate", time: e, delta: t }), this.frameCount > 0 && (this.frameCount--, s = !0), this.frameloop === "always" && (s = !0), s && (this.dispatchEvent({ type: "beforeRender", time: e, delta: t }), this.renderer.info.reset(), this.renderPipeline.render(), this.info.update(), this.dispatchEvent({ type: "afterRender", time: e, delta: t }));
+    this.dispatchEvent({ type: "afterControlsUpdate", time: e, delta: t }), this.frameCount > 0 && (this.frameCount--, s = !0), this.frameloop === "always" && (s = !0), s && (this.dispatchEvent({ type: "beforeRender", time: e, delta: t }), this.renderer.info.reset(), this.renderPipeline.render(), this.cssRenderer.render(this.scene, this.camera), this.info.update(), this.dispatchEvent({ type: "afterRender", time: e, delta: t }));
   };
   _initRenderer(e) {
-    const t = new He({
+    const t = new et({
       logarithmicDepthBuffer: !0,
       antialias: !1,
       depth: !1,
       trackTimestamp: !0,
       ...e
     });
-    return t.setSize(this.el.clientWidth, this.el.clientHeight), t.shadowMap.enabled = !0, t.shadowMap.type = ze, t.toneMapping = $e, t.toneMappingExposure = 1, t.info.autoReset = !1, t.setPixelRatio(window.devicePixelRatio), t.setAnimationLoop(this.animate), this.el.appendChild(t.domElement), t;
+    return t.setSize(this.el.clientWidth, this.el.clientHeight), t.shadowMap.enabled = !0, t.shadowMap.type = tt, t.toneMapping = st, t.toneMappingExposure = 1, t.info.autoReset = !1, t.setPixelRatio(window.devicePixelRatio), t.setAnimationLoop(this.animate), this.el.appendChild(t.domElement), t;
   }
   createScene() {
-    const e = new We();
-    return e.background = new te(0), e;
+    const e = new it();
+    return e.background = new V(0), e;
   }
   createPerspectiveCamera() {
-    const e = new X(50, this.el.clientWidth / this.el.clientHeight, 0.1, 1e5);
+    const e = new K(50, this.el.clientWidth / this.el.clientHeight, 0.1, 1e5);
     return e.position.setScalar(5), e;
   }
   createOrthographicCamera() {
-    const e = new $(
+    const e = new Q(
       -this.el.clientWidth / 2,
       this.el.clientWidth / 2,
       this.el.clientHeight / 2,
@@ -510,194 +657,194 @@ class Cs extends Ge {
     return e.position.setScalar(5), e;
   }
   dispose() {
-    this.el.removeChild(this.renderer.domElement), window.removeEventListener("resize", this.onWindowResize), this.info.dispose(), this.interactionManager.dispose(), this.roomEnvironment.dispose(), this.renderPipeline.dispose(), this.renderer.dispose();
+    this.el.removeChild(this.renderer.domElement), window.removeEventListener("resize", this.onWindowResize), this.info.dispose(), this.interactionManager.dispose(), this.roomEnvironment.dispose(), this.cssRenderer.dispose(), this.renderPipeline.dispose(), this.renderer.dispose();
   }
 }
-class Ut extends xe {
+class ls extends Le {
   constructor(e) {
     super(e);
   }
-  parse(e, t, s, n) {
-    if (Dt(e.slice(0, 8)) === "SBMG----") {
-      const r = jt(e.slice(8));
-      return super.parse(r, t, s, n);
+  parse(e, t, s, i) {
+    if (ds(e.slice(0, 8)) === "SBMG----") {
+      const r = ps(e.slice(8));
+      return super.parse(r, t, s, i);
     } else
-      return super.parse(e, t, s, n);
+      return super.parse(e, t, s, i);
   }
 }
-function Dt(c) {
-  return new TextDecoder().decode(new Uint8Array(c));
+function ds(a) {
+  return new TextDecoder().decode(new Uint8Array(a));
 }
-function jt(c) {
-  const e = new DataView(c);
+function ps(a) {
+  const e = new DataView(a);
   for (let t = 0; t < e.byteLength; t++) {
-    const s = e.getUint8(t), n = (s >> 4 & 15) + (s << 4 & 240);
-    e.setUint8(t, n);
+    const s = e.getUint8(t), i = (s >> 4 & 15) + (s << 4 & 240);
+    e.setUint8(t, i);
   }
   return e.buffer;
 }
-const kt = 8, Gt = 130, pe = 66, Ft = "SBK-----", Ht = "SBM-----", Me = new TextDecoder(), zt = new TextEncoder();
-function $t(c) {
-  let e = kt;
-  const t = new Uint8Array(c, 0, e);
-  if (Me.decode(t) !== Ft)
-    return c;
-  e += Gt;
-  const n = new Uint8Array(c, 0, e);
-  if (n[40] === 1) {
-    const r = zt.encode(Ht), a = new Uint8Array([n[41]]), o = Wt(n), h = Qt(o);
-    let l = pe % h.length;
-    const p = e + pe, g = new Uint8Array(c, p), u = new Uint8Array(g.length);
+const us = 8, ms = 130, ye = 66, gs = "SBK-----", fs = "SBM-----", Ne = new TextDecoder(), ys = new TextEncoder();
+function ws(a) {
+  let e = us;
+  const t = new Uint8Array(a, 0, e);
+  if (Ne.decode(t) !== gs)
+    return a;
+  e += ms;
+  const i = new Uint8Array(a, 0, e);
+  if (i[40] === 1) {
+    const r = ys.encode(fs), o = new Uint8Array([i[41]]), c = vs(i), h = bs(c);
+    let l = ye % h.length;
+    const d = e + ye, g = new Uint8Array(a, d), p = new Uint8Array(g.length);
     for (let v = 0; v < g.length; v++)
-      u[v] = g[v] ^ h[l], l = (l + 1) % h.length;
-    const w = new Uint8Array(r.length + a.length + u.length);
-    return w.set(r), w.set(a, r.length), w.set(u, r.length + a.length), w.buffer;
+      p[v] = g[v] ^ h[l], l = (l + 1) % h.length;
+    const y = new Uint8Array(r.length + o.length + p.length);
+    return y.set(r), y.set(o, r.length), y.set(p, r.length + o.length), y.buffer;
   }
 }
-function Wt(c) {
+function vs(a) {
   const e = new Uint8Array(128);
-  return e.set(c.slice(42, 74), 0), e.set(c.slice(74, 138), 32), e.set(c.slice(8, 40), 96), e;
+  return e.set(a.slice(42, 74), 0), e.set(a.slice(74, 138), 32), e.set(a.slice(8, 40), 96), e;
 }
-function Qt(c) {
+function bs(a) {
   const e = new Uint8Array(64);
-  return e.set(c.slice(0, 8), 0), e.set(c.slice(24, 32), 8), e.set(c.slice(40, 56), 16), e.set(c.slice(64, 88), 32), e.set(c.slice(96, 104), 56), e;
+  return e.set(a.slice(0, 8), 0), e.set(a.slice(24, 32), 8), e.set(a.slice(40, 56), 16), e.set(a.slice(64, 88), 32), e.set(a.slice(96, 104), 56), e;
 }
-const Kt = (c, e, t) => {
-  const s = c.buffer.slice(t, t + e);
-  let n = Me.decode(s);
-  return n = n.replace("\\", "/"), n.startsWith("Maps/") || (n = `Maps/${n}`), n;
-}, Xt = (c, e, t) => {
-  const [s, n, i, r, a] = e, o = t || r < 1;
-  return new I({
-    name: c,
-    color: new te(s, n, i),
+const Cs = (a, e, t) => {
+  const s = a.buffer.slice(t, t + e);
+  let i = Ne.decode(s);
+  return i = i.replace("\\", "/"), i.startsWith("Maps/") || (i = `Maps/${i}`), i;
+}, Ts = (a, e, t) => {
+  const [s, i, n, r, o] = e, c = t || r < 1;
+  return new L({
+    name: a,
+    color: new V(s, i, n),
     opacity: r,
-    transparent: o,
+    transparent: c,
     alphaTest: 0.01,
-    side: a
+    side: o
   });
-}, qt = (c) => c?.toLowerCase().endsWith(".png") ?? !1;
-class Yt {
+}, Ss = (a) => a?.toLowerCase().endsWith(".png") ?? !1;
+class xs {
   data;
   options;
   textureLoader;
   littleEndian = !0;
   materials = /* @__PURE__ */ new Map();
   constructor(e, t) {
-    this.data = e, this.options = t, this.textureLoader = new ye(t.manager), this.textureLoader.setCrossOrigin(t.crossOrigin), this.textureLoader.setRequestHeader(t.requestHeader);
+    this.data = e, this.options = t, this.textureLoader = new Me(t.manager), this.textureLoader.setCrossOrigin(t.crossOrigin), this.textureLoader.setRequestHeader(t.requestHeader);
   }
   parse(e, t) {
     let s = this.data;
-    const n = $t(this.data);
-    n && (s = n);
-    const i = new DataView(s);
+    const i = ws(this.data);
+    i && (s = i);
+    const n = new DataView(s);
     let r = 8;
-    const a = i.getUint8(r);
-    r += 1, a === 1 ? this._parseV2(i, r, e) : a === 2 ? this._parseV2(i, r, e) : a === 3 ? this._parseV3(i, r, e) : t?.(new Error(`SBMLoader: Unsupported SBM version: ${a}`));
+    const o = n.getUint8(r);
+    r += 1, o === 1 ? this._parseV2(n, r, e) : o === 2 ? this._parseV2(n, r, e) : o === 3 ? this._parseV3(n, r, e) : t?.(new Error(`SBMLoader: Unsupported SBM version: ${o}`));
   }
   _parseV2(e, t, s) {
-    const n = new Q(), i = e.getUint16(t, this.littleEndian);
+    const i = new ee(), n = e.getUint16(t, this.littleEndian);
     t += 2;
     const r = e.getUint16(t, this.littleEndian);
     t += 2;
-    for (let a = 0; a < i; ++a) {
-      const o = e.getUint16(t, this.littleEndian).toString();
+    for (let o = 0; o < n; ++o) {
+      const c = e.getUint16(t, this.littleEndian).toString();
       t += 2, t += 4, t += 4, t += 4, t += 4;
       const h = e.getFloat32(t, this.littleEndian);
       t += 4;
       const l = e.getFloat32(t, this.littleEndian);
       t += 4;
-      const p = e.getFloat32(t, this.littleEndian);
+      const d = e.getFloat32(t, this.littleEndian);
       t += 4;
       const g = e.getFloat32(t, this.littleEndian);
       t += 4, t += 4, t += 4, t += 4, t += 4;
-      let u = e.getUint8(t);
-      t += 1, u === 0 ? u = Xe : u === 1 ? u = qe : u === 2 && (u = Ye);
-      const w = e.getUint16(t, this.littleEndian);
+      let p = e.getUint8(t);
+      t += 1, p === 0 ? p = at : p === 1 ? p = ot : p === 2 && (p = ct);
+      const y = e.getUint16(t, this.littleEndian);
       t += 2;
-      const v = w > 0 ? Kt(e, w, t) : "";
-      if (t += w, !this.materials.has(o)) {
-        const b = Xt(o, [h, l, p, g, u], qt(v));
-        this.materials.set(o, b), v && this.options.path && this.textureLoader.load(L.resolveURL(v, this.options.path), (f) => {
-          f.colorSpace = ve, f.wrapS = ne, f.wrapT = ne, f.flipY = !1, f.anisotropy = 16, b.map = f;
+      const v = y > 0 ? Cs(e, y, t) : "";
+      if (t += y, !this.materials.has(c)) {
+        const b = Ts(c, [h, l, d, g, p], Ss(v));
+        this.materials.set(c, b), v && this.options.path && this.textureLoader.load(I.resolveURL(v, this.options.path), (f) => {
+          f.colorSpace = Pe, f.wrapS = ce, f.wrapT = ce, f.flipY = !1, f.anisotropy = 16, b.map = f;
         });
       }
     }
-    for (let a = 0; a < r; ++a) {
-      const o = e.getUint16(t, this.littleEndian).toString();
+    for (let o = 0; o < r; ++o) {
+      const c = e.getUint16(t, this.littleEndian).toString();
       t += 2;
       const h = e.getUint16(t, this.littleEndian).toString();
       t += 2;
-      const l = [], p = [], g = [], u = [], w = e.getUint16(t, this.littleEndian);
-      if (t += 2, w > 0)
-        for (let m = 0; m < w; m++) {
-          const y = new ee();
-          y.setX(e.getFloat32(t, this.littleEndian)), t += 4, y.setY(e.getFloat32(t, this.littleEndian)), t += 4, y.setZ(e.getFloat32(t, this.littleEndian)), t += 4, l.push(y);
+      const l = [], d = [], g = [], p = [], y = e.getUint16(t, this.littleEndian);
+      if (t += 2, y > 0)
+        for (let m = 0; m < y; m++) {
+          const w = new oe();
+          w.setX(e.getFloat32(t, this.littleEndian)), t += 4, w.setY(e.getFloat32(t, this.littleEndian)), t += 4, w.setZ(e.getFloat32(t, this.littleEndian)), t += 4, l.push(w);
         }
       const v = e.getUint16(t, this.littleEndian);
       if (t += 2, v > 0)
         for (let m = 0; m < v; m++)
           t += 4, t += 4, t += 4;
-      const x = e.getUint16(t, this.littleEndian);
-      if (t += 2, x > 0)
-        for (let m = 0; m < x; m++) {
-          const y = new S();
-          y.setX(e.getFloat32(t, this.littleEndian)), t += 4, y.setY(e.getFloat32(t, this.littleEndian)), t += 4, p.push(y);
+      const S = e.getUint16(t, this.littleEndian);
+      if (t += 2, S > 0)
+        for (let m = 0; m < S; m++) {
+          const w = new R();
+          w.setX(e.getFloat32(t, this.littleEndian)), t += 4, w.setY(e.getFloat32(t, this.littleEndian)), t += 4, d.push(w);
         }
       const b = e.getUint16(t, this.littleEndian);
       if (t += 2, b > 0)
         for (let m = 0; m < b; m++) {
-          const y = e.getUint16(t, this.littleEndian);
-          t += 2;
-          const B = e.getUint16(t, this.littleEndian);
+          const w = e.getUint16(t, this.littleEndian);
           t += 2;
           const A = e.getUint16(t, this.littleEndian);
           t += 2;
-          const E = [y, B, A];
-          g.push(E), p.length > 0 && u.push([p[E[0]], p[E[1]], p[E[2]]]);
+          const N = e.getUint16(t, this.littleEndian);
+          t += 2;
+          const E = [w, A, N];
+          g.push(E), d.length > 0 && p.push([d[E[0]], d[E[1]], d[E[2]]]);
         }
-      const f = [], C = [];
+      const f = [], T = [];
       for (let m = 0; m < g.length; m++) {
-        const y = g[m], B = l[y[0]], A = l[y[1]], E = l[y[2]];
-        f.push(...B.toArray(), ...A.toArray(), ...E.toArray());
-        let H = new S(), k = new S(), _ = new S();
-        const N = u[m];
-        N !== void 0 && (H = N[0], k = N[1], _ = N[2]), C.push(...H.toArray(), ...k.toArray(), ..._.toArray());
+        const w = g[m], A = l[w[0]], N = l[w[1]], E = l[w[2]];
+        f.push(...A.toArray(), ...N.toArray(), ...E.toArray());
+        let H = new R(), G = new R(), _ = new R();
+        const D = p[m];
+        D !== void 0 && (H = D[0], G = D[1], _ = D[2]), T.push(...H.toArray(), ...G.toArray(), ..._.toArray());
       }
-      const O = new Float32Array(f), P = new Float32Array(C), M = new Ke();
-      if (O.length > 0 && M.setAttribute("position", new ie(O, 3)), P.length > 0 && M.setAttribute("uv", new ie(P, 2)), M.computeVertexNormals(), this.materials.has(h)) {
-        const m = new F(M, this.materials.get(h));
-        m.name = o, m.castShadow = !0, m.receiveShadow = !0, n.add(m);
+      const M = new Float32Array(f), P = new Float32Array(T), x = new rt();
+      if (M.length > 0 && x.setAttribute("position", new he(M, 3)), P.length > 0 && x.setAttribute("uv", new he(P, 2)), x.computeVertexNormals(), this.materials.has(h)) {
+        const m = new z(x, this.materials.get(h));
+        m.name = c, m.castShadow = !0, m.receiveShadow = !0, i.add(m);
       }
     }
-    s(n);
+    s(i);
   }
   _parseV3(e, t, s) {
-    const n = new Q();
-    console.warn("SBMLoader: SBM version 3 is not supported yet."), s(n);
+    const i = new ee();
+    console.warn("SBMLoader: SBM version 3 is not supported yet."), s(i);
   }
 }
-class Jt extends Qe {
-  load(e, t, s, n) {
-    let i;
+class Es extends nt {
+  load(e, t, s, i) {
+    let n;
     if (this.resourcePath !== "")
-      i = this.resourcePath;
+      n = this.resourcePath;
     else if (this.path !== "") {
-      const o = L.extractUrlBase(e);
-      i = L.resolveURL(o, this.path);
+      const c = I.extractUrlBase(e);
+      n = I.resolveURL(c, this.path);
     } else
-      i = L.extractUrlBase(e);
+      n = I.extractUrlBase(e);
     this.manager.itemStart(e);
-    const r = (o) => {
-      n ? n(o) : console.error(o), this.manager.itemError(e), this.manager.itemEnd(e);
-    }, a = new we(this.manager);
-    a.setPath(this.path), a.setResponseType("arraybuffer"), a.setRequestHeader(this.requestHeader), a.setWithCredentials(this.withCredentials), a.load(
+    const r = (c) => {
+      i ? i(c) : console.error(c), this.manager.itemError(e), this.manager.itemEnd(e);
+    }, o = new Ee(this.manager);
+    o.setPath(this.path), o.setResponseType("arraybuffer"), o.setRequestHeader(this.requestHeader), o.setWithCredentials(this.withCredentials), o.load(
       e,
-      (o) => {
+      (c) => {
         try {
           this.parse(
-            o,
-            i,
+            c,
+            n,
             (h) => {
               t(h), this.manager.itemEnd(e);
             },
@@ -711,49 +858,49 @@ class Jt extends Qe {
       r
     );
   }
-  parse(e, t, s, n) {
-    const i = new TextDecoder().decode(e.slice(0, 8));
-    if (i !== "SBK-----" && i !== "SBM-----") {
-      n?.(new Error(`SBMLoader: Invalid SBM format: ${i}`));
+  parse(e, t, s, i) {
+    const n = new TextDecoder().decode(e.slice(0, 8));
+    if (n !== "SBK-----" && n !== "SBM-----") {
+      i?.(new Error(`SBMLoader: Invalid SBM format: ${n}`));
       return;
     }
-    new Yt(e, {
+    new xs(e, {
       path: t,
       crossOrigin: this.crossOrigin,
       requestHeader: this.requestHeader,
       manager: this.manager
-    }).parse(s, n);
+    }).parse(s, i);
   }
   parseAsync(e, t) {
-    return new Promise((s, n) => {
+    return new Promise((s, i) => {
       this.parse(
         e,
         t,
-        (i) => {
-          s(i);
+        (n) => {
+          s(n);
         },
-        (i) => {
-          n(i);
+        (n) => {
+          i(n);
         }
       );
     });
   }
 }
-class R {
+class B {
   static CACHE_NAME = "u-space-model-loader-cache";
-  static fileLoader = new we().setResponseType("arraybuffer");
-  static dracoLoader = new Tt().setDecoderPath(
-    `https://cdn.jsdelivr.net/npm/three@0.${re}.0/examples/jsm/libs/draco/`
+  static fileLoader = new Ee().setResponseType("arraybuffer");
+  static dracoLoader = new Kt().setDecoderPath(
+    `https://cdn.jsdelivr.net/npm/three@0.${le}.0/examples/jsm/libs/draco/`
   );
-  static ktx2Loader = new Ct().setTranscoderPath(
-    `https://cdn.jsdelivr.net/npm/three@0.${re}.0/examples/jsm/libs/basis/`
+  static ktx2Loader = new Qt().setTranscoderPath(
+    `https://cdn.jsdelivr.net/npm/three@0.${le}.0/examples/jsm/libs/basis/`
   );
-  static gltfLoader = new xe().setDRACOLoader(R.dracoLoader).setKTX2Loader(R.ktx2Loader).setMeshoptDecoder(le);
-  static sbmxLoader = new Ut().setDRACOLoader(R.dracoLoader).setKTX2Loader(R.ktx2Loader).setMeshoptDecoder(le);
-  static sbmLoader = new Jt();
-  static fbxLoader = new yt();
-  static objLoader = new vt();
-  static stlLoader = new bt();
+  static gltfLoader = new Le().setDRACOLoader(B.dracoLoader).setKTX2Loader(B.ktx2Loader).setMeshoptDecoder(ge);
+  static sbmxLoader = new ls().setDRACOLoader(B.dracoLoader).setKTX2Loader(B.ktx2Loader).setMeshoptDecoder(ge);
+  static sbmLoader = new Es();
+  static fbxLoader = new Ht();
+  static objLoader = new $t();
+  static stlLoader = new Wt();
   static setLoadingManager(e) {
     this.fileLoader.manager = e, this.dracoLoader.manager = e, this.ktx2Loader.manager = e, this.gltfLoader.manager = e, this.sbmxLoader.manager = e, this.sbmLoader.manager = e, this.fbxLoader.manager = e, this.objLoader.manager = e, this.stlLoader.manager = e;
   }
@@ -777,25 +924,25 @@ class R {
   }
   static async loadAsync(e, t = { persistent: !0 }) {
     const s = e.split(".").pop()?.split("?")[0].toLowerCase();
-    let n;
-    switch (t.persistent && typeof caches < "u" ? n = await this.getPersistentData(e) : n = await this.fileLoader.loadAsync(e), s) {
+    let i;
+    switch (t.persistent && typeof caches < "u" ? i = await this.getPersistentData(e) : i = await this.fileLoader.loadAsync(e), s) {
       case "gltf":
       case "glb":
-        const i = await this.gltfLoader.parseAsync(n, L.extractUrlBase(e));
-        return i.scene.animations = i.animations, i.scene;
+        const n = await this.gltfLoader.parseAsync(i, I.extractUrlBase(e));
+        return n.scene.animations = n.animations, n.scene;
       case "sbmx":
-        const r = await this.sbmxLoader.parseAsync(n, L.extractUrlBase(e));
+        const r = await this.sbmxLoader.parseAsync(i, I.extractUrlBase(e));
         return r.scene.animations = r.animations, r.scene;
       case "sbm":
-        return await this.sbmLoader.parseAsync(n, L.extractUrlBase(e));
+        return await this.sbmLoader.parseAsync(i, I.extractUrlBase(e));
       case "fbx":
-        return this.fbxLoader.parse(n, L.extractUrlBase(e));
+        return this.fbxLoader.parse(i, I.extractUrlBase(e));
       case "obj":
-        const h = new TextDecoder().decode(n);
+        const h = new TextDecoder().decode(i);
         return this.objLoader.parse(h);
       case "stl":
-        const p = this.stlLoader.parse(n);
-        return new F(p, new I());
+        const d = this.stlLoader.parse(i);
+        return new z(d, new L());
       default:
         throw new Error(`Unsupported model format: ${s}`);
     }
@@ -805,17 +952,17 @@ class R {
       const t = await caches.open(this.CACHE_NAME), s = await t.match(e);
       if (s)
         return await s.arrayBuffer();
-      const n = await this.fileLoader.loadAsync(e), i = new Response(n);
-      return await t.put(e, i), n;
+      const i = await this.fileLoader.loadAsync(e), n = new Response(i);
+      return await t.put(e, n), i;
     } catch (t) {
       return console.warn(`[LoaderManager] Failed to use Cache API for ${e}:`, t), await this.fileLoader.loadAsync(e);
     }
   }
 }
-class xs {
-  static textureLoader = new ye();
-  static hdrLoader = new xt();
-  static cubeTextureLoader = new Je();
+class ti {
+  static textureLoader = new Me();
+  static hdrLoader = new Xt();
+  static cubeTextureLoader = new ht();
   static setLoadingManager(e) {
     this.textureLoader.manager = e, this.hdrLoader.manager = e, this.cubeTextureLoader.manager = e;
   }
@@ -824,13 +971,13 @@ class xs {
   }
   static async loadAsyncHDR(e) {
     const t = await this.hdrLoader.loadAsync(e);
-    return t.mapping = Ze, t;
+    return t.mapping = lt, t;
   }
   static async loadAsyncCubeTexture(e, t) {
     return this.cubeTextureLoader.setPath(e), await this.cubeTextureLoader.loadAsync(t);
   }
 }
-class j extends F {
+class k extends z {
   isBaseMesh = !0;
   type = "BaseMesh";
   ignoreInvisibleWhenRaycast = !0;
@@ -841,7 +988,7 @@ class j extends F {
     return this.visible === !1 && this.ignoreInvisibleWhenRaycast === !0 ? !1 : super.raycast(e, t);
   }
 }
-class Ee extends Q {
+class Be extends ee {
   isBaseGroup = !0;
   type = "BaseGroup";
   ignoreInvisibleWhenRaycast = !0;
@@ -852,7 +999,7 @@ class Ee extends Q {
     return this.visible === !1 && this.ignoreInvisibleWhenRaycast === !0 ? !1 : super.raycast(e, t);
   }
 }
-class Zt extends Ve {
+class Ms extends dt {
   isBaseSprite = !0;
   type = "BaseSprite";
   ignoreInvisibleWhenRaycast = !0;
@@ -863,7 +1010,7 @@ class Zt extends Ve {
     return this.visible === !1 && this.ignoreInvisibleWhenRaycast === !0 ? !1 : super.raycast(e, t);
   }
 }
-class W extends Ee {
+class Z extends Be {
   isModel = !0;
   type = "Model";
   static memoryCache = /* @__PURE__ */ new Map();
@@ -874,24 +1021,24 @@ class W extends Ee {
     super();
   }
   async loadAsync(e) {
-    const { url: t, cache: s = !0, persistent: n = !0 } = e;
+    const { url: t, cache: s = !0, persistent: i = !0 } = e;
     try {
-      let i;
-      s ? W.memoryCache.has(t) ? i = W.memoryCache.get(t) : (i = R.loadAsync(t, { persistent: n }), W.memoryCache.set(t, i)) : i = R.loadAsync(t, { persistent: n });
-      const r = await i, a = Mt(r);
-      return this.add(a), a.animations && a.animations.length > 0 && (this.animations = a.animations, this.mixer = new et(a)), a;
-    } catch (i) {
-      return console.error(`[Model] Failed to load model from ${t}:`, i), null;
+      let n;
+      s ? Z.memoryCache.has(t) ? n = Z.memoryCache.get(t) : (n = B.loadAsync(t, { persistent: i }), Z.memoryCache.set(t, n)) : n = B.loadAsync(t, { persistent: i });
+      const r = await n, o = qt(r);
+      return this.add(o), o.animations && o.animations.length > 0 && (this.animations = o.animations, this.mixer = new pt(o)), o;
+    } catch (n) {
+      return console.error(`[Model] Failed to load model from ${t}:`, n), null;
     }
   }
   playAnimation(e, t = {}) {
     if (!this.mixer || this.animations.length === 0) return null;
-    const { loop: s = !0, repetitions: n = 1 / 0, timeScale: i = 1, clampWhenFinished: r = !1 } = t;
-    let a;
-    if (e === void 0 ? a = this.animations[0] : typeof e == "number" ? a = this.animations[e] : a = this.animations.find((h) => h.name === e), !a)
+    const { loop: s = !0, repetitions: i = 1 / 0, timeScale: n = 1, clampWhenFinished: r = !1 } = t;
+    let o;
+    if (e === void 0 ? o = this.animations[0] : typeof e == "number" ? o = this.animations[e] : o = this.animations.find((h) => h.name === e), !o)
       return console.warn(`[Model] Animation not found: ${e}`), null;
-    let o = this.actions.get(a.name);
-    return o || (o = this.mixer.clipAction(a), this.actions.set(a.name, o)), o.setLoop(s ? tt : st, n), o.clampWhenFinished = r, o.timeScale = i, o.reset().play(), o;
+    let c = this.actions.get(o.name);
+    return c || (c = this.mixer.clipAction(o), this.actions.set(o.name, c)), c.setLoop(s ? ut : mt, i), c.clampWhenFinished = r, c.timeScale = n, c.reset().play(), c;
   }
   playAllAnimations(e = {}) {
     return this.animations.map((t, s) => this.playAnimation(s, e)).filter((t) => t !== null);
@@ -915,11 +1062,11 @@ class W extends Ee {
     typeof caches < "u" && await caches.delete("u-space-loader-cache");
   }
 }
-class Vt extends j {
+class Ps extends k {
   isSphereMesh = !0;
   type = "SphereMesh";
   constructor({ geometryParameters: e, materialParameters: t } = {}) {
-    super(), this.geometry = new nt(
+    super(), this.geometry = new gt(
       e?.radius,
       e?.widthSegments,
       e?.heightSegments,
@@ -927,23 +1074,23 @@ class Vt extends j {
       e?.phiLength,
       e?.thetaStart,
       e?.thetaLength
-    ), this.material = new I(t);
+    ), this.material = new L(t);
   }
 }
-class ue extends j {
+class we extends k {
   isTubeMesh = !0;
   type = "TubeMesh";
   constructor({ geometryParameters: e, materialParameters: t } = {}) {
-    super(), this.geometry = new it(
+    super(), this.geometry = new ft(
       e?.path,
       e?.tubularSegments,
       e?.radius,
       e?.radialSegments,
       e?.closed
-    ), this.material = new I(t);
+    ), this.material = new L(t);
   }
 }
-class Ms extends Ee {
+class si extends Be {
   isTopology = !0;
   type = "Topology";
   // Visuals
@@ -988,14 +1135,14 @@ class Ms extends Ee {
    * @param weight Cost of the edge. Defaults to Euclidean distance.
    * @param bidirectional If true, adds the reverse edge as well. Default true.
    */
-  addEdge(e, t, s, n = !0) {
-    const i = this.nodes.get(e), r = this.nodes.get(t);
-    if (!i || !r) {
+  addEdge(e, t, s, i = !0) {
+    const n = this.nodes.get(e), r = this.nodes.get(t);
+    if (!n || !r) {
       console.error(`[Topology] Cannot add edge. One or both nodes not found: ${e}, ${t}`);
       return;
     }
-    const a = s ?? i.distanceTo(r);
-    this.getNeighbors(e)?.set(t, a), n && this.getNeighbors(t)?.set(e, a);
+    const o = s ?? n.distanceTo(r);
+    this.getNeighbors(e)?.set(t, o), i && this.getNeighbors(t)?.set(e, o);
   }
   /**
    * Remove an edge between two nodes.
@@ -1012,33 +1159,33 @@ class Ms extends Ee {
   getShortestPath(e, t) {
     if (!this.nodes.has(e) || !this.nodes.has(t))
       return console.warn("[Topology] Start or End node not found."), [];
-    const s = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Set();
-    for (const [o] of this.nodes)
-      s.set(o, 1 / 0), n.set(o, null), i.add(o);
-    for (s.set(e, 0); i.size > 0; ) {
-      let o = null, h = 1 / 0;
-      for (const p of i) {
-        const g = s.get(p);
-        g < h && (h = g, o = p);
+    const s = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set();
+    for (const [c] of this.nodes)
+      s.set(c, 1 / 0), i.set(c, null), n.add(c);
+    for (s.set(e, 0); n.size > 0; ) {
+      let c = null, h = 1 / 0;
+      for (const d of n) {
+        const g = s.get(d);
+        g < h && (h = g, c = d);
       }
-      if (o === null || o === t || h === 1 / 0)
+      if (c === null || c === t || h === 1 / 0)
         break;
-      i.delete(o);
-      const l = this.adjacencyMap?.get(o);
+      n.delete(c);
+      const l = this.adjacencyMap?.get(c);
       if (l)
-        for (const [p, g] of l) {
-          if (!i.has(p)) continue;
-          const u = s.get(o) + g;
-          u < s.get(p) && (s.set(p, u), n.set(p, o));
+        for (const [d, g] of l) {
+          if (!n.has(d)) continue;
+          const p = s.get(c) + g;
+          p < s.get(d) && (s.set(d, p), i.set(d, c));
         }
     }
     const r = [];
-    let a = t;
-    if (n.get(t) === null && e !== t)
+    let o = t;
+    if (i.get(t) === null && e !== t)
       return [];
-    for (; a !== null; ) {
-      const o = this.nodes.get(a);
-      o && r.unshift(o), a = n.get(a) || null;
+    for (; o !== null; ) {
+      const c = this.nodes.get(o);
+      c && r.unshift(c), o = i.get(o) || null;
     }
     return r;
   }
@@ -1046,8 +1193,8 @@ class Ms extends Ee {
    * Renders the entire topology graph structure using TubeGeometry and Spheres.
    */
   renderGraph() {
-    this.clearGraph(), this.graphGroup = new Q();
-    const e = new Vt({
+    this.clearGraph(), this.graphGroup = new ee();
+    const e = new Ps({
       geometryParameters: {
         radius: this.parameters.nodeRadius,
         widthSegments: 16,
@@ -1057,19 +1204,19 @@ class Ms extends Ee {
         color: this.parameters.nodeColor
       }
     });
-    this.nodes.forEach((s, n) => {
-      const i = e.clone();
-      i.position.copy(s), Object.assign(i.userData, { id: n, type: "node" }), this.graphGroup.add(i);
+    this.nodes.forEach((s, i) => {
+      const n = e.clone();
+      n.position.copy(s), Object.assign(n.userData, { id: i, type: "node" }), this.graphGroup.add(n);
     });
     const t = /* @__PURE__ */ new Set();
-    this.adjacencyMap.forEach((s, n) => {
-      s.forEach((i, r) => {
-        const a = [n, r].sort().join("-");
-        if (t.has(a)) return;
-        t.add(a);
-        const o = this.nodes.get(n), h = this.nodes.get(r);
-        if (o && h) {
-          const l = new rt(o, h), p = new ue({
+    this.adjacencyMap.forEach((s, i) => {
+      s.forEach((n, r) => {
+        const o = [i, r].sort().join("-");
+        if (t.has(o)) return;
+        t.add(o);
+        const c = this.nodes.get(i), h = this.nodes.get(r);
+        if (c && h) {
+          const l = new yt(c, h), d = new we({
             geometryParameters: {
               path: l,
               tubularSegments: 1,
@@ -1081,14 +1228,14 @@ class Ms extends Ee {
               color: this.parameters.edgeColor
             }
           });
-          Object.assign(p.userData, { from: n, to: r, weight: i, type: "edge" }), this.graphGroup.add(p);
+          Object.assign(d.userData, { from: i, to: r, weight: n, type: "edge" }), this.graphGroup.add(d);
         }
       });
     }), this.add(this.graphGroup);
   }
   clearGraph() {
     this.graphGroup && (this.remove(this.graphGroup), this.graphGroup.traverse((e) => {
-      e instanceof F && (e.geometry.dispose(), e.material.dispose());
+      e instanceof z && (e.geometry.dispose(), e.material.dispose());
     }), this.graphGroup = null);
   }
   /**
@@ -1096,7 +1243,7 @@ class Ms extends Ee {
    */
   renderPath(e, t = this.parameters.pathColor) {
     if (e.length < 2) return;
-    const s = new at(e, !1, "catmullrom", 0), n = new ue({
+    const s = new wt(e, !1, "catmullrom", 0), i = new we({
       geometryParameters: {
         path: s,
         tubularSegments: e.length * 10,
@@ -1107,7 +1254,7 @@ class Ms extends Ee {
         color: t
       }
     });
-    return this.add(n), this.pathMeshes.push(n), n;
+    return this.add(i), this.pathMeshes.push(i), i;
   }
   clearPaths() {
     this.pathMeshes.forEach((e) => {
@@ -1117,14 +1264,14 @@ class Ms extends Ee {
   /** Export nodes and edges as a JSON-serializable object. */
   exportData() {
     const e = {};
-    this.nodes.forEach((n, i) => {
-      e[i] = { x: n.x, y: n.y, z: n.z };
+    this.nodes.forEach((i, n) => {
+      e[n] = { x: i.x, y: i.y, z: i.z };
     });
     const t = [], s = /* @__PURE__ */ new Set();
-    return this.adjacencyMap.forEach((n, i) => {
-      n.forEach((r, a) => {
-        const o = [i, a].sort().join("-");
-        s.has(o) || (s.add(o), t.push({ from: i, to: a, weight: r }));
+    return this.adjacencyMap.forEach((i, n) => {
+      i.forEach((r, o) => {
+        const c = [n, o].sort().join("-");
+        s.has(c) || (s.add(c), t.push({ from: n, to: o, weight: r }));
       });
     }), { nodes: e, edges: t };
   }
@@ -1134,9 +1281,9 @@ class Ms extends Ee {
    */
   importData(e) {
     this.clearGraph(), this.clearPaths(), this.nodes.clear(), this.adjacencyMap.clear(), Object.entries(e.nodes).forEach(([t, s]) => {
-      this.addNode(t, new ee(s.x, s.y, s.z));
-    }), e.edges.forEach(({ from: t, to: s, weight: n }) => {
-      this.addEdge(t, s, n);
+      this.addNode(t, new oe(s.x, s.y, s.z));
+    }), e.edges.forEach(({ from: t, to: s, weight: i }) => {
+      this.addEdge(t, s, i);
     }), this.renderGraph();
   }
   dispose() {
@@ -1146,7 +1293,7 @@ class Ms extends Ee {
     return this.adjacencyMap.get(e);
   }
 }
-class Es extends Zt {
+class ii extends Ms {
   isPoi = !0;
   type = "Poi";
   parameters = {
@@ -1165,7 +1312,7 @@ class Es extends Zt {
   _canvas = document.createElement("canvas");
   _lastParametersJSON = "";
   constructor(e = {}) {
-    super(new ot()), Object.assign(this.parameters, e), this.updateAsync();
+    super(new vt()), Object.assign(this.parameters, e), this.updateAsync();
   }
   /**
    * Update the POI with new parameters
@@ -1176,174 +1323,221 @@ class Es extends Zt {
     const t = JSON.stringify(this.parameters);
     if (t === this._lastParametersJSON) return;
     this._lastParametersJSON = t;
-    const s = this._canvas, n = s.getContext("2d");
-    if (!n) return;
-    n.font = `${this.parameters.fontSize}px ${this.parameters.fontFamily}`;
-    let i = null;
-    this.parameters.img && (i = await this._loadImage(this.parameters.img));
-    const { text: r, fontSize: a, color: o, iconSize: h, padding: l, backgroundColor: p, borderRadius: g, textPosition: u, scaleFactor: w } = this.parameters, v = n.measureText(r), x = r ? v.width : 0, b = r ? a : 0;
-    let f = 0, C = 0, O = 0, P = 0, M = 0, m = 0;
-    const y = !!i, B = !!r;
-    if (y && B)
-      switch (u) {
+    const s = this._canvas, i = s.getContext("2d");
+    if (!i) return;
+    i.font = `${this.parameters.fontSize}px ${this.parameters.fontFamily}`;
+    let n = null;
+    this.parameters.img && (n = await this._loadImage(this.parameters.img));
+    const { text: r, fontSize: o, color: c, iconSize: h, padding: l, backgroundColor: d, borderRadius: g, textPosition: p, scaleFactor: y } = this.parameters, v = i.measureText(r), S = r ? v.width : 0, b = r ? o : 0;
+    let f = 0, T = 0, M = 0, P = 0, x = 0, m = 0;
+    const w = !!n, A = !!r;
+    if (w && A)
+      switch (p) {
         case "top":
-          f = Math.max(h, x), C = h + l + b, M = (f - x) / 2, m = b / 2, O = (f - h) / 2, P = b + l;
+          f = Math.max(h, S), T = h + l + b, x = (f - S) / 2, m = b / 2, M = (f - h) / 2, P = b + l;
           break;
         case "bottom":
-          f = Math.max(h, x), C = h + l + b, O = (f - h) / 2, P = 0, M = (f - x) / 2, m = h + l + b / 2;
+          f = Math.max(h, S), T = h + l + b, M = (f - h) / 2, P = 0, x = (f - S) / 2, m = h + l + b / 2;
           break;
         case "left":
-          f = h + l + x, C = Math.max(h, b), M = 0, m = C / 2, O = x + l, P = (C - h) / 2;
+          f = h + l + S, T = Math.max(h, b), x = 0, m = T / 2, M = S + l, P = (T - h) / 2;
           break;
         default:
-          f = h + l + x, C = Math.max(h, b), O = 0, P = (C - h) / 2, M = h + l, m = C / 2;
+          f = h + l + S, T = Math.max(h, b), M = 0, P = (T - h) / 2, x = h + l, m = T / 2;
           break;
       }
-    else y ? (f = h, C = h, O = 0, P = 0) : B && (f = x, C = b, M = 0, m = b / 2);
-    const A = f + l * 2, E = C + l * 2;
-    if (s.width = A, s.height = E, n.font = `${a}px ${this.parameters.fontFamily}`, p && (n.fillStyle = p, this._drawRoundedRect(n, 0, 0, A, E, g), n.fill()), y && n.drawImage(i, O + l, P + l, h, h), B) {
-      n.fillStyle = o;
-      const _ = n.measureText(r), N = _.actualBoundingBoxAscent + _.actualBoundingBoxDescent, Be = _.actualBoundingBoxAscent - N / 2;
-      n.textBaseline = "alphabetic", n.fillText(r, M + l, m + l + Be);
+    else w ? (f = h, T = h, M = 0, P = 0) : A && (f = S, T = b, x = 0, m = b / 2);
+    const N = f + l * 2, E = T + l * 2;
+    if (s.width = N, s.height = E, i.font = `${o}px ${this.parameters.fontFamily}`, d && (i.fillStyle = d, this._drawRoundedRect(i, 0, 0, N, E, g), i.fill()), w && i.drawImage(n, M + l, P + l, h, h), A) {
+      i.fillStyle = c;
+      const _ = i.measureText(r), D = _.actualBoundingBoxAscent + _.actualBoundingBoxDescent, He = _.actualBoundingBoxAscent - D / 2;
+      i.textBaseline = "alphabetic", i.fillText(r, x + l, m + l + He);
     }
-    const H = this.material.map, k = new ct(s);
-    k.colorSpace = ve, this.material.map = k, H?.dispose(), this.scale.set(A * w, E * w, 1);
+    const H = this.material.map, G = new bt(s);
+    G.colorSpace = Pe, this.material.map = G, H?.dispose(), this.scale.set(N * y, E * y, 1);
   }
   _loadImage(e) {
     return new Promise((t, s) => {
       if (typeof e == "string") {
-        const n = new Image();
-        n.crossOrigin = "Anonymous", n.onload = () => t(n), n.onerror = () => s(new Error(`Failed to load image: ${e}`)), n.src = e;
+        const i = new Image();
+        i.crossOrigin = "Anonymous", i.onload = () => t(i), i.onerror = () => s(new Error(`Failed to load image: ${e}`)), i.src = e;
       } else
         t(e);
     });
   }
-  _drawRoundedRect(e, t, s, n, i, r) {
-    e.beginPath(), e.moveTo(t + r, s), e.lineTo(t + n - r, s), e.quadraticCurveTo(t + n, s, t + n, s + r), e.lineTo(t + n, s + i - r), e.quadraticCurveTo(t + n, s + i, t + n - r, s + i), e.lineTo(t + r, s + i), e.quadraticCurveTo(t, s + i, t, s + i - r), e.lineTo(t, s + r), e.quadraticCurveTo(t, s, t + r, s), e.closePath();
+  _drawRoundedRect(e, t, s, i, n, r) {
+    e.beginPath(), e.moveTo(t + r, s), e.lineTo(t + i - r, s), e.quadraticCurveTo(t + i, s, t + i, s + r), e.lineTo(t + i, s + n - r), e.quadraticCurveTo(t + i, s + n, t + i - r, s + n), e.lineTo(t + r, s + n), e.quadraticCurveTo(t, s + n, t, s + n - r), e.lineTo(t, s + r), e.quadraticCurveTo(t, s, t + r, s), e.closePath();
   }
   dispose() {
     this.material.map?.dispose(), this.material.dispose();
   }
 }
-class Oe extends j {
+class _e extends k {
   isShapeMesh = !0;
   type = "ShapeMesh";
   constructor({ geometryParameters: e, materialParameters: t } = {}) {
-    super(), this.geometry = new ht(e?.shape, e?.curveSegments), this.material = new I(t), this.geometry.rotateX(-Math.PI / 2);
+    super(), this.geometry = new Ct(e?.shape, e?.curveSegments), this.material = new L(t), this.geometry.rotateX(-Math.PI / 2);
   }
   static createFromPoints(e, t = {}) {
-    return new Oe({
+    return new _e({
       ...t,
       geometryParameters: {
         ...t.geometryParameters,
-        shape: new be(e.map((s) => new S(s.x, -s.z)))
+        shape: new Oe(e.map((s) => new R(s.x, -s.z)))
       }
     });
   }
 }
-class Pe extends j {
+class De extends k {
   isExtrudeMesh = !0;
   type = "ExtrudeMesh";
   constructor({ geometryParameters: e, materialParameters: t } = {}) {
-    super(), this.geometry = new lt(e?.shape, e?.options), this.material = new I(t), this.geometry.rotateX(-Math.PI / 2);
+    super(), this.geometry = new Tt(e?.shape, e?.options), this.material = new L(t), this.geometry.rotateX(-Math.PI / 2);
   }
   static createFromPoints(e, t = {}) {
-    return new Pe({
+    return new De({
       ...t,
       geometryParameters: {
         ...t.geometryParameters,
-        shape: new be(e.map((s) => new S(s.x, -s.z)))
+        shape: new Oe(e.map((s) => new R(s.x, -s.z)))
       }
     });
   }
 }
-class Os extends j {
+class ni extends k {
   isPlaneMesh = !0;
   type = "PlaneMesh";
   constructor({ geometryParameters: e, materialParameters: t } = {}) {
-    super(), this.geometry = new dt(
+    super(), this.geometry = new St(
       e?.width,
       e?.height,
       e?.widthSegments,
       e?.heightSegments
-    ), this.material = new I(t);
+    ), this.material = new L(t);
   }
 }
-class Ps extends j {
+class ri extends k {
   isCircleMesh = !0;
   type = "CircleMesh";
   constructor({ geometryParameters: e, materialParameters: t } = {}) {
     super(
-      new pt(
+      new xt(
         e?.radius,
         e?.segments,
         e?.thetaStart,
         e?.thetaLength
       ),
-      new I(t)
+      new L(t)
     ), this.geometry.rotateX(-Math.PI / 2);
   }
 }
-class es {
+class W {
   static traverseMeshes(e, t) {
     e.traverse((s) => {
-      s instanceof F && t(s);
+      s instanceof z && t(s);
     });
   }
 }
-class Ss {
+class ai {
   static flow(e = {}) {
-    const { baseColor: t = 16777215, flowColor: s = 65280, speed: n = 1, scale: i = 3, intensity: r = 4 } = e, a = U(new D(t)), o = U(new D(s)), h = ae().x.mul(i).sub(q.mul(n)), l = Y(oe(h).add(1).mul(0.5), r);
-    return J(a, o, l);
+    const { baseColor: t = 16777215, flowColor: s = 65280, speed: i = 1, scale: n = 3, intensity: r = 4 } = e, o = j(new U(t)), c = j(new U(s)), h = pe().x.mul(n).sub(X.mul(i)), l = q(ae(h).add(1).mul(0.5), r);
+    return Y(o, c, l);
   }
   static breathe(e = {}) {
-    const { baseColor: t = 16777215, breathColor: s = 65280, speed: n = 1, intensity: i = 2 } = e, r = U(new D(t)), a = U(new D(s)), o = oe(q.mul(n)).add(1).mul(0.5), h = Y(o, i);
-    return J(r, a, h);
+    const { baseColor: t = 16777215, breathColor: s = 65280, speed: i = 1, intensity: n = 2 } = e, r = j(new U(t)), o = j(new U(s)), c = ae(X.mul(i)).add(1).mul(0.5), h = q(c, n);
+    return Y(r, o, h);
   }
   static fluid(e = {}) {
     const {
       baseColor: t = 16777215,
       flowColor: s = 255,
-      speed: n = 1,
-      scale: i = 1,
+      speed: i = 1,
+      scale: n = 1,
       intensity: r = 1,
-      distortion: a = 0.5
-    } = e, o = U(new D(t)), h = U(new D(s)), l = ae().mul(i), p = q.mul(n), g = ce(l.add(p), 1, 0), u = l.add(g.mul(a)), w = ce(u, 1, 0).add(1).mul(0.5), v = Y(w, r);
-    return J(o, h, v);
+      distortion: o = 0.5
+    } = e, c = j(new U(t)), h = j(new U(s)), l = pe().mul(n), d = X.mul(i), g = ue(l.add(d), 1, 0), p = l.add(g.mul(o)), y = ue(p, 1, 0).add(1).mul(0.5), v = q(y, r);
+    return Y(c, h, v);
   }
 }
-function Ls(c) {
+function oi(a) {
 }
-const K = "uSpaceHighlight", se = `${K}/enabled`, Se = `${K}/opacity`, Le = `${K}/color`, Ie = `${K}/overwrite`, ts = Te(() => {
-  const c = G(se, "uint"), e = G(Le, "uint"), t = G(Ie, "uint"), s = ns(e), n = he.mul(s), i = V(t.greaterThan(0), s, n);
-  return V(c.greaterThan(0), i, he);
-})(), ss = Te(() => {
-  const c = G(se, "uint"), e = G(Se, "float");
-  return V(c.greaterThan(0), e, mt);
+const ie = "uSpaceHighlight", F = `${ie}/enabled`, je = `${ie}/opacity`, Ue = `${ie}/color`, ke = `${ie}/overwrite`, ne = "uSpaceBreathe", te = `${ne}/enabled`, Ge = `${ne}/color`, Fe = `${ne}/speed`, ze = `${ne}/intensity`, se = /* @__PURE__ */ new WeakMap(), Os = Re(() => {
+  const a = O(F, "uint"), e = O(Ue, "uint"), t = O(ke, "uint"), s = Ce(e), i = me.mul(s), n = J(t.greaterThan(0), s, i), r = J(a.greaterThan(0), n, me), o = O(te, "uint"), c = O(Ge, "uint"), h = O(Fe, "float"), l = O(ze, "float"), d = Ce(c), g = ae(X.mul(h)).add(1).mul(0.5), p = q(g, l), y = Y(r, d, p);
+  return J(o.greaterThan(0), y, r);
+})(), Rs = Re(() => {
+  const a = O(F, "uint"), e = O(je, "float");
+  return J(a.greaterThan(0), e, Lt);
 })();
-class Is {
-  static highlight(e, t = {}) {
-    const s = Object.assign(
+function ve(a) {
+  const e = a.material;
+  if (!e || Array.isArray(e)) return;
+  let t = se.get(e);
+  t || (t = {
+    colorNode: e.colorNode,
+    opacityNode: e.opacityNode,
+    transparent: e.transparent,
+    activeMeshes: /* @__PURE__ */ new Set()
+  }, se.set(e, t)), t.activeMeshes.add(a), e.transparent = !0, e.colorNode = Os, e.opacityNode = Rs, e.needsUpdate = !0;
+}
+function be(a) {
+  const e = a.userData[F], t = a.userData[te];
+  if (e || t) return;
+  const s = a.material;
+  if (!s || Array.isArray(s)) return;
+  const i = se.get(s);
+  i && (i.activeMeshes.delete(a), !(i.activeMeshes.size > 0) && (s.colorNode = i.colorNode, s.opacityNode = i.opacityNode, s.transparent = i.transparent, s.needsUpdate = !0, se.delete(s)));
+}
+class ci {
+  static highlightColor(e, t = {}) {
+    const s = Array.isArray(e) ? e : [e], i = Object.assign(
       {
-        enabled: !0,
         opacity: 0.5,
         color: 16711680,
         overwrite: !1
       },
       t
     );
-    s.color = new te(s.color).getHex(), es.traverseMeshes(e, (n) => {
-      n.userData[se] = s.enabled ? 1 : 0, n.userData[Se] = s.opacity, n.userData[Le] = s.color, n.userData[Ie] = s.overwrite ? 1 : 0;
-      const i = n.material;
-      i && !Array.isArray(i) && (i.transparent = !0, i.colorNode = ts, i.opacityNode = ss, i.needsUpdate = !0);
-    });
+    i.color = new V(i.color).getHex();
+    for (const n of s)
+      W.traverseMeshes(n, (r) => {
+        r.userData[F] = 1, r.userData[je] = i.opacity, r.userData[Ue] = i.color, r.userData[ke] = i.overwrite ? 1 : 0, ve(r);
+      });
+  }
+  static removeHighlightColor(e) {
+    const t = Array.isArray(e) ? e : [e];
+    for (const s of t)
+      W.traverseMeshes(s, (i) => {
+        i.userData[F] = 0, be(i);
+      });
+  }
+  static breatheColor(e, t = {}) {
+    const s = Array.isArray(e) ? e : [e], i = Object.assign(
+      {
+        color: 65280,
+        speed: 1,
+        intensity: 2
+      },
+      t
+    );
+    i.color = new V(i.color).getHex();
+    for (const n of s)
+      W.traverseMeshes(n, (r) => {
+        r.userData[te] = 1, r.userData[Ge] = i.color, r.userData[Fe] = i.speed, r.userData[ze] = i.intensity, ve(r);
+      });
+  }
+  static removeBreatheColor(e) {
+    const t = Array.isArray(e) ? e : [e];
+    for (const s of t)
+      W.traverseMeshes(s, (i) => {
+        i.userData[te] = 0, be(i);
+      });
   }
 }
-const ns = (c) => {
-  const e = c.shiftRight(16).bitAnd(255).toFloat().div(255), t = c.shiftRight(8).bitAnd(255).toFloat().div(255), s = c.bitAnd(255).toFloat().div(255);
-  return gt(e, t, s);
+const Ce = (a) => {
+  const e = a.shiftRight(16).bitAnd(255).toFloat().div(255), t = a.shiftRight(8).bitAnd(255).toFloat().div(255), s = a.bitAnd(255).toFloat().div(255);
+  return At(e, t, s);
 };
-class is extends Et {
+class Is extends Yt {
   viewer;
   constructor(e, t) {
     super(t), this.viewer = e;
@@ -1352,7 +1546,7 @@ class is extends Et {
     this.update(e) && this.viewer.render();
   };
   easingByMode(e) {
-    const t = rs[e];
+    const t = Ls[e];
     return super.easing(t);
   }
   start(e, t) {
@@ -1362,80 +1556,87 @@ class is extends Et {
     return this.viewer.removeEventListener("afterControlsUpdate", this._update), super.stop();
   }
 }
-function Bs(c, e, t, s = {}, n, i) {
-  return new Promise((r, a) => {
-    const { duration: o = 1e3, delay: h = 0, repeat: l = !1, mode: p = "Linear.None", yoyo: g = !1 } = s, u = new is(c, e).to(t, o).easingByMode(p).delay(h).onUpdate((w) => {
-      n?.(w, u);
+function hi(a, e, t, s = {}, i, n) {
+  return new Promise((r, o) => {
+    const { duration: c = 1e3, delay: h = 0, repeat: l = !1, mode: d = "Linear.None", yoyo: g = !1 } = s, p = new Is(a, e).to(t, c).easingByMode(d).delay(h).onUpdate((y) => {
+      i?.(y, p);
     }).onComplete(() => {
       r();
     }).onStop(() => {
-      a("animation stop");
+      o("animation stop");
     }).onStart(() => {
-      i?.(u);
+      n?.(p);
     });
-    typeof l == "number" ? u.repeat(l) : typeof l == "boolean" && l && u.repeat(1 / 0), g && u.repeatDelay(20), u.yoyo(g), u.start();
+    typeof l == "number" ? p.repeat(l) : typeof l == "boolean" && l && p.repeat(1 / 0), g && p.repeatDelay(20), p.yoyo(g), p.start();
   });
 }
-const rs = {
-  "Linear.None": d.Linear.None,
-  "Quadratic.In": d.Quadratic.In,
-  "Quadratic.Out": d.Quadratic.Out,
-  "Quadratic.InOut": d.Quadratic.InOut,
-  "Cubic.In": d.Cubic.In,
-  "Cubic.Out": d.Cubic.Out,
-  "Cubic.InOut": d.Cubic.InOut,
-  "Quartic.In": d.Quartic.In,
-  "Quartic.Out": d.Quartic.Out,
-  "Quartic.InOut": d.Quartic.InOut,
-  "Quintic.In": d.Quintic.In,
-  "Quintic.Out": d.Quintic.Out,
-  "Quintic.InOut": d.Quintic.InOut,
-  "Sinusoidal.In": d.Sinusoidal.In,
-  "Sinusoidal.Out": d.Sinusoidal.Out,
-  "Sinusoidal.InOut": d.Sinusoidal.InOut,
-  "Exponential.In": d.Exponential.In,
-  "Exponential.Out": d.Exponential.Out,
-  "Exponential.InOut": d.Exponential.InOut,
-  "Circular.In": d.Circular.In,
-  "Circular.Out": d.Circular.Out,
-  "Circular.InOut": d.Circular.InOut,
-  "Elastic.In": d.Elastic.In,
-  "Elastic.Out": d.Elastic.Out,
-  "Elastic.InOut": d.Elastic.InOut,
-  "Back.In": d.Back.In,
-  "Back.Out": d.Back.Out,
-  "Back.InOut": d.Back.InOut,
-  "Bounce.In": d.Bounce.In,
-  "Bounce.Out": d.Bounce.Out,
-  "Bounce.InOut": d.Bounce.InOut
-};
+const Ls = {
+  "Linear.None": u.Linear.None,
+  "Quadratic.In": u.Quadratic.In,
+  "Quadratic.Out": u.Quadratic.Out,
+  "Quadratic.InOut": u.Quadratic.InOut,
+  "Cubic.In": u.Cubic.In,
+  "Cubic.Out": u.Cubic.Out,
+  "Cubic.InOut": u.Cubic.InOut,
+  "Quartic.In": u.Quartic.In,
+  "Quartic.Out": u.Quartic.Out,
+  "Quartic.InOut": u.Quartic.InOut,
+  "Quintic.In": u.Quintic.In,
+  "Quintic.Out": u.Quintic.Out,
+  "Quintic.InOut": u.Quintic.InOut,
+  "Sinusoidal.In": u.Sinusoidal.In,
+  "Sinusoidal.Out": u.Sinusoidal.Out,
+  "Sinusoidal.InOut": u.Sinusoidal.InOut,
+  "Exponential.In": u.Exponential.In,
+  "Exponential.Out": u.Exponential.Out,
+  "Exponential.InOut": u.Exponential.InOut,
+  "Circular.In": u.Circular.In,
+  "Circular.Out": u.Circular.Out,
+  "Circular.InOut": u.Circular.InOut,
+  "Elastic.In": u.Elastic.In,
+  "Elastic.Out": u.Elastic.Out,
+  "Elastic.InOut": u.Elastic.InOut,
+  "Back.In": u.Back.In,
+  "Back.Out": u.Back.Out,
+  "Back.InOut": u.Back.InOut,
+  "Bounce.In": u.Bounce.In,
+  "Bounce.Out": u.Bounce.Out,
+  "Bounce.InOut": u.Bounce.InOut
+}, As = "0.0.5";
+window.__USPACE__ = { version: As };
 export {
-  Ee as BaseGroup,
-  j as BaseMesh,
-  Zt as BaseSprite,
-  Bt as CameraControls,
-  Ps as CircleMesh,
-  Pe as ExtrudeMesh,
-  Ot as InteractionEvent,
-  Pt as InteractionManager,
-  Is as MaterialEffects,
-  W as Model,
-  R as ModelLoaderManager,
-  St as ObjectManager,
-  es as ObjectUtils,
-  Os as PlaneMesh,
-  Es as Poi,
-  Rt as RoomEnvironment,
-  Jt as SBMLoader,
-  Ut as SBMXLoader,
-  Oe as ShapeMesh,
-  Vt as SphereMesh,
-  Ss as TSLEffects,
-  xs as TextureLoaderManager,
-  Ms as Topology,
-  ue as TubeMesh,
-  is as Tween,
-  Cs as Viewer,
-  Ls as reinterpretType,
-  Bs as tweenAnimation
+  Be as BaseGroup,
+  k as BaseMesh,
+  Ms as BaseSprite,
+  pi as CSS2DObject,
+  mi as CSS3DObject,
+  gi as CSS3DSprite,
+  cs as CSSRenderer,
+  ss as CameraControls,
+  ri as CircleMesh,
+  De as ExtrudeMesh,
+  Jt as InteractionEvent,
+  Zt as InteractionManager,
+  ci as MaterialEffects,
+  Z as Model,
+  B as ModelLoaderManager,
+  Vt as ObjectManager,
+  W as ObjectUtils,
+  ni as PlaneMesh,
+  ii as Poi,
+  es as RenderPipeline,
+  ns as RoomEnvironment,
+  Es as SBMLoader,
+  ls as SBMXLoader,
+  _e as ShapeMesh,
+  Ps as SphereMesh,
+  ai as TSLEffects,
+  ti as TextureLoaderManager,
+  si as Topology,
+  we as TubeMesh,
+  Is as Tween,
+  ei as Viewer,
+  oi as reinterpretType,
+  hi as tweenAnimation,
+  As as version
 };