@nice2dev/game-engine 1.3.15 → 1.3.17

package/dist/cjs/editor/VRARMode.js

@@ -1,656 +1,593 @@
-'use strict';
-
-/**
- * @file VRARMode.ts
- * @description VR/AR Mode with WebXR integration and hand tracking
- * PRO-1.4: Professional Editor Features
- *
- * Features:
- * - WebXR session management
- * - VR headset support
- * - AR passthrough mode
- * - Hand tracking
- * - Controller input
- * - Spatial anchors
- * - Room-scale setup
- * - Teleportation movement
- * - Haptic feedback
- * - Mixed reality support
- */
-// ============================================================
-// Default Settings
-// ============================================================
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const DEFAULT_XR_SETTINGS = {
-    sessionMode: 'immersive-vr',
-    referenceSpaceType: 'local-floor',
-    requiredFeatures: ['local-floor'],
-    optionalFeatures: ['hand-tracking', 'bounded-floor'],
-    framebufferScaleFactor: 1.0,
-    depthSensing: false,
-    lightEstimation: false,
-    teleportEnabled: true,
-    continuousMovement: false,
-    snapTurnAngle: 45,
-    vignetteOnMove: true,
-    handTrackingEnabled: true,
-    planeDetection: true,
-    hitTesting: true,
-    imageTracking: false,
-    roomScale: true,
-    boundaryVisible: true,
+  sessionMode: "immersive-vr",
+  referenceSpaceType: "local-floor",
+  requiredFeatures: ["local-floor"],
+  optionalFeatures: ["hand-tracking", "bounded-floor"],
+  framebufferScaleFactor: 1,
+  depthSensing: false,
+  lightEstimation: false,
+  teleportEnabled: true,
+  continuousMovement: false,
+  snapTurnAngle: 45,
+  vignetteOnMove: true,
+  handTrackingEnabled: true,
+  planeDetection: true,
+  hitTesting: true,
+  imageTracking: false,
+  roomScale: true,
+  boundaryVisible: true
 };
