@threlte/xr 1.1.0 → 1.2.0

package/README.md

@@ -46,10 +46,6 @@ Contributions are what make the open source community such an amazing place to l
 - **Filing Issues** - if you have feature requestions or you think you spotted a bug, [submit an issue](https://github.com/threlte/threlte/issues/new).
 - **Contributing Code** - if you would like to drop us a PR, read the [contribution guide](https://github.com/threlte/threlte/blob/main/CONTRIBUTING.md) first.
 
-## Sponsors
-
-[![Powered by Vercel](./assets/vercel/powered-by-vercel.svg)](https://vercel.com/?utm_source=threlte&utm_campaign=oss)
-
 ---
 
 ### License

package/dist/components/ARButton.svelte

@@ -12,7 +12,7 @@
 <script lang="ts">
   import type { ComponentProps } from 'svelte'
   import XRButton from './XRButton.svelte'
-  import { defaultFeatures } from '../internal/defaultFeatures'
+  import { defaultFeatures } from '../internal/defaultFeatures.js'
 
   type Props = Omit<ComponentProps<typeof XRButton>, 'mode' | 'sessionInit'> & {
     sessionInit?: XRSessionInit & { domOverlay?: { root: HTMLElement } | undefined }

package/dist/components/Controller.svelte

@@ -3,14 +3,14 @@
 -->
 <script lang="ts">
   import { T, useThrelte } from '@threlte/core'
-  import { controllers } from '../hooks/useController.svelte'
+  import { controllers } from '../hooks/useController.svelte.js'
   import {
     isHandTracking,
     pointerState,
     teleportState,
     controllerEvents
-  } from '../internal/state.svelte'
-  import type { XRControllerEvents } from '../types'
+  } from '../internal/state.svelte.js'
+  import type { XRControllerEvents } from '../types.js'
   import PointerCursor from './internal/PointerCursor.svelte'
   import ShortRay from './internal/ShortRay.svelte'
   import TeleportCursor from './internal/TeleportCursor.svelte'

package/dist/components/Controller.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { XRControllerEvents } from '../types';
+import type { XRControllerEvents } from '../types.js';
 import type { Snippet } from 'svelte';
 type Props = {
     children?: Snippet;

package/dist/components/Hand.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
   import { Group } from 'three'
   import { T, useThrelte, useTask } from '@threlte/core'
-  import type { XRHandEvents } from '../types'
-  import { isHandTracking, handEvents } from '../internal/state.svelte'
-  import { hands } from '../hooks/useHand.svelte'
+  import type { XRHandEvents } from '../types.js'
+  import { isHandTracking, handEvents } from '../internal/state.svelte.js'
+  import { hands } from '../hooks/useHand.svelte.js'
   import type { Snippet } from 'svelte'
 
   type Props = {

package/dist/components/Hand.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { XRHandEvents } from '../types';
+import type { XRHandEvents } from '../types.js';
 import type { Snippet } from 'svelte';
 type Props = {
     children?: Snippet;

package/dist/components/Headset.svelte

@@ -2,7 +2,7 @@
   import type { Snippet } from 'svelte'
   import type { Group } from 'three'
   import { T, useThrelte } from '@threlte/core'
-  import { useHeadset } from '../hooks/useHeadset'
+  import { useHeadset } from '../hooks/useHeadset.js'
 
   interface Props {
     children?: Snippet<[{ ref: Group }]>

package/dist/components/VRButton.svelte

@@ -12,7 +12,7 @@
 <script lang="ts">
   import type { ComponentProps } from 'svelte'
   import XRButton from './XRButton.svelte'
-  import { defaultFeatures } from '../internal/defaultFeatures'
+  import { defaultFeatures } from '../internal/defaultFeatures.js'
 
   type Props = Omit<ComponentProps<typeof XRButton>, 'mode' | 'sessionInit'>
 

package/dist/components/XR.svelte

@@ -18,20 +18,20 @@ This should be placed within a Threlte `<Canvas />`.
 
 -->
 <script lang="ts">
+  import type { EventListener, WebXRManager, Event as ThreeEvent } from 'three'
   import type { Snippet } from 'svelte'
   import { useThrelte } from '@threlte/core'
-  import type { XRSessionEvent } from '../types'
   import {
     isHandTracking,
     isPresenting,
     referenceSpaceType,
     session,
     xr
-  } from '../internal/state.svelte'
-  import { setupRaf } from '../internal/setupRaf.svelte'
-  import { setupHeadset } from '../internal/setupHeadset.svelte'
-  import { setupControllers } from '../internal/setupControllers'
-  import { setupHands } from '../internal/setupHands'
+  } from '../internal/state.svelte.js'
+  import { setupRaf } from '../internal/setupRaf.svelte.js'
+  import { setupHeadset } from '../internal/setupHeadset.svelte.js'
+  import { setupControllers } from '../internal/setupControllers.js'
+  import { setupHands } from '../internal/setupHands.js'
 
   interface Props {
     /**
@@ -59,17 +59,17 @@ This should be placed within a Threlte `<Canvas />`.
     fallback?: Snippet
     children?: Snippet
 
-    /** Called as an XRSession is requested */
-    onsessionstart?: (event: XRSessionEvent<'sessionstart'>) => void
+    /** Called as an XRSession is started */
+    onsessionstart?: (event: ThreeEvent<'sessionstart', WebXRManager>) => void
 
-    /** Called after an XRSession is terminated */
-    onsessionend?: (event: XRSessionEvent<'sessionend'>) => void
+    /** Called after an XRSession is ended */
+    onsessionend?: (event: XRSessionEvent) => void
 
     /** Called when an XRSession is hidden or unfocused. */
-    onvisibilitychange?: (event: globalThis.XRSessionEvent) => void
+    onvisibilitychange?: (event: XRSessionEvent) => void
 
     /** Called when available inputsources change */
-    oninputsourceschange?: (event: globalThis.XRSessionEvent) => void
+    oninputsourceschange?: (event: XRSessionEvent) => void
   }
 
   let {
@@ -93,28 +93,28 @@ This should be placed within a Threlte `<Canvas />`.
   setupControllers()
   setupHands()
 
-  const handleSessionStart = () => {
+  const handleSessionStart: EventListener<object, 'sessionstart', WebXRManager> = (event) => {
     isPresenting.current = true
-    onsessionstart?.({ type: 'sessionstart', target: session.current } as any)
+    onsessionstart?.(event)
   }
 
-  const handleSessionEnd = () => {
-    onsessionend?.({ type: 'sessionend', target: session.current } as any)
+  const handleSessionEnd = (event: XRSessionEvent) => {
+    onsessionend?.(event)
     isPresenting.current = false
     session.current = undefined
   }
 
-  const handleVisibilityChange = (event: globalThis.XRSessionEvent) => {
-    onvisibilitychange?.({ ...event, target: session.current! })
+  const handleVisibilityChange = (event: XRSessionEvent) => {
+    onvisibilitychange?.(event)
   }
 
   const handleInputSourcesChange = (event: XRInputSourcesChangeEvent) => {
     isHandTracking.current = Object.values(event.session.inputSources).some((source) => source.hand)
-    oninputsourceschange?.({ ...event, target: session.current! })
+    oninputsourceschange?.(event)
   }
 
-  const handleFramerateChange = (event: globalThis.XRSessionEvent) => {
-    onvisibilitychange?.({ ...event, target: session.current! })
+  const handleFramerateChange = (event: XRSessionEvent) => {
+    onvisibilitychange?.(event)
   }
 
   $effect(() => {
@@ -127,11 +127,13 @@ This should be placed within a Threlte `<Canvas />`.
     currentSession.addEventListener('visibilitychange', handleVisibilityChange)
     currentSession.addEventListener('inputsourceschange', handleInputSourcesChange)
     currentSession.addEventListener('frameratechange', handleFramerateChange)
+    currentSession.addEventListener('end', handleSessionEnd)
 
     return () => {
       currentSession.removeEventListener('visibilitychange', handleVisibilityChange)
       currentSession.removeEventListener('inputsourceschange', handleInputSourcesChange)
       currentSession.removeEventListener('frameratechange', handleFramerateChange)
+      currentSession.removeEventListener('end', handleSessionEnd)
     }
   })
 
@@ -150,13 +152,11 @@ This should be placed within a Threlte `<Canvas />`.
     xr.current = renderer.xr
     renderer.xr.enabled = true
     renderer.xr.addEventListener('sessionstart', handleSessionStart)
-    renderer.xr.addEventListener('sessionend', handleSessionEnd)
 
     return () => {
       xr.current = undefined
       renderer.xr.enabled = false
       renderer.xr.removeEventListener('sessionstart', handleSessionStart)
-      renderer.xr.removeEventListener('sessionend', handleSessionEnd)
 
       // if unmounted while presenting (e.g. due to sveltekit navigation), end the session
       currentSession?.end()

package/dist/components/XR.svelte.d.ts

@@ -1,5 +1,5 @@
+import type { WebXRManager, Event as ThreeEvent } from 'three';
 import type { Snippet } from 'svelte';
-import type { XRSessionEvent } from '../types';
 interface Props {
     /**
      * Enables foveated rendering. Default is `1`, the three.js default.
@@ -22,14 +22,14 @@ interface Props {
     referenceSpace?: XRReferenceSpaceType;
     fallback?: Snippet;
     children?: Snippet;
-    /** Called as an XRSession is requested */
-    onsessionstart?: (event: XRSessionEvent<'sessionstart'>) => void;
-    /** Called after an XRSession is terminated */
-    onsessionend?: (event: XRSessionEvent<'sessionend'>) => void;
+    /** Called as an XRSession is started */
+    onsessionstart?: (event: ThreeEvent<'sessionstart', WebXRManager>) => void;
+    /** Called after an XRSession is ended */
+    onsessionend?: (event: XRSessionEvent) => void;
     /** Called when an XRSession is hidden or unfocused. */
-    onvisibilitychange?: (event: globalThis.XRSessionEvent) => void;
+    onvisibilitychange?: (event: XRSessionEvent) => void;
     /** Called when available inputsources change */
-    oninputsourceschange?: (event: globalThis.XRSessionEvent) => void;
+    oninputsourceschange?: (event: XRSessionEvent) => void;
 }
 /**
  * `<XR />` is a WebXR manager that configures your scene for XR rendering and interaction.

package/dist/components/XRButton.svelte

@@ -19,9 +19,9 @@ display info about your WebXR session. This is aliased by `ARButton` and
 -->
 <script lang="ts">
   import type { HTMLButtonAttributes } from 'svelte/elements'
-  import { getXRSupportState } from '../lib/getXRSupportState'
-  import { toggleXRSession } from '../lib/toggleXRSession'
-  import { isPresenting, xr } from '../internal/state.svelte'
+  import { getXRSupportState } from '../lib/getXRSupportState.js'
+  import { toggleXRSession } from '../lib/toggleXRSession.js'
+  import { isPresenting, xr } from '../internal/state.svelte.js'
   import type { Snippet } from 'svelte'
 
   type Props = HTMLButtonAttributes & {

package/dist/components/internal/PointerCursor.svelte

@@ -11,7 +11,7 @@
 
 <script lang="ts">
   import { T, useTask, useThrelte } from '@threlte/core'
-  import { pointerIntersection, pointerState } from '../../internal/state.svelte'
+  import { pointerIntersection, pointerState } from '../../internal/state.svelte.js'
   import Cursor from './Cursor.svelte'
   import type { Snippet } from 'svelte'
 

package/dist/components/internal/ShortRay.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { T } from '@threlte/core'
-  import { pointerState, teleportState, teleportIntersection } from '../../internal/state.svelte'
+  import { pointerState, teleportState, teleportIntersection } from '../../internal/state.svelte.js'
   import type { Snippet } from 'svelte'
 
   interface Props {

package/dist/components/internal/TeleportCursor.svelte

@@ -12,7 +12,7 @@
 <script lang="ts">
   import { Spring } from 'svelte/motion'
   import { T, useTask, useThrelte } from '@threlte/core'
-  import { teleportIntersection } from '../../internal/state.svelte'
+  import { teleportIntersection } from '../../internal/state.svelte.js'
   import Cursor from './Cursor.svelte'
   import type { Snippet } from 'svelte'
 

package/dist/components/internal/TeleportRay.svelte

@@ -18,7 +18,7 @@
   import { LineGeometry } from 'three/examples/jsm/lines/LineGeometry.js'
   import { LineMaterial } from 'three/examples/jsm/lines/LineMaterial.js'
   import { T, useTask, useThrelte } from '@threlte/core'
-  import { teleportIntersection } from '../../internal/state.svelte'
+  import { teleportIntersection } from '../../internal/state.svelte.js'
 
   interface Props {
     handedness: 'left' | 'right'

package/dist/hooks/useController.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { XRController } from '../types';
-import { type CurrentReadable } from './currentReadable.svelte';
+import type { XRController } from '../types.js';
+import { type CurrentReadable } from './currentReadable.svelte.js';
 declare class Controllers {
     left: XRController | undefined;
     right: XRController | undefined;

package/dist/hooks/useController.svelte.js

@@ -1,4 +1,4 @@
-import { toCurrentReadable } from './currentReadable.svelte';
+import { toCurrentReadable } from './currentReadable.svelte.js';
 class Controllers {
     left = $state.raw();
     right = $state.raw();

package/dist/hooks/useHand.svelte.d.ts

@@ -1,12 +1,12 @@
-import type { XRHand } from '../types';
-import { type CurrentReadable } from './currentReadable.svelte';
+import type { XRHandObject } from '../types.js';
+import { type CurrentReadable } from './currentReadable.svelte.js';
 declare class Hands {
-    left: XRHand | undefined;
-    right: XRHand | undefined;
+    left: XRHandObject | undefined;
+    right: XRHandObject | undefined;
 }
 export declare const hands: Hands;
 /**
  * Provides a reference to a current XRHand, filtered by handedness.
  */
-export declare const useHand: (handedness: "left" | "right") => CurrentReadable<undefined | XRHand>;
+export declare const useHand: (handedness: "left" | "right") => CurrentReadable<undefined | XRHandObject>;
 export {};

package/dist/hooks/useHand.svelte.js

@@ -1,4 +1,4 @@
-import { toCurrentReadable } from './currentReadable.svelte';
+import { toCurrentReadable } from './currentReadable.svelte.js';
 class Hands {
     left = $state.raw();
     right = $state.raw();

package/dist/hooks/useHandJoint.svelte.d.ts

@@ -1,6 +1,6 @@
 import type { XRJointSpace } from 'three';
-import type { HandJoints } from '../lib/handJoints';
+import type { HandJoints } from '../lib/handJoints.js';
 /**
  * Provides a reference to a requested hand joint, once available.
  */
-export declare const useHandJoint: (handedness: "left" | "right", joint: HandJoints) => import("./currentReadable.svelte").CurrentReadable<XRJointSpace | undefined>;
+export declare const useHandJoint: (handedness: "left" | "right", joint: HandJoints) => import("./currentReadable.svelte.js").CurrentReadable<XRJointSpace | undefined>;

package/dist/hooks/useHandJoint.svelte.js

@@ -1,6 +1,6 @@
 import { useTask, useThrelte } from '@threlte/core';
-import { hands } from './useHand.svelte';
-import { toCurrentReadable } from './currentReadable.svelte';
+import { hands } from './useHand.svelte.js';
+import { toCurrentReadable } from './currentReadable.svelte.js';
 /**
  * Provides a reference to a requested hand joint, once available.
  */

package/dist/hooks/useHeadset.js

@@ -1,4 +1,4 @@
-import { headset } from '../internal/setupHeadset.svelte';
+import { headset } from '../internal/setupHeadset.svelte.js';
 export const useHeadset = () => {
     return headset;
 };

package/dist/hooks/useHitTest.svelte.js

@@ -1,7 +1,7 @@
 import { Matrix4 } from 'three';
 import { useThrelte, useTask } from '@threlte/core';
-import { controllers } from './useController.svelte';
-import { isPresenting, session } from '../internal/state.svelte';
+import { controllers } from './useController.svelte.js';
+import { isPresenting, session } from '../internal/state.svelte.js';
 /**
  * Use this hook to perform a hit test per frame in an AR environment.
  *

package/dist/hooks/useXR.d.ts

@@ -1,5 +1,5 @@
 import type { WebXRManager } from 'three';
-import { type CurrentReadable } from './currentReadable.svelte';
+import { type CurrentReadable } from './currentReadable.svelte.js';
 /**
  * Provides access to context related to `<XR />`.
  */

package/dist/hooks/useXR.js

@@ -1,5 +1,5 @@
-import { isPresenting, isHandTracking, session, xr } from '../internal/state.svelte';
-import { toCurrentReadable } from './currentReadable.svelte';
+import { isPresenting, isHandTracking, session, xr } from '../internal/state.svelte.js';
+import { toCurrentReadable } from './currentReadable.svelte.js';
 /**
  * Provides access to context related to `<XR />`.
  */

package/dist/index.d.ts

@@ -5,16 +5,16 @@ export { default as Controller } from './components/Controller.svelte';
 export { default as Hand } from './components/Hand.svelte';
 export { default as Headset } from './components/Headset.svelte';
 export { default as XR } from './components/XR.svelte';
-export { getXRSupportState } from './lib/getXRSupportState';
-export { toggleXRSession } from './lib/toggleXRSession';
-export { handJoints } from './lib/handJoints';
-export { pointerControls } from './plugins/pointerControls';
-export { teleportControls } from './plugins/teleportControls';
-export { useController } from './hooks/useController.svelte';
-export { useHand } from './hooks/useHand.svelte';
-export { useHandJoint } from './hooks/useHandJoint.svelte';
-export { useHeadset } from './hooks/useHeadset';
-export { useHitTest } from './hooks/useHitTest.svelte';
-export { useTeleport } from './hooks/useTeleport';
-export { useXR } from './hooks/useXR';
-export type { XRSessionEventType, XRControllerEventType, XRHandEventType, XRSessionEvent, XRControllerEvent, XRController, XRHand, XRHandEvent } from './types';
+export { getXRSupportState } from './lib/getXRSupportState.js';
+export { toggleXRSession } from './lib/toggleXRSession.js';
+export { handJoints } from './lib/handJoints.js';
+export { pointerControls } from './plugins/pointerControls/index.js';
+export { teleportControls } from './plugins/teleportControls/index.js';
+export { useController } from './hooks/useController.svelte.js';
+export { useHand } from './hooks/useHand.svelte.js';
+export { useHandJoint } from './hooks/useHandJoint.svelte.js';
+export { useHeadset } from './hooks/useHeadset.js';
+export { useHitTest } from './hooks/useHitTest.svelte.js';
+export { useTeleport } from './hooks/useTeleport.js';
+export { useXR } from './hooks/useXR.js';
+export type { XRSessionEventType, XRControllerEventType, XRHandEventType, XRControllerEvent, XRController, XRHandObject, XRHandEvent } from './types.js';

package/dist/index.js

@@ -7,17 +7,17 @@ export { default as Hand } from './components/Hand.svelte';
 export { default as Headset } from './components/Headset.svelte';
 export { default as XR } from './components/XR.svelte';
 // Utilities
-export { getXRSupportState } from './lib/getXRSupportState';
-export { toggleXRSession } from './lib/toggleXRSession';
-export { handJoints } from './lib/handJoints';
+export { getXRSupportState } from './lib/getXRSupportState.js';
+export { toggleXRSession } from './lib/toggleXRSession.js';
+export { handJoints } from './lib/handJoints.js';
 // Plugins
-export { pointerControls } from './plugins/pointerControls';
-export { teleportControls } from './plugins/teleportControls';
+export { pointerControls } from './plugins/pointerControls/index.js';
+export { teleportControls } from './plugins/teleportControls/index.js';
 // Hooks
-export { useController } from './hooks/useController.svelte';
-export { useHand } from './hooks/useHand.svelte';
-export { useHandJoint } from './hooks/useHandJoint.svelte';
-export { useHeadset } from './hooks/useHeadset';
-export { useHitTest } from './hooks/useHitTest.svelte';
-export { useTeleport } from './hooks/useTeleport';
-export { useXR } from './hooks/useXR';
+export { useController } from './hooks/useController.svelte.js';
+export { useHand } from './hooks/useHand.svelte.js';
+export { useHandJoint } from './hooks/useHandJoint.svelte.js';
+export { useHeadset } from './hooks/useHeadset.js';
+export { useHitTest } from './hooks/useHitTest.svelte.js';
+export { useTeleport } from './hooks/useTeleport.js';
+export { useXR } from './hooks/useXR.js';

package/dist/internal/setupControllers.js

@@ -1,9 +1,9 @@
 import { XRControllerModelFactory } from 'three/examples/jsm/webxr/XRControllerModelFactory.js';
 import { useThrelte } from '@threlte/core';
 import { onMount } from 'svelte';
-import { useHandTrackingState } from './useHandTrackingState';
-import { controllers } from '../hooks/useController.svelte';
-import { controllerEvents } from './state.svelte';
+import { useHandTrackingState } from './useHandTrackingState.js';
+import { controllers } from '../hooks/useController.svelte.js';
+import { controllerEvents } from './state.svelte.js';
 export const setupControllers = () => {
     const factory = new XRControllerModelFactory();
     const { xr } = useThrelte().renderer;

package/dist/internal/setupHands.js

@@ -1,9 +1,9 @@
 import { XRHandModelFactory } from 'three/examples/jsm/webxr/XRHandModelFactory.js';
 import { useThrelte } from '@threlte/core';
 import { onMount } from 'svelte';
-import { hands } from '../hooks/useHand.svelte';
-import { useHandTrackingState } from './useHandTrackingState';
-import { handEvents } from './state.svelte';
+import { hands } from '../hooks/useHand.svelte.js';
+import { useHandTrackingState } from './useHandTrackingState.js';
+import { handEvents } from './state.svelte.js';
 export const setupHands = () => {
     const factory = new XRHandModelFactory();
     const { xr } = useThrelte().renderer;
@@ -29,6 +29,9 @@ export const setupHands = () => {
             const { model, targetRay } = map.get(this);
             const { data } = event;
             const { handedness, hand: inputSource } = data;
+            if (handedness === 'none' || inputSource === undefined) {
+                return;
+            }
             hands[handedness] = {
                 hand: this,
                 model,

package/dist/internal/setupHeadset.svelte.js

@@ -1,6 +1,6 @@
 import { Group } from 'three';
 import { useThrelte, useTask } from '@threlte/core';
-import { isPresenting } from './state.svelte';
+import { isPresenting } from './state.svelte.js';
 export const headset = new Group();
 export const setupHeadset = () => {
     const { renderer, camera, scheduler, renderStage } = useThrelte();

package/dist/internal/setupRaf.svelte.js

@@ -1,5 +1,5 @@
-import { session } from './state.svelte';
-import { raf } from './raf';
+import { session } from './state.svelte.js';
+import { raf } from './raf.js';
 export const setupRaf = () => {
     if (typeof window === 'undefined')
         return;

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

@@ -1,5 +1,5 @@
 import type { WebXRManager, Intersection } from 'three';
-import type { XRControllerEvents, XRHandEvents } from '../types';
+import type { XRControllerEvents, XRHandEvents } from '../types.js';
 interface ControllerEvents {
     left?: XRControllerEvents;
     right?: XRControllerEvents;

package/dist/lib/toggleXRSession.js

@@ -1,5 +1,5 @@
-import { session, referenceSpaceType, xr } from '../internal/state.svelte';
-import { getXRSessionOptions } from './getXRSessionOptions';
+import { session, referenceSpaceType, xr } from '../internal/state.svelte.js';
+import { getXRSessionOptions } from './getXRSessionOptions.js';
 /**
  * Starts / ends an XR session.
  *

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

@@ -1,3 +1,3 @@
-import type { ControlsContext, HandContext } from './types';
+import type { ControlsContext, HandContext } from './types.js';
 export type ComputeFunction = (state: ControlsContext, handState: HandContext) => void;
 export declare const defaultComputeFunction: ComputeFunction;

package/dist/plugins/pointerControls/compute.js

@@ -1,5 +1,5 @@
 import { Vector3 } from 'three';
-import { controllers } from '../../hooks/useController.svelte';
+import { controllers } from '../../hooks/useController.svelte.js';
 const forward = new Vector3();
 export const defaultComputeFunction = (context, handContext) => {
     const targetRay = controllers[handContext.hand]?.targetRay;

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

@@ -1,5 +1,5 @@
 import type { Object3D } from 'three';
-import type { ControlsContext, HandContext } from './types';
+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;
 export declare const getControlsContext: () => ControlsContext;

package/dist/plugins/pointerControls/hook.js

@@ -1,4 +1,4 @@
-import { getControlsContext, getInternalContext } from './context';
+import { getControlsContext, getInternalContext } from './context.js';
 export const usePointerControls = () => {
     const context = getControlsContext();
     const { dispatchers } = getInternalContext();

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

@@ -1,5 +1,5 @@
-import { type ComputeFunction } from './compute';
-import type { FilterFunction } from './types';
+import { type ComputeFunction } from './compute.js';
+import type { FilterFunction } from './types.js';
 export type PointerControlsOptions = {
     enabled?: boolean;
     /**
@@ -23,5 +23,5 @@ export type PointerControlsOptions = {
 };
 export declare const pointerControls: (handedness: "left" | "right", options?: PointerControlsOptions) => {
     enabled: import("@threlte/core").CurrentWritable<boolean>;
-    hovered: Map<string, import("./types").IntersectionEvent>;
+    hovered: Map<string, import("./types.js").IntersectionEvent>;
 };

package/dist/plugins/pointerControls/index.js

@@ -1,10 +1,10 @@
 import { Raycaster, Vector3 } from 'three';
 import { currentWritable, watch } from '@threlte/core';
-import { defaultComputeFunction } from './compute';
-import { injectPointerControlsPlugin } from './plugin.svelte';
-import { setupPointerControls } from './setup.svelte';
-import { getControlsContext, getHandContext, setControlsContext, setHandContext, setInternalContext } from './context';
-import { pointerState } from '../../internal/state.svelte';
+import { defaultComputeFunction } from './compute.js';
+import { injectPointerControlsPlugin } from './plugin.svelte.js';
+import { setupPointerControls } from './setup.svelte.js';
+import { getControlsContext, getHandContext, setControlsContext, setHandContext, setInternalContext } from './context.js';
+import { pointerState } from '../../internal/state.svelte.js';
 let controlsCounter = 0;
 export const pointerControls = (handedness, options) => {
     if (getControlsContext() === undefined) {

package/dist/plugins/pointerControls/plugin.svelte.js

@@ -1,6 +1,6 @@
 import { injectPlugin, isInstanceOf, observe } from '@threlte/core';
-import { usePointerControls } from './hook';
-import { events } from './types';
+import { usePointerControls } from './hook.js';
+import { events } from './types.js';
 export const injectPointerControlsPlugin = () => {
     injectPlugin('threlte-pointer-controls', (args) => {
         if (!isInstanceOf(args.ref, 'Object3D'))

package/dist/plugins/pointerControls/setup.svelte.d.ts

@@ -1,2 +1,2 @@
-import type { ControlsContext, HandContext } from './types';
+import type { ControlsContext, HandContext } from './types.js';
 export declare const setupPointerControls: (context: ControlsContext, handContext: HandContext, fixedStep?: number) => void;

package/dist/plugins/pointerControls/setup.svelte.js

@@ -1,10 +1,10 @@
 import { Vector3 } from 'three';
 import { observe, watch } from '@threlte/core';
-import { getInternalContext } from './context';
-import { controllers } from '../../hooks/useController.svelte';
-import { useHand } from '../../hooks/useHand.svelte';
-import { useFixed } from '../../internal/useFixed';
-import { isPresenting, pointerIntersection } from '../../internal/state.svelte';
+import { getInternalContext } from './context.js';
+import { controllers } from '../../hooks/useController.svelte.js';
+import { useHand } from '../../hooks/useHand.svelte.js';
+import { useFixed } from '../../internal/useFixed.js';
+import { isPresenting, pointerIntersection } from '../../internal/state.svelte.js';
 const getIntersectionId = (intersection) => {
     return `${(intersection.eventObject || intersection.object).uuid}/${intersection.index}${intersection.instanceId ?? ''}`;
 };

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

@@ -1,6 +1,6 @@
 import type { Intersection as ThreeIntersection, Object3D, Vector3, Ray, Raycaster, Event } from 'three';
 import type { CurrentWritable } from '@threlte/core';
-import type { ComputeFunction } from './compute';
+import type { ComputeFunction } from './compute.js';
 export type Properties<T> = Pick<T, {
     [K in keyof T]: T[K] extends (_: any) => any ? never : K;
 }[keyof T]>;

package/dist/plugins/teleportControls/compute.d.ts

@@ -1,3 +1,3 @@
-import type { Context, HandContext } from './context';
+import type { Context, HandContext } from './context.js';
 export type ComputeFunction = (context: Context, handContext: HandContext) => void;
 export declare const defaultComputeFunction: (context: Context, handContext: HandContext) => void;

package/dist/plugins/teleportControls/compute.js

@@ -1,5 +1,5 @@
 import { Vector3 } from 'three';
-import { controllers } from '../../hooks/useController.svelte';
+import { controllers } from '../../hooks/useController.svelte.js';
 const forward = new Vector3();
 export const defaultComputeFunction = (context, handContext) => {
     const targetRay = controllers[handContext.hand]?.targetRay;

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

@@ -1,6 +1,6 @@
 import { type Mesh, Raycaster, type Intersection } from 'three';
 import type { CurrentWritable } from '@threlte/core';
-import type { TeleportControlsOptions } from '.';
+import type { TeleportControlsOptions } from './index.js';
 export type ComputeFunction = (context: Context, handContext: HandContext) => void;
 export type TeleportEvents = Record<string, (arg: unknown) => void>;
 export interface Context {

package/dist/plugins/teleportControls/context.js

@@ -1,6 +1,6 @@
 import { Raycaster } from 'three';
 import { getContext, setContext } from 'svelte';
-import { defaultComputeFunction } from './compute';
+import { defaultComputeFunction } from './compute.js';
 const handContextKeys = {
     left: Symbol('teleport-controls-context-left-hand'),
     right: Symbol('teleport-controls-context-right-hand')

package/dist/plugins/teleportControls/index.d.ts

@@ -1,4 +1,4 @@
-import { type ComputeFunction } from './context';
+import { type ComputeFunction } from './context.js';
 export interface TeleportControlsOptions {
     enabled?: boolean;
     /**

package/dist/plugins/teleportControls/index.js

@@ -1,9 +1,9 @@
 import { currentWritable, watch } from '@threlte/core';
-import { createTeleportContext, useTeleportControls, getHandContext } from './context';
-import { injectTeleportControlsPlugin } from './plugin.svelte';
-import { setHandContext } from './context';
-import { setupTeleportControls } from './setup.svelte';
-import { teleportState } from '../../internal/state.svelte';
+import { createTeleportContext, useTeleportControls, getHandContext } from './context.js';
+import { injectTeleportControlsPlugin } from './plugin.svelte.js';
+import { setHandContext } from './context.js';
+import { setupTeleportControls } from './setup.svelte.js';
+import { teleportState } from '../../internal/state.svelte.js';
 let controlsCounter = 0;
 export const teleportControls = (handedness, options) => {
     if (useTeleportControls() === undefined) {

package/dist/plugins/teleportControls/plugin.svelte.js

@@ -1,5 +1,5 @@
 import { injectPlugin, isInstanceOf } from '@threlte/core';
-import { useTeleportControls } from './context';
+import { useTeleportControls } from './context.js';
 /**
  * Registers T components with "teleportSurface" or "teleportBlocker" attributes.
  */

package/dist/plugins/teleportControls/setup.svelte.d.ts

@@ -1,2 +1,2 @@
-import type { Context, HandContext } from './context';
+import type { Context, HandContext } from './context.js';
 export declare const setupTeleportControls: (context: Context, handContext: HandContext, fixedStep?: number) => void;

package/dist/plugins/teleportControls/setup.svelte.js

@@ -1,8 +1,8 @@
 import { observe } from '@threlte/core';
-import { controllers } from '../../hooks/useController.svelte';
-import { useTeleport } from '../../hooks/useTeleport';
-import { useFixed } from '../../internal/useFixed';
-import { isPresenting, teleportIntersection } from '../../internal/state.svelte';
+import { controllers } from '../../hooks/useController.svelte.js';
+import { useTeleport } from '../../hooks/useTeleport.js';
+import { useFixed } from '../../internal/useFixed.js';
+import { isPresenting, teleportIntersection } from '../../internal/state.svelte.js';
 export const setupTeleportControls = (context, handContext, fixedStep = 1 / 40) => {
     const handedness = handContext.hand;
     const controller = $derived(controllers[handedness]);

package/dist/types.d.ts

@@ -3,7 +3,7 @@ import type { XRControllerModel } from 'three/examples/jsm/webxr/XRControllerMod
 import type { XRHandModel } from 'three/examples/jsm/webxr/XRHandModelFactory.js';
 export type XRSessionEventType = 'sessionstart' | 'sessionend' | 'visibilitychange' | 'frameratechange';
 export type XRControllerEventType = 'select' | 'selectstart' | 'selectend' | 'squeeze' | 'squeezeend' | 'squeezestart' | 'disconnected' | 'connected';
-export type XRControllerEvents = {
+export interface XRControllerEvents {
     onconnected?: XRControllerEventCallback<'connected'>;
     ondisconnected?: XRControllerEventCallback<'disconnected'>;
     onselect?: XRControllerEventCallback<'select'>;
@@ -12,30 +12,24 @@ export type XRControllerEvents = {
     onsqueeze?: XRControllerEventCallback<'squeeze'>;
     onsqueezeend?: XRControllerEventCallback<'squeezeend'>;
     onsqueezestart?: XRControllerEventCallback<'squeezestart'>;
-};
+}
 export type XRHandEventType = 'pinchstart' | 'pinchend' | 'connected' | 'disconnected';
-export type XRSessionEvent<Type = XRSessionEventType> = (event: Event & {
-    type: Type;
-    target: XRSession;
-}) => void;
-export type XRControllerEvent<Type = XRControllerEventType> = Event & {
-    type: Type;
-    target: Group;
+export interface XRControllerEvent<Type extends string = XRControllerEventType> extends Event<Type, Group> {
     data: XRInputSource;
-};
-export type XRControllerEventCallback<Type = XRControllerEventType> = (event: XRControllerEvent<Type>) => void;
-export type XRController = {
+}
+export type XRControllerEventCallback<Type extends string = XRControllerEventType> = (event: XRControllerEvent<Type>) => void;
+export interface XRController {
     targetRay: XRTargetRaySpace;
     grip: XRGripSpace;
     model?: XRControllerModel | undefined;
     inputSource: XRInputSource;
-};
-export type XRHand = {
+}
+export interface XRHandObject {
     targetRay: XRTargetRaySpace;
     hand: XRHandSpace;
     model?: XRHandModel;
-    inputSource: globalThis.XRHand;
-};
+    inputSource: XRHand;
+}
 export type XRHandEvent<Type = XRHandEventType> = Type extends 'connected' | 'disconnected' ? {
     type: Type;
     target: XRHandSpace;
@@ -46,9 +40,9 @@ export type XRHandEvent<Type = XRHandEventType> = Type extends 'connected' | 'di
     target: null;
 } : never;
 export type XRHandEventCallback<Type> = (event: XRHandEvent<Type>) => void;
-export type XRHandEvents = {
+export interface XRHandEvents {
     onconnected?: XRHandEventCallback<'connected'>;
     ondisconnected?: XRHandEventCallback<'disconnected'>;
     onpinchstart?: XRHandEventCallback<'pinchstart'>;
     onpinchend?: XRHandEventCallback<'pinchend'>;
-};
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threlte/xr",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "author": "Micheal Parks <michealparks1989@gmail.com> (https://parks.lol)",
   "license": "MIT",
   "description": "Tools to more easily create VR and AR experiences with Threlte",
@@ -11,7 +11,7 @@
     "@sveltejs/package": "^2.3.7",
     "@sveltejs/vite-plugin-svelte": "^6.1.4",
     "@types/three": "^0.175.0",
-    "@types/webxr": "^0.5.22",
+    "@types/webxr": "0.5.23",
     "autoprefixer": "^10.4.19",
     "eslint": "^9.26.0",
     "eslint-plugin-svelte": "^3.5.1",
@@ -22,11 +22,11 @@
     "svelte-check": "^4.3.1",
     "three": "^0.175.0",
     "tslib": "^2.6.2",
-    "typescript": "^5.6.3",
+    "typescript": "5.9.2",
     "typescript-eslint": "^8.32.0",
     "vite": "^7.1.4",
     "vite-plugin-mkcert": "^1.17.5",
-    "@threlte/core": "8.1.5"
+    "@threlte/core": "8.3.0"
   },
   "peerDependencies": {
     "svelte": ">=5",