@threlte/xr 1.5.5 → 1.6.1

package/dist/internal/inputSources.svelte.js

@@ -0,0 +1,91 @@
+class InputSourcesState {
+    current = $state.raw([]);
+}
+export const inputSources = new InputSourcesState();
+const subscribers = new Set();
+/**
+ * Registers callbacks with the module-level XR input-source dispatcher.
+ *
+ * This does not subscribe to a specific `XRInputSource`, `XRSession`, or
+ * Three.js object. Instead, the subscriber is stored in the internal
+ * `subscribers` set and receives events for whichever current input-source
+ * state matches its `type` and `handedness`.
+ *
+ * For example, a `{ type: 'controller', handedness: 'left' }` subscriber will
+ * receive forwarded events for the current left controller, even if the
+ * underlying `XRInputSource` instance disconnects and reconnects.
+ *
+ * Returns a cleanup function that removes the subscriber from the dispatcher.
+ */
+export const addSubscriber = (sub) => {
+    subscribers.add(sub);
+    return () => {
+        subscribers.delete(sub);
+    };
+};
+export const dispatchEvent = (state, eventType, event) => {
+    const key = `on${eventType}`;
+    for (const sub of subscribers) {
+        if (sub.type !== state.type)
+            continue;
+        if (sub.handedness !== state.handedness)
+            continue;
+        const cb = sub.callbacks[key];
+        cb?.(event);
+    }
+};
+const dispatchSpaceEvent = (state, event) => {
+    state.targetRay.dispatchEvent(event);
+    if (state.type === 'controller') {
+        state.grip.dispatchEvent(event);
+    }
+    if (state.type === 'hand') {
+        state.hand.dispatchEvent(event);
+    }
+};
+export const createInputSourceEvent = (state, type, extra = {}) => {
+    return {
+        type,
+        data: state.inputSource,
+        inputSource: state.inputSource,
+        target: state.type === 'hand' ? state.hand : state.targetRay,
+        ...extra
+    };
+};
+export const dispatchInputSourceStateEvent = (state, eventType, event, options = {}) => {
+    if (options.dispatchSpaces !== false) {
+        dispatchSpaceEvent(state, event);
+    }
+    dispatchEvent(state, eventType, event);
+};
+const getPreferredState = (predicate, options) => {
+    if (options?.isPrimary !== undefined) {
+        return inputSources.current.find((state) => state.isPrimary === options.isPrimary && predicate(state));
+    }
+    return (inputSources.current.find((state) => state.isPrimary && predicate(state)) ??
+        inputSources.current.find(predicate));
+};
+export const getInputSourceState = (inputSource, options) => {
+    if (options?.isPrimary !== undefined) {
+        return inputSources.current.find((state) => state.inputSource === inputSource && state.isPrimary === options.isPrimary);
+    }
+    return inputSources.current.find((state) => state.inputSource === inputSource);
+};
+export const getControllerState = (handedness, options) => {
+    return getPreferredState((state) => state.type === 'controller' && state.handedness === handedness, options);
+};
+export const getHandState = (handedness, options) => {
+    return getPreferredState((state) => state.type === 'hand' && state.handedness === handedness, options);
+};
+export const dispatchInputSourceEvent = (inputSource, eventType, event) => {
+    const state = getInputSourceState(inputSource);
+    if (state === undefined)
+        return;
+    dispatchInputSourceStateEvent(state, eventType, event);
+};
+export const dispatchXRInputSourceEvent = (event) => {
+    const state = getInputSourceState(event.inputSource);
+    if (state === undefined)
+        return;
+    dispatchInputSourceStateEvent(state, event.type, createInputSourceEvent(state, event.type, { frame: event.frame }));
+};

package/dist/internal/setupHeadset.svelte.js

@@ -1,10 +1,14 @@
-import { Group } from 'three';
+import { Group, Matrix4, Vector3 } from 'three';
 import { useThrelte, useTask, useStage } from '@threlte/core';
 import { isPresenting } from './state.svelte.js';