-// ============================================================
-// XR System
-// ============================================================
 class VRARMode {
-    constructor() {
-        this.xrSession = null;
-        this.xrReferenceSpace = null;
-        this.settings = { ...DEFAULT_XR_SETTINGS };
-        // State
-        this.isSupported = false;
-        this.isSessionActive = false;
-        this.frameId = 0;
-        // Input
-        this.controllers = new Map();
-        this.hands = new Map();
-        // Spatial
-        this.anchors = new Map();
-        this.roomBoundary = null;
-        this.detectedPlanes = new Map();
-        // Teleport
-        this.teleportTarget = null;
-        this.isTeleporting = false;
-        // Image tracking
-        this.imageTargets = new Map();
-        // Gestures
-        this.registeredGestures = new Map();
-        this.activeGestures = new Set();
-    }
-    // ─── Initialization ────────────────────────────────────
-    async checkSupport() {
-        if (!navigator.xr) {
-            return { vr: false, ar: false, handTracking: false };
-        }
-        const [vr, ar] = await Promise.all([
-            navigator.xr.isSessionSupported('immersive-vr').catch(() => false),
-            navigator.xr.isSessionSupported('immersive-ar').catch(() => false),
-        ]);
-        this.isSupported = vr || ar;
-        return {
-            vr,
-            ar,
-            handTracking: true, // Can only check during session
-        };
-    }
-    isXRSupported() {
-        return this.isSupported;
-    }
-    // ─── Session Management ────────────────────────────────
-    async startSession(mode) {
-        if (!navigator.xr) {
-            return false;
-        }
-        if (this.isSessionActive) {
-            return false;
-        }
-        const sessionMode = mode ?? this.settings.sessionMode;
-        try {
-            const options = {
-                requiredFeatures: this.settings.requiredFeatures,
-                optionalFeatures: this.settings.optionalFeatures,
-            };
-            this.xrSession = await navigator.xr.requestSession(sessionMode, options);
-            // Setup reference space
-            this.xrReferenceSpace = await this.xrSession.requestReferenceSpace(this.settings.referenceSpaceType);
-            // Setup event listeners
-            this.setupSessionListeners();
-            this.isSessionActive = true;
-            this.onSessionStarted?.();
-            // Start render loop
-            this.xrSession.requestAnimationFrame(this.onXRFrame.bind(this));
-            return true;
-        }
-        catch (error) {
-            console.error('Failed to start XR session:', error);
-            return false;
-        }
-    }
-    async endSession() {
-        if (!this.xrSession) {
-            return;
-        }
-        try {
-            await this.xrSession.end();
-        }
-        catch {
-            // Session may already be ended
-        }
-        this.cleanup();
-    }
-    cleanup() {
-        this.xrSession = null;
-        this.xrReferenceSpace = null;
-        this.isSessionActive = false;
-        this.controllers.clear();
-        this.hands.clear();
-        this.detectedPlanes.clear();
-        this.activeGestures.clear();
-        this.onSessionEnded?.();
-    }
-    setupSessionListeners() {
-        if (!this.xrSession) {
-            return;
-        }
-        this.xrSession.addEventListener('end', () => this.cleanup());
-        this.xrSession.addEventListener('inputsourceschange', this.onInputSourcesChange.bind(this));
-        this.xrSession.addEventListener('select', this.onSelect.bind(this));
-        this.xrSession.addEventListener('selectstart', this.onSelectStart.bind(this));
-        this.xrSession.addEventListener('selectend', this.onSelectEnd.bind(this));
-        this.xrSession.addEventListener('squeeze', this.onSqueeze.bind(this));
-        this.xrSession.addEventListener('squeezestart', this.onSqueezeStart.bind(this));
-        this.xrSession.addEventListener('squeezeend', this.onSqueezeEnd.bind(this));
-    }
-    // ─── Frame Loop ────────────────────────────────────────
-    onXRFrame(time, frame) {
-        if (!this.xrSession || !this.xrReferenceSpace) {
-            return;
-        }
-        this.frameId++;
-        // Update input sources
-        for (const inputSource of this.xrSession.inputSources) {
-            this.updateInputSource(inputSource, frame);
-        }
-        // Update hand tracking
-        this.updateHandTracking(frame);
-        // Check gestures
-        this.checkGestures();
-        // Update teleport
-        this.updateTeleport(frame);
-        // Callback
-        this.onFrame?.(time, frame);
-        // Continue loop
-        this.xrSession.requestAnimationFrame(this.onXRFrame.bind(this));
-    }
-    updateInputSource(inputSource, frame) {
-        if (!this.xrReferenceSpace) {
-            return;
-        }
-        const index = Array.from(this.xrSession?.inputSources ?? []).indexOf(inputSource);
-        const state = {
-            handedness: inputSource.handedness,
-            targetRayMode: inputSource.targetRayMode,
-            buttons: [],
-            axes: [],
-            isTracking: false,
-        };
-        // Get poses
-        const targetRayPose = frame.getPose(inputSource.targetRaySpace, this.xrReferenceSpace);
-        if (targetRayPose) {
-            state.pose = this.convertXRPose(targetRayPose);
-            state.isTracking = true;
-        }
-        if (inputSource.gripSpace) {
-            const gripPose = frame.getPose(inputSource.gripSpace, this.xrReferenceSpace);
-            if (gripPose) {
-                state.gripPose = this.convertXRPose(gripPose);
-            }
-        }
-        // Get gamepad state
-        if (inputSource.gamepad) {
-            state.buttons = inputSource.gamepad.buttons.map((btn) => ({
-                pressed: btn.pressed,
-                touched: btn.touched,
-                value: btn.value,
-            }));
-            state.axes = Array.from(inputSource.gamepad.axes);
-        }
-        this.controllers.set(index, state);
-    }
-    updateHandTracking(frame) {
-        if (!this.settings.handTrackingEnabled || !this.xrSession || !this.xrReferenceSpace) {
-            return;
-        }
-        for (const inputSource of this.xrSession.inputSources) {
-            const hand = inputSource.hand;
-            if (!hand) {
-                continue;
-            }
-            const side = inputSource.handedness;
-            if (side !== 'left' && side !== 'right') {
-                continue;
-            }
-            const handState = this.extractHandState(hand, frame, side);
-            if (handState) {
-                this.hands.set(side, handState);
-                this.onHandTrackingUpdate?.(handState);
-            }
-        }
-    }
-    extractHandState(hand, frame, side) {
-        if (!this.xrReferenceSpace) {
-            return null;
-        }
-        const joints = {
-            thumb: [],
-            index: [],
-            middle: [],
-            ring: [],
-            pinky: [],
-        };
-        // Extract joint poses
-        const jointNames = [
-            'wrist',
-            'thumb-metacarpal',
-            'thumb-phalanx-proximal',
-            'thumb-phalanx-distal',
-            'thumb-tip',
-            'index-finger-metacarpal',
-            'index-finger-phalanx-proximal',
-            'index-finger-phalanx-intermediate',
-            'index-finger-phalanx-distal',
-            'index-finger-tip',
-            'middle-finger-metacarpal',
-            'middle-finger-phalanx-proximal',
-            'middle-finger-phalanx-intermediate',
-            'middle-finger-phalanx-distal',
-            'middle-finger-tip',
-            'ring-finger-metacarpal',
-            'ring-finger-phalanx-proximal',
-            'ring-finger-phalanx-intermediate',
-            'ring-finger-phalanx-distal',
-            'ring-finger-tip',
-            'pinky-finger-metacarpal',
-            'pinky-finger-phalanx-proximal',
-            'pinky-finger-phalanx-intermediate',
-            'pinky-finger-phalanx-distal',
-            'pinky-finger-tip',
-        ];
-        let isTracking = false;
-        for (const jointName of jointNames) {
-            const jointSpace = hand.get(jointName);
-            if (!jointSpace) {
-                continue;
-            }
-            const jointPose = frame.getJointPose?.(jointSpace, this.xrReferenceSpace);
-            if (!jointPose) {
-                continue;
-            }
-            isTracking = true;
-            const pose = {
-                position: {
-                    x: jointPose.transform.position.x,
-                    y: jointPose.transform.position.y,
-                    z: jointPose.transform.position.z,
-                },
-                orientation: {
-                    x: jointPose.transform.orientation.x,
-                    y: jointPose.transform.orientation.y,
-                    z: jointPose.transform.orientation.z,
-                    w: jointPose.transform.orientation.w,
-                },
-                radius: jointPose.radius ?? 0,
-            };
-            if (jointName === 'wrist') {
-                joints.wrist = pose;
-            }
-            else if (jointName.startsWith('thumb')) {
-                joints.thumb.push(pose);
-            }
-            else if (jointName.startsWith('index')) {
-                joints.index.push(pose);
-            }
-            else if (jointName.startsWith('middle')) {
-                joints.middle.push(pose);
-            }
-            else if (jointName.startsWith('ring')) {
-                joints.ring.push(pose);
-            }
-            else if (jointName.startsWith('pinky')) {
-                joints.pinky.push(pose);
-            }
-        }
-        return {
-            side,
-            joints,
-            isTracking,
-            pinchStrength: this.calculatePinchStrength(joints),
-            gripStrength: this.calculateGripStrength(joints),
-        };
-    }
-    calculatePinchStrength(joints) {
-        if (joints.thumb.length < 4 || joints.index.length < 4) {
-            return 0;
-        }
-        const thumbTip = joints.thumb[3];
-        const indexTip = joints.index[4];
-        const distance = this.distance(thumbTip.position, indexTip.position);
-        const maxDistance = 0.1; // 10cm
-        return Math.max(0, 1 - distance / maxDistance);
-    }
-    calculateGripStrength(joints) {
-        // Simplified grip detection based on finger curl
-        let curlSum = 0;
-        const fingers = [joints.index, joints.middle, joints.ring, joints.pinky];
-        for (const finger of fingers) {
-            if (finger.length >= 4) {
-                const tip = finger[finger.length - 1];
-                const base = finger[0];
-                if (joints.wrist) {
-                    const fingerLength = this.distance(tip.position, base.position);
-                    const toWrist = this.distance(tip.position, joints.wrist.position);
-                    curlSum += Math.max(0, 1 - fingerLength / toWrist);
-                }
-            }
-        }
-        return curlSum / 4;
-    }
-    distance(a, b) {
-        return Math.sqrt(Math.pow(a.x - b.x, 2) + Math.pow(a.y - b.y, 2) + Math.pow(a.z - b.z, 2));
-    }
-    convertXRPose(pose) {
-        return {
-            position: {
-                x: pose.transform.position.x,
-                y: pose.transform.position.y,
-                z: pose.transform.position.z,
-            },
-            orientation: {
-                x: pose.transform.orientation.x,
-                y: pose.transform.orientation.y,
-                z: pose.transform.orientation.z,
-                w: pose.transform.orientation.w,
-            },
-        };
-    }
-    // ─── Input Events ──────────────────────────────────────
-    onInputSourcesChange(event) {
-        for (const inputSource of event.added) {
-            const index = Array.from(this.xrSession?.inputSources ?? []).indexOf(inputSource);
-            const state = {
-                handedness: inputSource.handedness,
-                targetRayMode: inputSource.targetRayMode,
-                buttons: [],
-                axes: [],
-                isTracking: false,
-            };
-            this.controllers.set(index, state);
-            this.onControllerConnected?.(state, index);
-        }
-        for (const inputSource of event.removed) {
-            const index = Array.from(this.xrSession?.inputSources ?? []).indexOf(inputSource);
-            if (index >= 0) {
-                this.controllers.delete(index);
-                this.onControllerDisconnected?.(index);
-            }
-        }
-    }
-    onSelect(_event) {
-        // Primary action completed
-    }
-    onSelectStart(_event) {
-        // Primary action started
-    }
-    onSelectEnd(_event) {
-        // Primary action ended
-        if (this.settings.teleportEnabled && this.teleportTarget?.valid) {
-            this.executeTeleport();
-        }
-    }
-    onSqueeze(_event) {
-        // Squeeze action completed
-    }
-    onSqueezeStart(_event) {
-        // Squeeze action started
-    }
-    onSqueezeEnd(_event) {
-        // Squeeze action ended
-    }
-    // ─── Gesture Detection ─────────────────────────────────
-    registerGesture(gesture) {
-        this.registeredGestures.set(gesture.id, gesture);
-    }
-    unregisterGesture(gestureId) {
-        this.registeredGestures.delete(gestureId);
-        this.activeGestures.delete(gestureId);
-    }
-    checkGestures() {
-        for (const [side, hand] of this.hands) {
-            for (const [id, gesture] of this.registeredGestures) {
-                if (gesture.hand && gesture.hand !== side) {
-                    continue;
-                }
-                const isActive = this.isGestureActive(gesture, hand);
-                const wasActive = this.activeGestures.has(`${id}_${side}`);
-                if (isActive && !wasActive) {
-                    this.activeGestures.add(`${id}_${side}`);
-                    this.onGestureDetected?.(id, side);
-                }
-                else if (!isActive && wasActive) {
-                    this.activeGestures.delete(`${id}_${side}`);
-                    this.onGestureEnded?.(id, side);
-                }
-            }
-        }
-    }
-    isGestureActive(gesture, hand) {
-        if (gesture.customChecker) {
-            return gesture.customChecker(hand);
-        }
-        switch (gesture.type) {
-            case 'pinch':
-                return hand.pinchStrength > 0.8;
-            case 'grab':
-                return hand.gripStrength > 0.8;
-            case 'open_hand':
-                return hand.gripStrength < 0.2 && hand.pinchStrength < 0.2;
-            case 'fist':
-                return hand.gripStrength > 0.9;
-            case 'point':
-                // Index extended, others curled
-                return hand.gripStrength > 0.6 && hand.pinchStrength < 0.3;
-            default:
-                return false;
-        }
-    }
-    // ─── Teleportation ─────────────────────────────────────
-    updateTeleport(_frame) {
-        if (!this.settings.teleportEnabled) {
-            return;
-        }
-        // Get controller ray for teleport targeting
-        const controller = this.getControllerByHandedness('right') ?? this.getControllerByHandedness('left');
-        if (!controller?.pose) {
-            this.teleportTarget = null;
-            return;
-        }
-        // Cast ray to find valid teleport target
-        // This would need integration with scene raycast
-        // For now, just clear the target
-    }
-    setTeleportTarget(target) {
-        this.teleportTarget = target;
-    }
-    executeTeleport() {
-        if (!this.teleportTarget?.valid) {
-            return;
-        }
-        this.isTeleporting = true;
-        this.onTeleport?.(this.teleportTarget);
-        this.teleportTarget = null;
-        this.isTeleporting = false;
-    }
-    teleportTo(position) {
-        const target = {
-            position,
-            normal: { x: 0, y: 1, z: 0 },
-            valid: true,
-        };
-        this.onTeleport?.(target);
-    }
-    // ─── Locomotion ────────────────────────────────────────
-    snapTurn(direction) {
-        this.settings.snapTurnAngle * (direction === 'left' ? -1 : 1);
-        // Apply rotation to player
-        // This would need integration with player transform
-    }
-    // ─── Haptics ───────────────────────────────────────────
-    triggerHaptics(handedness, feedback) {
-        if (!this.xrSession) {
-            return;
-        }
-        for (const inputSource of this.xrSession.inputSources) {
-            if (inputSource.handedness !== handedness) {
-                continue;
-            }
-            const actuator = inputSource.gamepad?.hapticActuators?.[0];
-            if (actuator && 'pulse' in actuator) {
-                actuator.pulse(feedback.intensity, feedback.duration);
-            }
-        }
-    }
-    // ─── Spatial Anchors ───────────────────────────────────
-    async createAnchor(pose, name, persistent = false, metadata) {
-        const anchor = {
-            id: `anchor_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
-            name,
-            pose,
-            createdAt: Date.now(),
-            persistent,
-            metadata,
-        };
-        this.anchors.set(anchor.id, anchor);
-        this.onAnchorAdded?.(anchor);
-        return anchor;
-    }
-    getAnchor(id) {
-        return this.anchors.get(id);
-    }
-    getAnchors() {
-        return Array.from(this.anchors.values());
-    }
-    removeAnchor(id) {
-        const deleted = this.anchors.delete(id);
-        if (deleted) {
-            this.onAnchorRemoved?.(id);
-        }
-        return deleted;
-    }
-    // ─── Plane Detection (AR) ──────────────────────────────
-    getDetectedPlanes() {
-        return Array.from(this.detectedPlanes.values());
-    }
-    getPlanesByClassification(classification) {
-        return Array.from(this.detectedPlanes.values()).filter((p) => p.classification === classification);
-    }
-    // ─── Image Tracking (AR) ────────────────────────────────
-    addImageTarget(target) {
-        this.imageTargets.set(target.id, {
-            ...target,
-            tracked: false,
-        });
-    }
-    removeImageTarget(id) {
-        this.imageTargets.delete(id);
-    }
-    getTrackedImages() {
-        return Array.from(this.imageTargets.values()).filter((t) => t.tracked);
-    }
-    // ─── State Getters ─────────────────────────────────────
-    getSession() {
-        return this.xrSession;
-    }
-    getReferenceSpace() {
-        return this.xrReferenceSpace;
-    }
-    isActive() {
-        return this.isSessionActive;
-    }
-    getControllers() {
-        return Array.from(this.controllers.values());
-    }
-    getController(index) {
-        return this.controllers.get(index);
-    }
-    getControllerByHandedness(handedness) {
-        return Array.from(this.controllers.values()).find((c) => c.handedness === handedness);
-    }
-    getHand(side) {
-        return this.hands.get(side);
-    }
-    getHands() {
-        return Array.from(this.hands.values());
-    }
-    getRoomBoundary() {
-        return this.roomBoundary;
-    }
-    // ─── Settings ──────────────────────────────────────────
-    getSettings() {
-        return { ...this.settings };
-    }
-    setSettings(settings) {
-        this.settings = { ...this.settings, ...settings };
-    }
-    // ─── Callbacks ─────────────────────────────────────────
-    setOnSessionStarted(callback) {
-        this.onSessionStarted = callback;
-    }
-    setOnSessionEnded(callback) {
-        this.onSessionEnded = callback;
-    }
-    setOnFrame(callback) {
-        this.onFrame = callback;
-    }
-    setOnControllerConnected(callback) {
-        this.onControllerConnected = callback;
-    }
-    setOnControllerDisconnected(callback) {
-        this.onControllerDisconnected = callback;
-    }
-    setOnHandTrackingUpdate(callback) {
-        this.onHandTrackingUpdate = callback;
-    }
-    setOnGestureDetected(callback) {
-        this.onGestureDetected = callback;
-    }
-    setOnGestureEnded(callback) {
-        this.onGestureEnded = callback;
-    }
-    setOnTeleport(callback) {
-        this.onTeleport = callback;
-    }
-    setOnPlaneDetected(callback) {
-        this.onPlaneDetected = callback;
-    }
-    setOnImageTracked(callback) {
-        this.onImageTracked = callback;
-    }
-    setOnAnchorAdded(callback) {
-        this.onAnchorAdded = callback;
-    }
-    setOnAnchorRemoved(callback) {
-        this.onAnchorRemoved = callback;
-    }
+  constructor() {
+    this.xrSession = null;
+    this.xrReferenceSpace = null;
+    this.settings = { ...DEFAULT_XR_SETTINGS };
+    this.isSupported = false;
+    this.isSessionActive = false;
+    this.frameId = 0;
+    this.controllers = /* @__PURE__ */ new Map();
+    this.hands = /* @__PURE__ */ new Map();
+    this.anchors = /* @__PURE__ */ new Map();
+    this.roomBoundary = null;
+    this.detectedPlanes = /* @__PURE__ */ new Map();
+    this.teleportTarget = null;
+    this.isTeleporting = false;
+    this.imageTargets = /* @__PURE__ */ new Map();
+    this.registeredGestures = /* @__PURE__ */ new Map();
+    this.activeGestures = /* @__PURE__ */ new Set();
+  }
+  // ─── Initialization ────────────────────────────────────
+  async checkSupport() {
+    if (!navigator.xr) {
+      return { vr: false, ar: false, handTracking: false };
+    }
+    const [vr, ar] = await Promise.all([
+      navigator.xr.isSessionSupported("immersive-vr").catch(() => false),
+      navigator.xr.isSessionSupported("immersive-ar").catch(() => false)
+    ]);
+    this.isSupported = vr || ar;
+    return {
+      vr,
+      ar,
+      handTracking: true
+      // Can only check during session
+    };
+  }
+  isXRSupported() {
+    return this.isSupported;
+  }
+  // ─── Session Management ────────────────────────────────
+  async startSession(mode) {
+    if (!navigator.xr) {
+      return false;
+    }
+    if (this.isSessionActive) {
+      return false;
+    }
+    const sessionMode = mode ?? this.settings.sessionMode;
+    try {
+      const options = {
+        requiredFeatures: this.settings.requiredFeatures,
+        optionalFeatures: this.settings.optionalFeatures
+      };
+      this.xrSession = await navigator.xr.requestSession(sessionMode, options);
+      this.xrReferenceSpace = await this.xrSession.requestReferenceSpace(
+        this.settings.referenceSpaceType
+      );
+      this.setupSessionListeners();
+      this.isSessionActive = true;
+      this.onSessionStarted?.();
+      this.xrSession.requestAnimationFrame(this.onXRFrame.bind(this));
+      return true;
+    } catch (error) {
+      console.error("Failed to start XR session:", error);
+      return false;
+    }
+  }
+  async endSession() {
+    if (!this.xrSession) {
+      return;
+    }
+    try {
+      await this.xrSession.end();
+    } catch {
+    }
+    this.cleanup();
+  }
+  cleanup() {
+    this.xrSession = null;
+    this.xrReferenceSpace = null;
+    this.isSessionActive = false;
+    this.controllers.clear();
+    this.hands.clear();
+    this.detectedPlanes.clear();
+    this.activeGestures.clear();
+    this.onSessionEnded?.();
+  }
+  setupSessionListeners() {
+    if (!this.xrSession) {
+      return;
+    }
+    this.xrSession.addEventListener("end", () => this.cleanup());
+    this.xrSession.addEventListener("inputsourceschange", this.onInputSourcesChange.bind(this));
+    this.xrSession.addEventListener("select", this.onSelect.bind(this));
+    this.xrSession.addEventListener("selectstart", this.onSelectStart.bind(this));
+    this.xrSession.addEventListener("selectend", this.onSelectEnd.bind(this));
+    this.xrSession.addEventListener("squeeze", this.onSqueeze.bind(this));
+    this.xrSession.addEventListener("squeezestart", this.onSqueezeStart.bind(this));
+    this.xrSession.addEventListener("squeezeend", this.onSqueezeEnd.bind(this));
+  }
+  // ─── Frame Loop ────────────────────────────────────────
+  onXRFrame(time, frame) {
+    if (!this.xrSession || !this.xrReferenceSpace) {
+      return;
+    }
+    this.frameId++;
+    for (const inputSource of this.xrSession.inputSources) {
+      this.updateInputSource(inputSource, frame);
+    }
+    this.updateHandTracking(frame);
+    this.checkGestures();
+    this.updateTeleport(frame);
+    this.onFrame?.(time, frame);
+    this.xrSession.requestAnimationFrame(this.onXRFrame.bind(this));
+  }
+  updateInputSource(inputSource, frame) {
+    if (!this.xrReferenceSpace) {
+      return;
+    }
+    const index = Array.from(this.xrSession?.inputSources ?? []).indexOf(inputSource);
+    const state = {
+      handedness: inputSource.handedness,
+      targetRayMode: inputSource.targetRayMode,
+      buttons: [],
+      axes: [],
+      isTracking: false
+    };
+    const targetRayPose = frame.getPose(inputSource.targetRaySpace, this.xrReferenceSpace);
+    if (targetRayPose) {
+      state.pose = this.convertXRPose(targetRayPose);
+      state.isTracking = true;
+    }
+    if (inputSource.gripSpace) {
+      const gripPose = frame.getPose(inputSource.gripSpace, this.xrReferenceSpace);
+      if (gripPose) {
+        state.gripPose = this.convertXRPose(gripPose);
+      }
+    }
+    if (inputSource.gamepad) {
+      state.buttons = inputSource.gamepad.buttons.map((btn) => ({
+        pressed: btn.pressed,
+        touched: btn.touched,
+        value: btn.value
+      }));
+      state.axes = Array.from(inputSource.gamepad.axes);
+    }
+    this.controllers.set(index, state);
+  }
+  updateHandTracking(frame) {
+    if (!this.settings.handTrackingEnabled || !this.xrSession || !this.xrReferenceSpace) {
+      return;
+    }
+    for (const inputSource of this.xrSession.inputSources) {
+      const hand = inputSource.hand;
+      if (!hand) {
+        continue;
+      }
+      const side = inputSource.handedness;
+      if (side !== "left" && side !== "right") {
+        continue;
+      }
+      const handState = this.extractHandState(hand, frame, side);
+      if (handState) {
+        this.hands.set(side, handState);
+        this.onHandTrackingUpdate?.(handState);
+      }
+    }
+  }
+  extractHandState(hand, frame, side) {
+    if (!this.xrReferenceSpace) {
+      return null;
+    }
+    const joints = {
+      thumb: [],
+      index: [],
+      middle: [],
+      ring: [],
+      pinky: []
+    };
+    const jointNames = [
+      "wrist",
+      "thumb-metacarpal",
+      "thumb-phalanx-proximal",
+      "thumb-phalanx-distal",
+      "thumb-tip",
+      "index-finger-metacarpal",
+      "index-finger-phalanx-proximal",
+      "index-finger-phalanx-intermediate",
+      "index-finger-phalanx-distal",
+      "index-finger-tip",
+      "middle-finger-metacarpal",
+      "middle-finger-phalanx-proximal",
+      "middle-finger-phalanx-intermediate",
+      "middle-finger-phalanx-distal",
+      "middle-finger-tip",
+      "ring-finger-metacarpal",
+      "ring-finger-phalanx-proximal",
+      "ring-finger-phalanx-intermediate",
+      "ring-finger-phalanx-distal",
+      "ring-finger-tip",
+      "pinky-finger-metacarpal",
+      "pinky-finger-phalanx-proximal",
+      "pinky-finger-phalanx-intermediate",
+      "pinky-finger-phalanx-distal",
+      "pinky-finger-tip"
+    ];
+    let isTracking = false;
+    for (const jointName of jointNames) {
+      const jointSpace = hand.get(jointName);
+      if (!jointSpace) {
+        continue;
+      }
+      const jointPose = frame.getJointPose?.(jointSpace, this.xrReferenceSpace);
+      if (!jointPose) {
+        continue;
+      }
+      isTracking = true;
+      const pose = {
+        position: {
+          x: jointPose.transform.position.x,
+          y: jointPose.transform.position.y,
+          z: jointPose.transform.position.z
+        },
+        orientation: {
+          x: jointPose.transform.orientation.x,
+          y: jointPose.transform.orientation.y,
+          z: jointPose.transform.orientation.z,
+          w: jointPose.transform.orientation.w
+        },
+        radius: jointPose.radius ?? 0
+      };
+      if (jointName === "wrist") {
+        joints.wrist = pose;
+      } else if (jointName.startsWith("thumb")) {
+        joints.thumb.push(pose);
+      } else if (jointName.startsWith("index")) {
+        joints.index.push(pose);
+      } else if (jointName.startsWith("middle")) {
+        joints.middle.push(pose);
+      } else if (jointName.startsWith("ring")) {
+        joints.ring.push(pose);
+      } else if (jointName.startsWith("pinky")) {
+        joints.pinky.push(pose);
+      }
+    }
+    return {
+      side,
+      joints,
+      isTracking,
+      pinchStrength: this.calculatePinchStrength(joints),
+      gripStrength: this.calculateGripStrength(joints)
+    };
+  }
+  calculatePinchStrength(joints) {
+    if (joints.thumb.length < 4 || joints.index.length < 4) {
+      return 0;
+    }
+    const thumbTip = joints.thumb[3];
+    const indexTip = joints.index[4];
+    const distance = this.distance(thumbTip.position, indexTip.position);
+    const maxDistance = 0.1;
+    return Math.max(0, 1 - distance / maxDistance);
+  }
+  calculateGripStrength(joints) {
+    let curlSum = 0;
+    const fingers = [joints.index, joints.middle, joints.ring, joints.pinky];
+    for (const finger of fingers) {
+      if (finger.length >= 4) {
+        const tip = finger[finger.length - 1];
+        const base = finger[0];
+        if (joints.wrist) {
+          const fingerLength = this.distance(tip.position, base.position);
+          const toWrist = this.distance(tip.position, joints.wrist.position);
+          curlSum += Math.max(0, 1 - fingerLength / toWrist);
+        }
+      }
+    }
+    return curlSum / 4;
+  }
+  distance(a, b) {
+    return Math.sqrt(Math.pow(a.x - b.x, 2) + Math.pow(a.y - b.y, 2) + Math.pow(a.z - b.z, 2));
+  }
+  convertXRPose(pose) {
+    return {
+      position: {
+        x: pose.transform.position.x,
+        y: pose.transform.position.y,
+        z: pose.transform.position.z
+      },
+      orientation: {
+        x: pose.transform.orientation.x,
+        y: pose.transform.orientation.y,
+        z: pose.transform.orientation.z,
+        w: pose.transform.orientation.w
+      }
+    };
+  }
+  // ─── Input Events ──────────────────────────────────────
+  onInputSourcesChange(event) {
+    for (const inputSource of event.added) {
+      const index = Array.from(this.xrSession?.inputSources ?? []).indexOf(inputSource);
+      const state = {
+        handedness: inputSource.handedness,
+        targetRayMode: inputSource.targetRayMode,
+        buttons: [],
+        axes: [],
+        isTracking: false
+      };
+      this.controllers.set(index, state);
+      this.onControllerConnected?.(state, index);
+    }
+    for (const inputSource of event.removed) {
+      const index = Array.from(this.xrSession?.inputSources ?? []).indexOf(inputSource);
+      if (index >= 0) {
+        this.controllers.delete(index);
+        this.onControllerDisconnected?.(index);
+      }
+    }
+  }
+  onSelect(_event) {
+  }
+  onSelectStart(_event) {
+  }
+  onSelectEnd(_event) {
+    if (this.settings.teleportEnabled && this.teleportTarget?.valid) {
+      this.executeTeleport();
+    }
+  }
+  onSqueeze(_event) {
+  }
+  onSqueezeStart(_event) {
+  }
+  onSqueezeEnd(_event) {
+  }
+  // ─── Gesture Detection ─────────────────────────────────
+  registerGesture(gesture) {
+    this.registeredGestures.set(gesture.id, gesture);
+  }
+  unregisterGesture(gestureId) {
+    this.registeredGestures.delete(gestureId);
+    this.activeGestures.delete(gestureId);
+  }
+  checkGestures() {
+    for (const [side, hand] of this.hands) {
+      for (const [id, gesture] of this.registeredGestures) {
+        if (gesture.hand && gesture.hand !== side) {
+          continue;
+        }
+        const isActive = this.isGestureActive(gesture, hand);
+        const wasActive = this.activeGestures.has(`${id}_${side}`);
+        if (isActive && !wasActive) {
+          this.activeGestures.add(`${id}_${side}`);
+          this.onGestureDetected?.(id, side);
+        } else if (!isActive && wasActive) {
+          this.activeGestures.delete(`${id}_${side}`);
+          this.onGestureEnded?.(id, side);
+        }
+      }
+    }
+  }
+  isGestureActive(gesture, hand) {
+    if (gesture.customChecker) {
+      return gesture.customChecker(hand);
+    }
+    switch (gesture.type) {
+      case "pinch":
+        return hand.pinchStrength > 0.8;
+      case "grab":
+        return hand.gripStrength > 0.8;
+      case "open_hand":
+        return hand.gripStrength < 0.2 && hand.pinchStrength < 0.2;
+      case "fist":
+        return hand.gripStrength > 0.9;
+      case "point":
+        return hand.gripStrength > 0.6 && hand.pinchStrength < 0.3;
+      default:
+        return false;
+    }
+  }
+  // ─── Teleportation ─────────────────────────────────────
+  updateTeleport(_frame) {
+    if (!this.settings.teleportEnabled) {
+      return;
+    }
+    const controller = this.getControllerByHandedness("right") ?? this.getControllerByHandedness("left");
+    if (!controller?.pose) {
+      this.teleportTarget = null;
+      return;
+    }
+  }
+  setTeleportTarget(target) {
+    this.teleportTarget = target;
+  }
+  executeTeleport() {
+    if (!this.teleportTarget?.valid) {
+      return;
+    }
+    this.isTeleporting = true;
+    this.onTeleport?.(this.teleportTarget);
+    this.teleportTarget = null;
+    this.isTeleporting = false;
+  }
+  teleportTo(position) {
+    const target = {
+      position,
+      normal: { x: 0, y: 1, z: 0 },
+      valid: true
+    };
+    this.onTeleport?.(target);
+  }
+  // ─── Locomotion ────────────────────────────────────────
+  snapTurn(direction) {
+    this.settings.snapTurnAngle * (direction === "left" ? -1 : 1);
+  }
+  // ─── Haptics ───────────────────────────────────────────
+  triggerHaptics(handedness, feedback) {
+    if (!this.xrSession) {
+      return;
+    }
+    for (const inputSource of this.xrSession.inputSources) {
+      if (inputSource.handedness !== handedness) {
+        continue;
+      }
+      const actuator = inputSource.gamepad?.hapticActuators?.[0];
+      if (actuator && "pulse" in actuator) {
+        actuator.pulse(feedback.intensity, feedback.duration);
+      }
+    }
+  }
+  // ─── Spatial Anchors ───────────────────────────────────
+  async createAnchor(pose, name, persistent = false, metadata) {
+    const anchor = {
+      id: `anchor_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
+      name,
+      pose,
+      createdAt: Date.now(),
+      persistent,
+      metadata
+    };
+    this.anchors.set(anchor.id, anchor);
+    this.onAnchorAdded?.(anchor);
+    return anchor;
+  }
+  getAnchor(id) {
+    return this.anchors.get(id);
+  }
+  getAnchors() {
+    return Array.from(this.anchors.values());
+  }
+  removeAnchor(id) {
+    const deleted = this.anchors.delete(id);
+    if (deleted) {
+      this.onAnchorRemoved?.(id);
+    }
+    return deleted;
+  }
+  // ─── Plane Detection (AR) ──────────────────────────────
+  getDetectedPlanes() {
+    return Array.from(this.detectedPlanes.values());
+  }
+  getPlanesByClassification(classification) {
+    return Array.from(this.detectedPlanes.values()).filter(
+      (p) => p.classification === classification
+    );
+  }
+  // ─── Image Tracking (AR) ────────────────────────────────
+  addImageTarget(target) {
+    this.imageTargets.set(target.id, {
+      ...target,
+      tracked: false
+    });
+  }
+  removeImageTarget(id) {
+    this.imageTargets.delete(id);
+  }
+  getTrackedImages() {
+    return Array.from(this.imageTargets.values()).filter((t) => t.tracked);
+  }
+  // ─── State Getters ─────────────────────────────────────
+  getSession() {
+    return this.xrSession;
+  }
+  getReferenceSpace() {
+    return this.xrReferenceSpace;
+  }
+  isActive() {
+    return this.isSessionActive;
+  }
+  getControllers() {
+    return Array.from(this.controllers.values());
+  }
+  getController(index) {
+    return this.controllers.get(index);
+  }
+  getControllerByHandedness(handedness) {
+    return Array.from(this.controllers.values()).find((c) => c.handedness === handedness);
+  }
+  getHand(side) {
+    return this.hands.get(side);
+  }
+  getHands() {
+    return Array.from(this.hands.values());
+  }
+  getRoomBoundary() {
+    return this.roomBoundary;
+  }
+  // ─── Settings ──────────────────────────────────────────
+  getSettings() {
+    return { ...this.settings };
+  }
+  setSettings(settings) {
+    this.settings = { ...this.settings, ...settings };
+  }
+  // ─── Callbacks ─────────────────────────────────────────
+  setOnSessionStarted(callback) {
+    this.onSessionStarted = callback;
+  }
+  setOnSessionEnded(callback) {
+    this.onSessionEnded = callback;
+  }
+  setOnFrame(callback) {
+    this.onFrame = callback;
+  }
+  setOnControllerConnected(callback) {
+    this.onControllerConnected = callback;
+  }
+  setOnControllerDisconnected(callback) {
+    this.onControllerDisconnected = callback;
+  }
+  setOnHandTrackingUpdate(callback) {
+    this.onHandTrackingUpdate = callback;
+  }
+  setOnGestureDetected(callback) {
+    this.onGestureDetected = callback;
+  }
+  setOnGestureEnded(callback) {
+    this.onGestureEnded = callback;
+  }
+  setOnTeleport(callback) {
+    this.onTeleport = callback;
+  }
+  setOnPlaneDetected(callback) {
+    this.onPlaneDetected = callback;
+  }
+  setOnImageTracked(callback) {
+    this.onImageTracked = callback;
+  }
+  setOnAnchorAdded(callback) {
+    this.onAnchorAdded = callback;
+  }
+  setOnAnchorRemoved(callback) {
+    this.onAnchorRemoved = callback;
+  }
 }
