@relu-interactives/spatial-ecs 0.3.5 → 0.3.7

package/dist/systems/index.cjs

@@ -2109,6 +2109,7 @@ var XRInteractableComponent = _XRInteractableComponent;
 var _XRRigComponent = class _XRRigComponent extends Component {
   constructor(options) {
     super();
+    this.trackingOrigin = options?.trackingOrigin ?? "floor";
     this.locomotion = options?.locomotion ?? "teleport";
     this.moveSpeed = options?.moveSpeed ?? 2;
     this.snapTurn = options?.snapTurn ?? true;
@@ -2119,6 +2120,29 @@ var _XRRigComponent = class _XRRigComponent extends Component {
 __name(_XRRigComponent, "XRRigComponent");
 var XRRigComponent = _XRRigComponent;
 
+// core/components/XRInteractor.ts
+var _XRInteractorComponent = class _XRInteractorComponent extends Component {
+  constructor(options) {
+    super();
+    this.interactorType = options?.interactorType ?? "both";
+    this.handPreset = options?.handPreset ?? "default";
+    this.handColor = options?.handColor ?? "#e8b48a";
+    this.handOpacity = options?.handOpacity ?? 1;
+    this.handEmissiveIntensity = options?.handEmissiveIntensity ?? 0;
+    this.showRay = options?.showRay ?? true;
+  }
+};
+__name(_XRInteractorComponent, "XRInteractorComponent");
+var XRInteractorComponent = _XRInteractorComponent;
+var _XRInteractorSideComponent = class _XRInteractorSideComponent extends Component {
+  constructor(options) {
+    super();
+    this.side = options?.side ?? "left";
+  }
+};
+__name(_XRInteractorSideComponent, "XRInteractorSideComponent");
+var XRInteractorSideComponent = _XRInteractorSideComponent;
+
 // core/utils/dracoDecoderPath.ts
 var LOCAL_DRACO_DECODER_RELATIVE_PATH = "./assets/draco/";
 var DRACO_DECODER_CDN_PATH = "https://www.gstatic.com/draco/versioned/decoders/1.5.7/";
@@ -4913,6 +4937,14 @@ function buildComponentValueMaps(snapshot) {
       snapshot.components,
       "XRInteractableComponent"
     ),
+    xrInteractorValues: readByComponent(
+      snapshot.components,
+      "XRInteractorComponent"
+    ),
+    xrInteractorSideValues: readByComponent(
+      snapshot.components,
+      "XRInteractorSideComponent"
+    ),
     instancedMeshValues: readByComponent(snapshot.components, "InstancedMeshComponent"),
     instanceSlotValues: readByComponent(snapshot.components, "InstanceSlotComponent"),
     prefabNodeValues: readByComponent(snapshot.components, "PrefabNode"),
@@ -5099,6 +5131,60 @@ function restorePostCreateComponents(world, objectManagementSystem, targetEntity
       }
     }
   }
+  {
+    const sourceInteractor = asRecord3(
+      values.xrInteractorValues.get(sourceEntityId)
+    );
+    const interactor = world.getComponent(targetEntityId, XRInteractorComponent);
+    if (sourceInteractor && interactor) {
+      if (typeof sourceInteractor.interactorType === "string") {
+        interactor.interactorType = sourceInteractor.interactorType;
+      }
+      if (typeof sourceInteractor.handPreset === "string") {
+        interactor.handPreset = sourceInteractor.handPreset;
+      }
+      if (typeof sourceInteractor.handColor === "string") {
+        interactor.handColor = sourceInteractor.handColor;
+      }
+      if (typeof sourceInteractor.handOpacity === "number") {
+        interactor.handOpacity = sourceInteractor.handOpacity;
+      }
+      if (typeof sourceInteractor.handEmissiveIntensity === "number") {
+        interactor.handEmissiveIntensity = sourceInteractor.handEmissiveIntensity;
+      }
+      if (typeof sourceInteractor.showRay === "boolean") {
+        interactor.showRay = sourceInteractor.showRay;
+      }
+    }
+  }
+  {
+    const sourceSide = asRecord3(
+      values.xrInteractorSideValues.get(sourceEntityId)
+    );
+    if (sourceSide && typeof sourceSide.side === "string") {
+      const existing = world.getComponent(
+        targetEntityId,
+        XRInteractorSideComponent
+      );
+      if (existing) {
+        existing.side = sourceSide.side;
+      } else {
+        world.addComponent(
+          targetEntityId,
+          new XRInteractorSideComponent({
+            side: sourceSide.side
+          })
+        );
+      }
+    }
+  }
+  {
+    const sourceRigOrigin = asRecord3(values.xrRigValues.get(sourceEntityId));
+    const rigForOrigin = world.getComponent(targetEntityId, XRRigComponent);
+    if (sourceRigOrigin && rigForOrigin && typeof sourceRigOrigin.trackingOrigin === "string") {
+      rigForOrigin.trackingOrigin = sourceRigOrigin.trackingOrigin;
+    }
+  }
   {
     const imComponent = world.getComponent(targetEntityId, InstancedMeshComponent);
     if (imComponent && imComponent.instanceEntityIds.length > 0) {
@@ -5688,6 +5774,7 @@ var HYDRATABLE_ENTITY_KINDS = /* @__PURE__ */ new Set([
   "instanceSlot",
   "scriptObject",
   "xrRig",
+  "xrInteractor",
   "teleportArea"
 ]);
 
@@ -7698,6 +7785,9 @@ var _XRInputSystem = class _XRInputSystem {
         state.hasAxes = false;
         state.buttons = [];
       }
+    }
+    for (const record of this.records.values()) {
+      const state = record.state;
       if (record.pendingSelectStart) {
         state.select = true;
         state.selectStart = true;
@@ -7933,6 +8023,10 @@ var _XRLocomotionSystem = class _XRLocomotionSystem {
     /** Curve up to the landing point, for the visual system. Empty when not aiming. */
     this.aimCurve = [];
     this.landingPoint = null;
+    /** True when the current aim lands somewhere the player may actually stand. */
+    this.aimValid = false;
+    /** Sources currently aiming via thumbstick (hysteresis, so it doesn't chatter). */
+    this.stickAiming = /* @__PURE__ */ new WeakSet();
     /** True once we've tried to self-heal camera parenting for this session. */
     this.parentingChecked = false;
     this.inputSystem = inputSystem;
@@ -7940,6 +8034,7 @@ var _XRLocomotionSystem = class _XRLocomotionSystem {
   update(world, deltaTime) {
     this.aimCurve = [];
     this.landingPoint = null;
+    this.aimValid = false;
     if (!world.isXrPresenting()) {
       this.parentingChecked = false;
       return;
@@ -7947,6 +8042,7 @@ var _XRLocomotionSystem = class _XRLocomotionSystem {
     if (!this.parentingChecked) {
       this.parentingChecked = true;
       this.ensureCameraUnderRig(world);
+      this.warnOnIncompleteSetup(world);
     }
     const rigEntityId = world.query(XRRigComponent, TransformComponent)[0];
     if (typeof rigEntityId !== "number") return;
@@ -7964,6 +8060,26 @@ var _XRLocomotionSystem = class _XRLocomotionSystem {
       this.applySmoothMove(world, rig, rigTransform, inputs, deltaTime);
     }
   }
+  /**
+   * Name what is missing, once per session.
+   *
+   * Inside a headset there is no console and no inspector, so a scene that
+   * simply cannot move gives the author nothing to go on. These messages are
+   * visible over remote debugging and say exactly which entity to add.
+   */
+  warnOnIncompleteSetup(world) {
+    if (typeof world.query(XRRigComponent)[0] !== "number") {
+      console.warn(
+        "[XRLocomotion] No XR Rig in this scene \u2014 the player cannot move. Add one via Add Object \u2192 VR \u2192 XR Rig (the scene camera is parented to it automatically)."
+      );
+      return;
+    }
+    if (world.query(VRTeleportAreaComponent).length === 0) {
+      console.warn(
+        "[XRLocomotion] No Teleport Area in this scene \u2014 teleport has nowhere to land. Add one via Add Object \u2192 VR \u2192 Teleport Area, or add a Teleport Area component to an existing floor."
+      );
+    }
+  }
   /**
    * Guarantee the render camera is a CHILD of the rig.
    *
@@ -8031,29 +8147,60 @@ var _XRLocomotionSystem = class _XRLocomotionSystem {
   }
   applyTeleport(world, transform, inputs) {
     const targets = this.collectTeleportTargets(world);
-    if (targets.length === 0) return;
     for (const input of inputs) {
-      if (!input.select && !input.selectEnd) continue;
+      const source = input;
+      const stick = this.readStickAim(input, source);
+      const aiming = input.select || stick.aiming;
+      const commit = input.selectEnd || stick.released;
+      if (!aiming && !commit) continue;
       const points = sampleTeleportArc(
         input.rayOrigin,
         input.rayDirection,
         this.arcPoints
       );
       const hit = this.raycastArc(points, targets);
-      if (!hit) continue;
-      this.landingPoint = hit.point;
-      this.aimCurve = points.slice(0, hit.segmentIndex + 1).concat(hit.point);
-      if (input.selectEnd) {
+      this.aimCurve = hit ? points.slice(0, hit.segmentIndex + 1).concat(hit.point) : points.slice();
+      this.landingPoint = hit ? hit.point : null;
+      this.aimValid = hit !== null;
+      if (commit && hit) {
         transform.position.x = hit.point.x;
         transform.position.y = hit.point.y;
         transform.position.z = hit.point.z;
         this.aimCurve = [];
         this.landingPoint = null;
+        this.aimValid = false;
+      } else if (commit) {
+        this.aimCurve = [];
+        this.aimValid = false;
       }
     }
   }
+  /**
+   * Thumbstick-forward aiming with hysteresis.
+   *
+   * Engaging at 0.6 and releasing at 0.3 stops a stick resting near the
+   * threshold from flickering the arc on and off — and the release edge is what
+   * commits the teleport, so chatter there would teleport the player randomly.
+   */
+  readStickAim(input, source) {
+    if (!input.hasAxes || input.axes.length < 4) {
+      return { aiming: false, released: false };
+    }
+    const forward = -(input.axes[3] ?? 0);
+    const wasAiming = this.stickAiming.has(source);
+    if (!wasAiming && forward > 0.6) {
+      this.stickAiming.add(source);
+      return { aiming: true, released: false };
+    }
+    if (wasAiming && forward < 0.3) {
+      this.stickAiming.delete(source);
+      return { aiming: false, released: true };
+    }
+    return { aiming: wasAiming, released: false };
+  }
   /** Walk the arc segment-by-segment, returning the first surface hit. */
   raycastArc(points, targets) {
+    if (targets.length === 0) return null;
     for (let i = 1; i < points.length; i += 1) {
       const from = points[i - 1];
       const to = points[i];
@@ -8084,6 +8231,10 @@ var _XRLocomotionSystem = class _XRLocomotionSystem {
   getAimCurve() {
     return this.aimCurve;
   }
+  /** True when the aim lands on a valid teleport area. */
+  isAimValid() {
+    return this.aimValid;
+  }
   /** Where the arc currently lands, or null when not aiming at a valid area. */
   getLandingPoint() {
     return this.landingPoint;
@@ -8126,6 +8277,8 @@ var _XRSessionSystem = class _XRSessionSystem {
   constructor(inputSystem) {
     this.presenting = false;
     this.capabilities = NO_XR_CAPABILITIES;
+    /** Y compensation applied when a floor-relative space was requested but not granted. */
+    this.appliedOriginOffset = 0;
     this.inputSystem = inputSystem ?? null;
   }
   update(world) {
@@ -8149,11 +8302,59 @@ var _XRSessionSystem = class _XRSessionSystem {
     if (session && this.inputSystem) {
       this.inputSystem.attachSession(session);
     }
+    this.applyTrackingOrigin(world, session ?? null);
     this.forEachBehaviour(world, (behaviour) => {
       behaviour.onXRSessionStart(this.capabilities);
     });
   }
+  /**
+   * Apply the rig's authored tracking origin, and compensate when the device
+   * cannot honour it.
+   *
+   * `floor` (`local-floor`) puts Y=0 on the user's real floor, which is what a
+   * scene authored standing on the ground expects. `eye` (`local`) puts Y=0 at
+   * the headset, for seated experiences.
+   *
+   * The compensation matters: `local-floor` is only ever REQUESTED as an
+   * optional feature (requiring it would make `requestSession` reject outright
+   * on devices that lack it). When it isn't granted, the runtime silently falls
+   * back to `local` — the origin jumps to head height and a floor-authored
+   * scene swallows the user, which is exactly the "I'm standing under the
+   * building" symptom. Offsetting the rig down by the eye height restores the
+   * intended floor relationship instead of leaving it broken.
+   */
+  applyTrackingOrigin(world, session) {
+    const rigEntityId = world.query(XRRigComponent, TransformComponent)[0];
+    if (typeof rigEntityId !== "number") return;
+    const rig = world.getComponent(rigEntityId, XRRigComponent);
+    const transform = world.getComponent(rigEntityId, TransformComponent);
+    if (!rig || !transform) return;
+    const renderer = world.getRenderer();
+    const wantsFloor = rig.trackingOrigin === "floor";
+    try {
+      renderer.xr.setReferenceSpaceType(wantsFloor ? "local-floor" : "local");
+    } catch {
+    }
+    const granted = session?.enabledFeatures;
+    const floorGranted = Array.isArray(granted) ? granted.includes("local-floor") : (
+      // No report at all: trust the request, since a wrong offset is worse
+      // than none on devices that did honour it.
+      true
+    );
+    this.appliedOriginOffset = wantsFloor && !floorGranted ? rig.fallbackEyeHeight : 0;
+    if (this.appliedOriginOffset !== 0) {
+      transform.position.y -= this.appliedOriginOffset;
+    }
+  }
   handleSessionEnd(world) {
+    if (this.appliedOriginOffset !== 0) {
+      const rigEntityId = world.query(XRRigComponent, TransformComponent)[0];
+      if (typeof rigEntityId === "number") {
+        const transform = world.getComponent(rigEntityId, TransformComponent);
+        if (transform) transform.position.y += this.appliedOriginOffset;
+      }
+      this.appliedOriginOffset = 0;
+    }
     this.capabilities = NO_XR_CAPABILITIES;
     this.inputSystem?.detachSession();
     this.forEachBehaviour(world, (behaviour) => {
@@ -8247,17 +8448,74 @@ var _VRTeleportAreaSystem = class _VRTeleportAreaSystem {
 };
 __name(_VRTeleportAreaSystem, "VRTeleportAreaSystem");
 var VRTeleportAreaSystem = _VRTeleportAreaSystem;
+function createHandMaterial(preset, options) {
+  const color = new THREE14__namespace.Color(options.color);
+  switch (preset) {
+    case "ghost":
+      return new THREE14__namespace.MeshBasicMaterial({
+        color,
+        transparent: true,
+        opacity: Math.min(1, Math.max(0.05, options.opacity * 0.45)),
+        depthWrite: false,
+        side: THREE14__namespace.DoubleSide
+      });
+    case "neon":
+      return new THREE14__namespace.MeshStandardMaterial({
+        color,
+        emissive: color,
+        emissiveIntensity: Math.max(0.5, options.emissiveIntensity || 2),
+        roughness: 0.35,
+        metalness: 0,
+        transparent: options.opacity < 1,
+        opacity: options.opacity
+      });
+    case "skeleton":
+      return new THREE14__namespace.MeshBasicMaterial({
+        color,
+        wireframe: true,
+        transparent: true,
+        opacity: options.opacity
+      });
+    case "custom":
+    case "default":
+      return new THREE14__namespace.MeshStandardMaterial({
+        color,
+        roughness: 0.85,
+        metalness: 0,
+        emissive: color,
+        emissiveIntensity: Math.max(0, options.emissiveIntensity),
+        transparent: options.opacity < 1,
+        opacity: options.opacity,
+        side: THREE14__namespace.DoubleSide
+      });
+    default: {
+      return new THREE14__namespace.MeshStandardMaterial({ color });
+    }
+  }
+}
+__name(createHandMaterial, "createHandMaterial");
+function applyHandMaterial(root, material) {
+  root.traverse((child) => {
+    const mesh = child;
+    if (!mesh.isMesh) return;
+    mesh.material = material;
+  });
+}
+__name(applyHandMaterial, "applyHandMaterial");
+var SLOTS = [
+  { index: 0, side: "left" },
+  { index: 1, side: "right" }
+];
 var _XRControllerVisualSystem = class _XRControllerVisualSystem {
   constructor(options) {
     this.controllerModelFactory = new XRControllerModelFactory_js.XRControllerModelFactory();
     this.handModelFactory = new XRHandModelFactory_js.XRHandModelFactory();
     this.group = new THREE14__namespace.Group();
-    this.built = false;
+    this.slots = /* @__PURE__ */ new Map();
     this.attachedTo = null;
-    /** Index → whether we've already attached visuals for that slot. */
-    this.ready = /* @__PURE__ */ new Set();
-    this.rays = [];
-    this.slots = options?.slots ?? 2;
+    /** Last applied preset signature, so materials rebuild only on real change. */
+    this.handStyleSignature = "";
+    this.handMaterial = null;
     this.interactionSystem = options?.interactionSystem ?? null;
     this.group.name = "XRControllerVisuals";
     this.group.userData.ecsPreviewHidden = true;
@@ -8266,39 +8524,111 @@ var _XRControllerVisualSystem = class _XRControllerVisualSystem {
     const renderer = world.getRenderer();
     if (!renderer.xr?.enabled) return;
     this.ensureAttached(world);
-    this.updateRayVisibility();
-    if (this.built) return;
-    for (let index = 0; index < this.slots; index += 1) {
-      if (this.ready.has(index)) continue;
+    this.ensureSlots(world);
+    const interactor = this.resolveInteractor(world);
+    const type = interactor?.interactorType ?? "both";
+    const showControllers = type === "controllers" || type === "both";
+    const showHands = type === "hands" || type === "both";
+    this.syncHandMaterial(interactor);
+    for (const { index, side } of SLOTS) {
+      const visuals = this.slots.get(index);
+      if (!visuals) continue;
+      visuals.controllerModel.visible = showControllers;
+      visuals.handModel.visible = showHands;
+      visuals.ray.visible = this.shouldShowRay(interactor);
+      if (showHands && this.handMaterial) {
+        applyHandMaterial(visuals.handModel, this.handMaterial);
+      }
+      this.syncCustomContent(world, visuals, side);
+    }
+  }
+  /** The scene's interactor config, if one was authored. */
+  resolveInteractor(world) {
+    const entityId = world.query(XRInteractorComponent)[0];
+    if (typeof entityId !== "number") return null;
+    return world.getComponent(entityId, XRInteractorComponent) ?? null;
+  }
+  /**
+   * Re-parent the author's left/right interactor content onto the tracked grip
+   * space so it follows the hand.
+   *
+   * `ObjectManagementSystem` reconciles ECS objects back under their ParentId
+   * every frame, so this re-attach has to be re-asserted — the same coexistence
+   * dance the AR anchor system performs.
+   */
+  syncCustomContent(world, visuals, side) {
+    let content = null;
+    for (const entityId of world.query(
+      XRInteractorSideComponent,
+      Object3DRef
+    )) {
+      const slot = world.getComponent(entityId, XRInteractorSideComponent);
+      if (slot?.side !== side) continue;
+      content = world.getComponent(entityId, Object3DRef)?.object ?? null;
+      break;
+    }
+    if (!content) {
+      visuals.attachedCustom = null;
+      return;
+    }
+    if (content.parent !== visuals.grip) {
+      visuals.grip.add(content);
+    }
+    visuals.attachedCustom = content;
+  }
+  /** Rebuild the hand material only when the authored style actually changes. */
+  syncHandMaterial(interactor) {
+    const preset = interactor?.handPreset ?? "default";
+    const color = interactor?.handColor ?? "#e8b48a";
+    const opacity = interactor?.handOpacity ?? 1;
+    const emissive = interactor?.handEmissiveIntensity ?? 0;
+    const signature = `${preset}:${color}:${opacity}:${emissive}`;
+    if (signature === this.handStyleSignature && this.handMaterial) return;
+    this.handStyleSignature = signature;
+    this.handMaterial?.dispose();
+    this.handMaterial = createHandMaterial(preset, {
+      color,
+      opacity,
+      emissiveIntensity: emissive
+    });
+  }
+  /**
+   * The ray is meaningful only when it points at something. Authors can turn it
+   * off entirely; otherwise it appears on hover/grab so it isn't permanent
+   * clutter implying the whole scene is clickable.
+   */
+  shouldShowRay(interactor) {
+    if (interactor && !interactor.showRay) return false;
+    if (!this.interactionSystem) return true;
+    return this.interactionSystem.getHoveredEntityId() !== null || this.interactionSystem.isGrabbing();
+  }
+  /** Lazily build per-slot visuals; the device reports profiles late. */
+  ensureSlots(world) {
+    const renderer = world.getRenderer();
+    for (const { index } of SLOTS) {
+      if (this.slots.has(index)) continue;
       const controller = renderer.xr.getController(index);
       const grip = renderer.xr.getControllerGrip(index);
       const hand = renderer.xr.getHand(index);
       if (!controller || !grip || !hand) continue;
       const ray = this.createRay();
-      this.rays.push(ray);
       controller.add(ray);
-      this.group.add(controller);
-      grip.add(this.controllerModelFactory.createControllerModel(grip));
-      this.group.add(grip);
-      hand.add(this.handModelFactory.createHandModel(hand, "mesh"));
-      this.group.add(hand);
-      this.ready.add(index);
-    }
-    if (this.ready.size >= this.slots) {
-      this.built = true;
+      const controllerModel = this.controllerModelFactory.createControllerModel(grip);
+      grip.add(controllerModel);
+      const handModel = this.handModelFactory.createHandModel(hand, "mesh");
+      hand.add(handModel);
+      this.group.add(controller, grip, hand);
+      this.slots.set(index, {
+        controller,
+        grip,
+        hand,
+        ray,
+        controllerModel,
+        handModel,
+        attachedCustom: null
+      });
     }
   }
-  /**
-   * Show the aim ray only when it is meaningful: hovering something
-   * interactive, or mid-grab. A permanently-drawn ray is visual noise, and it
-   * implies everything is clickable when most of the scene is not. Teleport
-   * aiming has its own arc, so the straight ray stays hidden for that.
-   */
-  updateRayVisibility() {
-    if (!this.interactionSystem) return;
-    const active = this.interactionSystem.getHoveredEntityId() !== null || this.interactionSystem.isGrabbing();
-    for (const ray of this.rays) ray.visible = active;
-  }
   /**
    * Parent the visuals to the XR rig when there is one, so locomotion moves the
    * hands with the player. Falls back to the scene root.
@@ -8324,7 +8654,7 @@ var _XRControllerVisualSystem = class _XRControllerVisualSystem {
     const line = new THREE14__namespace.Line(geometry, material);
     line.name = "XRPointerRay";
     line.renderOrder = 999;
-    line.visible = this.interactionSystem === null;
+    line.visible = false;
     return line;
   }
   dispose() {
@@ -8340,9 +8670,10 @@ var _XRControllerVisualSystem = class _XRControllerVisualSystem {
       }
     });
     this.group.clear();
-    this.rays.length = 0;
-    this.ready.clear();
-    this.built = false;
+    this.slots.clear();
+    this.handMaterial?.dispose();
+    this.handMaterial = null;
+    this.handStyleSignature = "";
     this.attachedTo = null;
   }
 };
@@ -8350,6 +8681,7 @@ __name(_XRControllerVisualSystem, "XRControllerVisualSystem");
 var XRControllerVisualSystem = _XRControllerVisualSystem;
 var MARKER_RADIUS = 0.28;
 var ACCENT = new THREE14__namespace.Color("#4da3ff");
+var BLOCKED = new THREE14__namespace.Color("#ff5a5a");
 var _XRTeleportVisualSystem = class _XRTeleportVisualSystem {
   constructor(locomotionSystem) {
     this.group = new THREE14__namespace.Group();
@@ -8380,16 +8712,22 @@ var _XRTeleportVisualSystem = class _XRTeleportVisualSystem {
     }
     const curve = this.locomotionSystem.getAimCurve();
     const landing = this.locomotionSystem.getLandingPoint();
-    if (!landing || curve.length < 2) {
+    const valid = this.locomotionSystem.isAimValid();
+    if (curve.length < 2) {
       this.setVisible(false);
       return;
     }
-    this.updateArcGeometry(curve);
-    this.marker.position.copy(landing);
-    this.marker.position.y += 0.01;
+    this.updateArcGeometry(curve, valid ? ACCENT : BLOCKED);
+    if (valid && landing) {
+      this.marker.position.copy(landing);
+      this.marker.position.y += 0.01;
+      this.marker.visible = true;
+    } else {
+      this.marker.visible = false;
+    }
     this.setVisible(true);
   }
-  updateArcGeometry(curve) {
+  updateArcGeometry(curve, tint) {
     const count = curve.length;
     const positions = new Float32Array(count * 3);
     const colors = new Float32Array(count * 3);
@@ -8400,9 +8738,9 @@ var _XRTeleportVisualSystem = class _XRTeleportVisualSystem {
       positions[i * 3 + 2] = point.z;
       const t = count > 1 ? i / (count - 1) : 0;
       const fade = 1 - t * 0.75;
-      colors[i * 3] = ACCENT.r * fade;
-      colors[i * 3 + 1] = ACCENT.g * fade;
-      colors[i * 3 + 2] = ACCENT.b * fade;
+      colors[i * 3] = tint.r * fade;
+      colors[i * 3 + 1] = tint.g * fade;
+      colors[i * 3 + 2] = tint.b * fade;
     }
     this.arcGeometry.setAttribute(
       "position",