+import { useXROrigin } from '../hooks/useXROrigin.svelte.js';
 export const headset = new Group();
+const poseMatrix = new Matrix4();
+const tempScale = new Vector3();
 export const setupHeadset = () => {
     const { renderer, camera, renderStage } = useThrelte();
     const stage = useStage(Symbol('xr-headset-stage'), { before: renderStage });
+    const xrOrigin = useXROrigin();
     const { xr } = renderer;
     useTask(() => {
         const space = xr.getReferenceSpace();
@@ -15,17 +19,25 @@ export const setupHeadset = () => {
         // It can be null on android chrome when using phone AR.
         if (pose === undefined || pose === null)
             return;
-        const { position, orientation } = pose.transform;
-        headset.position.copy(position);
-        headset.quaternion.copy(orientation);
+        const origin = xrOrigin.current;
+        if (origin === undefined) {
+            const { position, orientation } = pose.transform;
+            headset.position.copy(position);
+            headset.quaternion.copy(orientation);
+        }
+        else {
+            origin.updateWorldMatrix(true, false);
+            poseMatrix.fromArray(pose.transform.matrix).premultiply(origin.matrixWorld);
+            poseMatrix.decompose(headset.position, headset.quaternion, tempScale);
+        }
     }, {
         autoInvalidate: false,
         stage,
         running: () => isPresenting.current
     });
     useTask(() => {
-        headset.position.copy(camera.current.position);
-        headset.quaternion.copy(camera.current.quaternion);
+        camera.current.getWorldPosition(headset.position);
+        camera.current.getWorldQuaternion(headset.quaternion);
     }, {
         autoInvalidate: false,
         stage,

package/dist/internal/setupInputSources.d.ts

@@ -0,0 +1,4 @@
+import { XRControllerModelFactory } from 'three/examples/jsm/webxr/XRControllerModelFactory.js';
+import { XRHandModelFactory } from 'three/examples/jsm/webxr/XRHandModelFactory.js';
+export type BindInputSourcesToSession = (session: XRSession | undefined) => void;
+export declare const setupInputSources: (controllerFactory?: XRControllerModelFactory, handFactory?: XRHandModelFactory) => BindInputSourcesToSession;

package/dist/internal/setupInputSources.js

@@ -0,0 +1,319 @@
+import { Group, Vector3 } from 'three';
+import { XRControllerModelFactory } from 'three/examples/jsm/webxr/XRControllerModelFactory.js';
+import { XRHandModelFactory } from 'three/examples/jsm/webxr/XRHandModelFactory.js';
+import { useTask, useThrelte } from '@threlte/core';
+import { createInputSourceEvent, dispatchInputSourceStateEvent, inputSources } from './inputSources.svelte.js';
+const PINCH_DISTANCE = 0.02;
+const PINCH_THRESHOLD = 0.005;
+const makeId = (inputSource) => `${inputSource.handedness}-${inputSource.hand ? 'hand' : 'nohand'}-${inputSource.targetRayMode}-${inputSource.profiles.join(',')}`;
+const createSpaceWithVelocity = () => {
+    const group = new Group();
+    group.matrixAutoUpdate = false;
+    group.visible = false;
+    group.hasLinearVelocity = false;
+    group.linearVelocity = new Vector3();
+    group.hasAngularVelocity = false;
+    group.angularVelocity = new Vector3();
+    return group;
+};
+const createTargetRaySpace = () => createSpaceWithVelocity();
+const createGripSpace = () => createSpaceWithVelocity();
+const createHandSpace = () => {
+    const hand = new Group();
+    hand.matrixAutoUpdate = false;
+    hand.visible = false;
+    hand.joints = {};
+    hand.inputState = { pinching: false };
+    return hand;
+};
+const hideState = (state) => {
+    state.targetRay.visible = false;
+    if (state.type === 'controller') {
+        state.grip.visible = false;
+    }
+    if (state.type === 'hand') {
+        state.hand.visible = false;
+        for (const joint of Object.values(state.hand.joints ?? {})) {
+            joint.visible = false;
+        }
+        state.hand.inputState.pinching = false;
+    }
+};
+const ensureHandJoint = (hand, inputJoint) => {
+    const existing = hand.joints[inputJoint.jointName];
+    if (existing !== undefined) {
+        return existing;
+    }
+    const joint = new Group();
+    joint.matrixAutoUpdate = false;
+    joint.visible = false;
+    hand.joints[inputJoint.jointName] = joint;
+    hand.add(joint);
+    return joint;
+};
+const ensureHandJoints = (state) => {
+    const hand = state.hand;
+    for (const inputJoint of state.inputSource.hand.values()) {
+        ensureHandJoint(hand, inputJoint);
+    }
+};
+const updateSpacePose = (space, pose) => {
+    if (pose === undefined || pose === null) {
+        space.visible = false;
+        space.hasLinearVelocity = false;
+        space.hasAngularVelocity = false;
+        return;
+    }
+    space.matrix.fromArray(pose.transform.matrix);
+    space.matrix.decompose(space.position, space.quaternion, space.scale);
+    space.matrixWorldNeedsUpdate = true;
+    space.visible = true;
+    if ('linearVelocity' in pose &&
+        pose.linearVelocity !== null &&
+        pose.linearVelocity !== undefined) {
+        ;
+        space.hasLinearVelocity = true;
+        space.linearVelocity.copy(pose.linearVelocity);
+    }
+    else {
+        ;
+        space.hasLinearVelocity = false;
+    }
+    if ('angularVelocity' in pose &&
+        pose.angularVelocity !== null &&
+        pose.angularVelocity !== undefined) {
+        ;
+        space.hasAngularVelocity = true;
+        space.angularVelocity.copy(pose.angularVelocity);
+    }
+    else {
+        ;
+        space.hasAngularVelocity = false;
+    }
+};
+const updatePinchState = (state) => {
+    const hand = state.hand;
+    const inputState = hand.inputState;
+    const indexTip = hand.joints['index-finger-tip'];
+    const thumbTip = hand.joints['thumb-tip'];
+    if (indexTip === undefined || thumbTip === undefined || !indexTip.visible || !thumbTip.visible) {
+        if (inputState.pinching) {
+            inputState.pinching = false;
+            const event = createInputSourceEvent(state, 'pinchend', {
+                handedness: state.handedness,
+                target: hand
+            });
+            dispatchInputSourceStateEvent(state, 'pinchend', event);
+        }
+        return;
+    }
+    const distance = indexTip.position.distanceTo(thumbTip.position);
+    if (inputState.pinching && distance > PINCH_DISTANCE + PINCH_THRESHOLD) {
+        inputState.pinching = false;
+        const event = createInputSourceEvent(state, 'pinchend', {
+            handedness: state.handedness,
+            target: hand
+        });
+        dispatchInputSourceStateEvent(state, 'pinchend', event);
+    }
+    else if (!inputState.pinching && distance <= PINCH_DISTANCE - PINCH_THRESHOLD) {
+        inputState.pinching = true;
+        const event = createInputSourceEvent(state, 'pinchstart', {
+            handedness: state.handedness,
+            target: hand
+        });
+        dispatchInputSourceStateEvent(state, 'pinchstart', event);
+    }
+};
+const updateXRControllerState = (state, frame, referenceSpace) => {
+    let gripPose;
+    if (state.inputSource.gripSpace !== undefined) {
+        gripPose = frame.getPose(state.inputSource.gripSpace, referenceSpace);
+        updateSpacePose(state.grip, gripPose);
+    }
+    let targetRayPose = frame.getPose(state.inputSource.targetRaySpace, referenceSpace);
+    if (targetRayPose === null && gripPose !== undefined && gripPose !== null) {
+        targetRayPose = gripPose;
+    }
+    updateSpacePose(state.targetRay, targetRayPose);
+    if (state.inputSource.gripSpace === undefined || gripPose === undefined || gripPose === null) {
+        updateSpacePose(state.grip, targetRayPose);
+    }
+};
+const updateXRHandState = (state, frame, referenceSpace) => {
+    updateSpacePose(state.targetRay, frame.getPose(state.inputSource.targetRaySpace, referenceSpace));
+    const hand = state.hand;
+    ensureHandJoints(state);
+    let visible = false;
+    for (const inputJoint of state.inputSource.hand.values()) {
+        const pose = frame.getJointPose?.(inputJoint, referenceSpace);
+        const joint = ensureHandJoint(hand, inputJoint);
+        if (pose !== undefined && pose !== null) {
+            joint.matrix.fromArray(pose.transform.matrix);
+            joint.matrix.decompose(joint.position, joint.quaternion, joint.scale);
+            joint.matrixWorldNeedsUpdate = true;
+            joint.jointRadius = pose.radius;
+            visible = true;
+        }
+        joint.visible = pose !== undefined && pose !== null;
+    }
+    hand.visible = visible;
+    updatePinchState(state);
+};
+const updateXRInputSourceState = (state, frame, referenceSpace) => {
+    if (frame.session.visibilityState === 'visible-blurred' ||
+        frame.session.visibilityState === 'hidden') {
+        hideState(state);
+        return;
+    }
+    switch (state.type) {
+        case 'controller':
+            updateXRControllerState(state, frame, referenceSpace);
+            break;
+        case 'hand':
+            updateXRHandState(state, frame, referenceSpace);
+            break;
+        default:
+            updateSpacePose(state.targetRay, frame.getPose(state.inputSource.targetRaySpace, referenceSpace));
+            break;
+    }
+};
+let idCounter = 0;
+const createXRInputSourceState = (id, inputSource, isPrimary, controllerModelFactory, handModelFactory) => {
+    const base = {
+        id,
+        inputSource,
+        handedness: inputSource.handedness,
+        isPrimary,
+        targetRay: createTargetRaySpace()
+    };
+    if (inputSource.hand != null) {
+        if (inputSource.handedness === 'none')
+            return undefined;
+        const hand = createHandSpace();
+        const state = {
+            ...base,
+            type: 'hand',
+            inputSource: inputSource,
+            hand,
+            model: handModelFactory.createHandModel(hand, 'mesh')
+        };
+        ensureHandJoints(state);
+        return state;
+    }
+    switch (inputSource.targetRayMode) {
+        case 'gaze':
+            return { ...base, type: 'gaze' };
+        case 'screen':
+            return { ...base, type: 'screenInput' };
+        case 'transient-pointer':
+            return { ...base, type: 'transientPointer' };
+        case 'tracked-pointer':
+        default: {
+            const grip = createGripSpace();
+            return {
+                ...base,
+                type: 'controller',
+                grip,
+                model: controllerModelFactory.createControllerModel(grip)
+            };
+        }
+    }
+};
+const createSyncXRInputSourceStates = (controllerModelFactory, handModelFactory) => {
+    const idMap = new Map();
+    return (_session, current, changes) => {
+        if (changes === 'remove-all') {
+            for (const state of current) {
+                const event = createInputSourceEvent(state, 'disconnected');
+                dispatchInputSourceStateEvent(state, 'disconnected', event);
+                hideState(state);
+            }
+            return [];
+        }
+        const target = [...current];
+        for (const { added, isPrimary, removed } of changes) {
+            if (removed != null) {
+                for (const inputSource of removed) {
+                    const index = target.findIndex((state) => state.isPrimary === isPrimary && state.inputSource === inputSource);
+                    if (index === -1)
+                        continue;
+                    const [state] = target.splice(index, 1);
+                    const event = createInputSourceEvent(state, 'disconnected');
+                    dispatchInputSourceStateEvent(state, 'disconnected', event);
+                    hideState(state);
+                }
+            }
+            if (added == null)
+                continue;
+            for (const inputSource of added) {
+                if (target.some((state) => state.isPrimary === isPrimary && state.inputSource === inputSource)) {
+                    continue;
+                }
+                const key = makeId(inputSource);
+                let id = idMap.get(key);
+                if (id == null) {
+                    id = `${idCounter++}`;
+                    idMap.set(key, id);
+                }
+                const state = createXRInputSourceState(id, inputSource, isPrimary, controllerModelFactory, handModelFactory);
+                if (state === undefined) {
+                    continue;
+                }
+                target.push(state);
+                const event = createInputSourceEvent(state, 'connected');
+                dispatchInputSourceStateEvent(state, 'connected', event);
+            }
+        }
+        return target;
+    };
+};
+const createBindToSession = (syncXRInputSourceStates) => {
+    let cleanupSession;
+    return (session) => {
+        cleanupSession?.();
+        cleanupSession = undefined;
+        if (session == null) {
+            inputSources.current = [];
+            return;
+        }
+        const inputSourceChangesList = [];
+        const applySourcesChange = () => {
+            inputSources.current = syncXRInputSourceStates(session, inputSources.current, inputSourceChangesList);
+            inputSourceChangesList.length = 0;
+        };
+        const onInputSourcesChange = (event) => {
+            inputSourceChangesList.push({
+                isPrimary: true,
+                added: event.added,
+                removed: event.removed
+            });
+            applySourcesChange();
+        };
+        session.addEventListener('inputsourceschange', onInputSourcesChange);
+        inputSources.current = syncXRInputSourceStates(session, [], [{ isPrimary: true, added: session.inputSources }]);
+        cleanupSession = () => {
+            inputSources.current = syncXRInputSourceStates(session, inputSources.current, 'remove-all');
+            session.removeEventListener('inputsourceschange', onInputSourcesChange);
+        };
+    };
+};
+export const setupInputSources = (controllerFactory, handFactory) => {
+    const { xr } = useThrelte().renderer;
+    const controllerModelFactory = controllerFactory ?? new XRControllerModelFactory();
+    const handModelFactory = handFactory ?? new XRHandModelFactory();
+    const syncXRInputSourceStates = createSyncXRInputSourceStates(controllerModelFactory, handModelFactory);
+    const bindToSession = createBindToSession(syncXRInputSourceStates);
+    useTask(() => {
+        const frame = xr.getFrame();
+        const referenceSpace = xr.getReferenceSpace();
+        if (frame === null || referenceSpace === null)
+            return;
+        for (const state of inputSources.current) {
+            updateXRInputSourceState(state, frame, referenceSpace);
+        }
+    }, {
+        running: () => inputSources.current.length > 0
+    });
+    return bindToSession;
+};

package/dist/internal/state.svelte.d.ts

@@ -1,18 +1,9 @@
 import type { WebXRManager, Intersection } from 'three';
-import type { XRControllerEvents, XRHandEvents } from '../types.js';
-interface ControllerEvents {
-    left?: XRControllerEvents;
-    right?: XRControllerEvents;
-}
-interface HandEvents {
-    left?: XRHandEvents;
-    right?: XRHandEvents;
-}
 declare class Presenting {
     current: boolean;
 }
 declare class IsHandTracking {
-    current: boolean;
+    get current(): boolean;
 }
 declare class Session {
     current: XRSession | undefined;
@@ -23,6 +14,14 @@ declare class ReferenceSpaceType {
 declare class XR {
     current: WebXRManager | undefined;
 }
+declare class LastSessionRequest {
+    mode: XRSessionMode | undefined;
+    sessionInit: (XRSessionInit & {
+        domOverlay?: {
+            root: Element;
+        };
+    }) | undefined;
+}
 declare class PointerState {
     enabled: boolean;
     hovering: boolean;
@@ -36,8 +35,7 @@ export declare const isHandTracking: IsHandTracking;
 export declare const session: Session;
 export declare const referenceSpaceType: ReferenceSpaceType;
 export declare const xr: XR;
-export declare const controllerEvents: ControllerEvents;
-export declare const handEvents: HandEvents;
+export declare const lastSessionRequest: LastSessionRequest;
 export declare const teleportState: {
     left: PointerState;
     right: PointerState;

package/dist/internal/state.svelte.js

@@ -1,8 +1,11 @@
+import { inputSources } from './inputSources.svelte.js';
 class Presenting {
     current = $state(false);
 }
 class IsHandTracking {
-    current = $state(false);
+    get current() {
+        return inputSources.current.some((s) => s.type === 'hand');
+    }
 }
 class Session {
     current = $state.raw();
@@ -13,6 +16,10 @@ class ReferenceSpaceType {
 class XR {
     current = $state.raw();
 }
+class LastSessionRequest {
+    mode = $state.raw();
+    sessionInit = $state.raw();
+}
 class PointerState {
     enabled = $state(false);
     hovering = $state(false);
@@ -26,8 +33,7 @@ export const isHandTracking = new IsHandTracking();
 export const session = new Session();
 export const referenceSpaceType = new ReferenceSpaceType();
 export const xr = new XR();
-export const controllerEvents = {};
-export const handEvents = {};
+export const lastSessionRequest = new LastSessionRequest();
 export const teleportState = {
     left: new PointerState(),
     right: new PointerState()

package/dist/lib/getXRSessionOptions.d.ts

@@ -1 +1 @@
-export declare const getXRSessionOptions: (referenceSpaceType?: XRReferenceSpaceType, sessionInit?: XRSessionInit) => XRSessionInit | undefined;
+export declare const getXRSessionOptions: (referenceSpaceType?: XRReferenceSpaceType, sessionInit?: XRSessionInit, fallbackSessionInit?: XRSessionInit) => XRSessionInit | undefined;

package/dist/lib/getXRSessionOptions.js

@@ -1,15 +1,16 @@
-export const getXRSessionOptions = (referenceSpaceType, sessionInit) => {
-    if (referenceSpaceType === undefined && sessionInit === undefined) {
+export const getXRSessionOptions = (referenceSpaceType, sessionInit, fallbackSessionInit) => {
+    const init = sessionInit ?? fallbackSessionInit;
+    if (referenceSpaceType === undefined && init === undefined) {
         return undefined;
     }
-    if (referenceSpaceType && sessionInit === undefined) {
+    if (referenceSpaceType && init === undefined) {
         return { optionalFeatures: [referenceSpaceType] };
     }
-    if (referenceSpaceType && sessionInit) {
+    if (referenceSpaceType && init) {
         return {
-            ...sessionInit,
-            optionalFeatures: [...new Set([...(sessionInit.optionalFeatures ?? []), referenceSpaceType])]
+            ...init,
+            optionalFeatures: [...new Set([...(init.optionalFeatures ?? []), referenceSpaceType])]
         };
     }
-    return sessionInit;
+    return init;
 };

package/dist/lib/toggleXRSession.d.ts

@@ -8,6 +8,6 @@
  */
 export declare const toggleXRSession: (sessionMode: XRSessionMode, sessionInit?: XRSessionInit & {
     domOverlay?: {
-        root: HTMLElement;
+        root: Element;
     };
 }, force?: "enter" | "exit") => Promise<XRSession | undefined>;

package/dist/lib/toggleXRSession.js

@@ -1,5 +1,6 @@
-import { session, referenceSpaceType, xr } from '../internal/state.svelte.js';
+import { lastSessionRequest, referenceSpaceType, session, xr } from '../internal/state.svelte.js';
 import { getXRSessionOptions } from './getXRSessionOptions.js';
+let pending;
 /**
  * Starts / ends an XR session.
  *
@@ -8,7 +9,15 @@ import { getXRSessionOptions } from './getXRSessionOptions.js';
  * @param force Whether this button should only enter / exit an `XRSession`. Default is to toggle both ways
  * @returns
  */
-export const toggleXRSession = async (sessionMode, sessionInit, force) => {
+export const toggleXRSession = (sessionMode, sessionInit, force) => {
+    if (pending !== undefined)
+        return pending;
+    pending = run(sessionMode, sessionInit, force).finally(() => {
+        pending = undefined;
+    });
+    return pending;
+};
+const run = async (sessionMode, sessionInit, force) => {
     const currentSession = session.current;
     const hasSession = currentSession !== undefined;
     if (force === 'enter' && hasSession)
@@ -21,13 +30,19 @@ export const toggleXRSession = async (sessionMode, sessionInit, force) => {
         await currentSession.end();
         return;
     }
-    if (xr.current === undefined) {
+    const manager = xr.current;
+    if (manager === undefined) {
         throw new Error('An <XR> component was not created when attempting to toggle a session.');
     }
     // Otherwise enter a session
     const options = getXRSessionOptions(referenceSpaceType.current, sessionInit);
-    const nextSession = await navigator.xr.requestSession(sessionMode, options);
-    await xr.current.setSession(nextSession);
+    const nextSession = await navigator.xr?.requestSession(sessionMode, options);
+    if (nextSession === undefined) {
+        throw new Error('A session was not able to be created.');
+    }
+    await manager.setSession(nextSession);
+    lastSessionRequest.mode = sessionMode;
+    lastSessionRequest.sessionInit = sessionInit;
     session.current = nextSession;
     return nextSession;
 };

package/dist/plugins/pointerControls/compute.js

@@ -1,14 +1,19 @@
 import { Vector3 } from 'three';
-import { controllers } from '../../hooks/useController.svelte.js';
+import { getControllerState, getHandState } from '../../internal/inputSources.svelte.js';
+const origin = new Vector3();
 const forward = new Vector3();
-export const defaultComputeFunction = (context, handContext) => {
-    const targetRay = controllers[handContext.hand]?.targetRay;
+export const defaultComputeFunction = (_context, handContext) => {
+    const state = handContext.sourceType === 'controller'
+        ? getControllerState(handContext.hand)
+        : getHandState(handContext.hand);
+    const targetRay = state?.targetRay;
     if (targetRay === undefined)
         return;
-    // `<Controller>` attaches targetRay to the scene root so local === world;
-    // we can read `.position`/`.quaternion` directly without a matrixWorld
-    // roundtrip (which would force-recompose the matrix three.js writes from
-    // the XR pose and introduce a drift against the visible render).
-    forward.set(0, 0, -1).applyQuaternion(targetRay.quaternion);
-    context.raycaster.set(targetRay.position, forward);
+    // Read origin/direction from matrixWorld so the ray is in real world space,
+    // even when an ancestor (e.g. <XROrigin>) has a non-identity transform.
+    // Force an update because this runs before the frame's scene.updateMatrixWorld.
+    targetRay.updateWorldMatrix(true, false);
+    origin.setFromMatrixPosition(targetRay.matrixWorld);
+    forward.set(0, 0, -1).transformDirection(targetRay.matrixWorld);
+    handContext.raycaster.set(origin, forward);
 };

package/dist/plugins/pointerControls/context.d.ts

@@ -1,7 +1,7 @@
 import type { Object3D } from 'three';
-import type { ControlsContext, HandContext } from './types.js';
-export declare const getHandContext: (hand: "left" | "right") => HandContext;
-export declare const setHandContext: (hand: "left" | "right", context: HandContext) => void;
+import type { ControlsContext, HandContext, PointerSourceType } from './types.js';
+export declare const getHandContext: (hand: "left" | "right", sourceType: PointerSourceType) => HandContext;
+export declare const setHandContext: (hand: "left" | "right", sourceType: PointerSourceType, context: HandContext) => void;
 export declare const getControlsContext: () => ControlsContext;
 export declare const setControlsContext: (context: ControlsContext) => void;
 interface InternalContext {