-// ============================================================
-// Factory Functions
-// ============================================================
 function createVRARMode() {
-    return new VRARMode();
+  return new VRARMode();
 }
 function createDefaultGestures() {
-    return [
-        { id: 'pinch_left', name: 'Left Pinch', type: 'pinch', hand: 'left' },
-        { id: 'pinch_right', name: 'Right Pinch', type: 'pinch', hand: 'right' },
-        { id: 'grab_left', name: 'Left Grab', type: 'grab', hand: 'left' },
-        { id: 'grab_right', name: 'Right Grab', type: 'grab', hand: 'right' },
-        { id: 'point_left', name: 'Left Point', type: 'point', hand: 'left' },
-        { id: 'point_right', name: 'Right Point', type: 'point', hand: 'right' },
-        { id: 'fist_left', name: 'Left Fist', type: 'fist', hand: 'left' },
-        { id: 'fist_right', name: 'Right Fist', type: 'fist', hand: 'right' },
-    ];
+  return [
+    { id: "pinch_left", name: "Left Pinch", type: "pinch", hand: "left" },
+    { id: "pinch_right", name: "Right Pinch", type: "pinch", hand: "right" },
+    { id: "grab_left", name: "Left Grab", type: "grab", hand: "left" },
+    { id: "grab_right", name: "Right Grab", type: "grab", hand: "right" },
+    { id: "point_left", name: "Left Point", type: "point", hand: "left" },
+    { id: "point_right", name: "Right Point", type: "point", hand: "right" },
+    { id: "fist_left", name: "Left Fist", type: "fist", hand: "left" },
+    { id: "fist_right", name: "Right Fist", type: "fist", hand: "right" }
+  ];
 }
-
 exports.DEFAULT_XR_SETTINGS = DEFAULT_XR_SETTINGS;
 exports.VRARMode = VRARMode;
 exports.createDefaultGestures = createDefaultGestures;