fix(types): added Object3DEventMap to Object3D generics for point…

… event handling (#491)
Tresjs · Jan 2, 2024 · a63eb90 · a63eb90
1 parent 5fad3b8
commit a63eb90
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 11 deletions.
diff --git a/src/composables/usePointerEventHandler/index.ts b/src/composables/usePointerEventHandler/index.ts
@@ -1,13 +1,13 @@
-import type { Intersection, Event, Object3D } from 'three'
+import type { Intersection, Object3D, Object3DEventMap } from 'three'
 import type { TresScene } from 'src/types'
 import { computed, reactive, ref } from 'vue'
 import { uniqueBy } from '../../utils'
 import { useRaycaster } from '../useRaycaster'
 
 import type { TresContext } from '../useTresContextProvider'
 
-type CallbackFn = (intersection: Intersection<Object3D<Event>>, event: PointerEvent) => void
-type CallbackFnPointerLeave = (object: Object3D<Event>, event: PointerEvent) => void
+type CallbackFn = (intersection: Intersection<Object3D<Object3DEventMap>>, event: PointerEvent) => void
+type CallbackFnPointerLeave = (object: Object3D, event: PointerEvent) => void
 
 export interface EventProps {
   onClick?: CallbackFn
@@ -24,10 +24,10 @@ export const usePointerEventHandler = (
   },
 ) => {
   const objectsWithEventListeners = reactive({
-    click: new Map<Object3D, CallbackFn>(),
-    pointerMove: new Map<Object3D, CallbackFn>(),
-    pointerEnter: new Map<Object3D, CallbackFn>(),
-    pointerLeave: new Map<Object3D, CallbackFnPointerLeave>(),
+    click: new Map<Object3D<Object3DEventMap>, CallbackFn>(),
+    pointerMove: new Map<Object3D<Object3DEventMap>, CallbackFn>(),
+    pointerEnter: new Map<Object3D<Object3DEventMap>, CallbackFn>(),
+    pointerLeave: new Map<Object3D<Object3DEventMap>, CallbackFnPointerLeave>(),
   })
 
   const blockingObjects = ref(new Set<Object3D>())
@@ -79,7 +79,7 @@ export const usePointerEventHandler = (
     if (intersects.length) objectsWithEventListeners.click.get(intersects[0].object)?.(intersects[0], event)
   })
 
-  let previouslyIntersectedObject: Object3D<Event> | null
+  let previouslyIntersectedObject: Object3D | null
 
   onPointerMove(({ intersects, event }) => {
     const firstObject = intersects?.[0]?.object

diff --git a/src/composables/useRaycaster/index.ts b/src/composables/useRaycaster/index.ts
@@ -1,13 +1,13 @@
 import { Vector2 } from 'three'
-import type { Object3D, type Intersection } from 'three'
+import type { Object3D, Intersection } from 'three'
 import type { Ref } from 'vue'
 import { computed, onUnmounted } from 'vue'
 import type { EventHook } from '@vueuse/core'
 import { createEventHook, useElementBounding, usePointer } from '@vueuse/core'
 
 import { type TresContext } from '../useTresContextProvider'
 
-export type Intersects = Intersection<THREE.Object3D<THREE.Event>>[]
+export type Intersects = Intersection<THREE.Object3D<THREE.Object3DEventMap>>[]
 interface PointerMoveEventPayload {
   intersects?: Intersects
   event: PointerEvent

diff --git a/src/types/index.ts b/src/types/index.ts
@@ -38,7 +38,7 @@ interface TresBaseObject {
 }
 
 // Custom type for geometry and material properties in Object3D
-export interface TresObject3D extends THREE.Object3D {
+export interface TresObject3D extends THREE.Object3D<THREE.Object3DEventMap> {
   geometry?: THREE.BufferGeometry & TresBaseObject
   material?: THREE.Material & TresBaseObject
   userData: {