@threlte/xr 0.0.8 → 0.0.9

package/dist/hooks/useHitTest.d.ts

@@ -1,5 +1,23 @@
-import type { HitTestCallback } from '../types';
+/// <reference types="webxr" />
+import * as THREE from 'three';
+export type HitTestCallback = (hitMatrix: THREE.Matrix4, hit: XRHitTestResult | undefined) => void;
+export type UseHitTestOptions = {
+    /**
+     * The ray source when performing hit testing.
+     *
+     * @default 'viewer'
+     */
+    source?: 'viewer' | 'leftInput' | 'rightInput';
+};
 /**
- * Use this hook to perform a hit test for an AR environment.
+ * Use this hook to perform a hit test per frame in an AR environment.
+ *
+ * ```ts
+ * useHitTest((hitMatrix, hit) => {
+ *   mesh.matrix.copy(hitMatrix)
+ * }, {
+ *   source: 'viewer' | 'leftInput' | 'rightInput' // Default 'viewer'
+ * })
+ * ```
  */
-export declare const useHitTest: (hitTestCallback: HitTestCallback) => void;
+export declare const useHitTest: (hitTestCallback: HitTestCallback, options?: UseHitTestOptions) => void;

package/dist/hooks/useHitTest.js

@@ -1,44 +1,69 @@
 import * as THREE from 'three';
-import { onDestroy } from 'svelte';
-import { session } from '../internal/stores';
-import { useThrelte, useFrame } from '@threlte/core';
+import { useThrelte, useFrame, watch, currentWritable } from '@threlte/core';
+import { useXR } from './useXR';
+import { useController } from './useController';
 /**
- * Use this hook to perform a hit test for an AR environment.
+ * Use this hook to perform a hit test per frame in an AR environment.
+ *
+ * ```ts
+ * useHitTest((hitMatrix, hit) => {
+ *   mesh.matrix.copy(hitMatrix)
+ * }, {
+ *   source: 'viewer' | 'leftInput' | 'rightInput' // Default 'viewer'
+ * })
+ * ```
  */
-export const useHitTest = (hitTestCallback) => {
+export const useHitTest = (hitTestCallback, options = {}) => {
+    const source = options.source ?? 'viewer';
     const { xr } = useThrelte().renderer;
+    const xrState = useXR();
     const hitMatrix = new THREE.Matrix4();
-    let started = false;
-    let hitTestSource;
-    onDestroy(session.subscribe(async (value) => {
-        if (value === undefined) {
-            hitTestSource = undefined;
-            if (started) {
-                stop();
-                started = false;
-            }
-            return;
-        }
-        const space = await value.requestReferenceSpace('viewer');
-        hitTestSource = await value.requestHitTestSource?.({ space });
-        if (!started) {
-            start();
-            started = true;
-        }
-    }));
+    let hitTestSource = currentWritable(undefined);
+    if (source === 'viewer') {
+        watch(xrState.session, async (session) => {
+            if (session === undefined)
+                return;
+            const space = await session.requestReferenceSpace('viewer');
+            hitTestSource.set(await session.requestHitTestSource?.({ space }));
+        });
+    }
+    else {
+        const controller = useController(source === 'leftInput' ? 'left' : 'right');
+        const hand = useController(source === 'leftInput' ? 'left' : 'right');
+        watch([xrState.session, controller], async ([session, input]) => {
+            if (input === undefined || session === undefined)
+                return;
+            const space = input.inputSource.targetRaySpace;
+            hitTestSource.set(await session.requestHitTestSource?.({ space }));
+        });
+        watch([xrState.session, hand], async ([session, input]) => {
+            if (input === undefined || session === undefined)
+                return;
+            const space = input.inputSource.targetRaySpace;
+            hitTestSource.set(await session.requestHitTestSource?.({ space }));
+        });
+    }
     const { start, stop } = useFrame(() => {
-        if (hitTestSource === undefined)
-            return;
-        const [hit] = xr.getFrame().getHitTestResults(hitTestSource);
-        if (hit === undefined)
-            return;
         const referenceSpace = xr.getReferenceSpace();
-        if (referenceSpace === null)
-            return;
-        const pose = hit.getPose(referenceSpace);
-        if (pose === undefined)
-            return;
+        if (referenceSpace === null || hitTestSource.current === undefined) {
+            return hitTestCallback(hitMatrix, undefined);
+        }
+        const [hit] = xr.getFrame().getHitTestResults(hitTestSource.current);
+        const pose = hit?.getPose(referenceSpace);
+        if (pose === undefined) {
+            return hitTestCallback(hitMatrix, undefined);
+        }
         hitMatrix.fromArray(pose.transform.matrix);
         hitTestCallback(hitMatrix, hit);
     }, { autostart: false });
+    watch(hitTestSource, (testSource) => {
+        if (testSource === undefined) {
+            stop();
+            // Execute callback one last time to inform consumers of no hits.
+            hitTestCallback(hitMatrix, undefined);
+        }
+        else {
+            start();
+        }
+    });
 };

package/dist/types.d.ts

@@ -33,4 +33,3 @@ export type XRHandEvent<Type = XRHandEventType> = Type extends 'connected' | 'di
     handedness: 'left' | 'right';
     target: null;
 } : never;
-export type HitTestCallback = (hitMatrix: THREE.Matrix4, hit: XRHitTestResult) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threlte/xr",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "author": "Micheal Parks <michealparks1989@gmail.com> (https://parks.lol)",
   "license": "MIT",
   "devDependencies": {
@@ -18,7 +18,7 @@
     "typescript": "^5.1.6",
     "vite": "^4.4.6",
     "vite-plugin-mkcert": "^1.16.0",
-    "@threlte/core": "6.0.9"
+    "@threlte/core": "6.0.10"
   },
   "peerDependencies": {
     "svelte": ">=4",