chore: remove old pointer event handler composable (#771)

* chore: update deps * chore: remove old usePointerEventHandler * chore(types): fix type issue with intersects
Tresjs · Jul 12, 2024 · e077f9a · e077f9a
1 parent 8943cc3
commit e077f9a
Show file tree

Hide file tree

Showing 11 changed files with 384 additions and 1,090 deletions.
diff --git a/docs/package.json b/docs/package.json
@@ -12,9 +12,9 @@
     "@tresjs/core": "workspace:^"
   },
   "devDependencies": {
-    "@iconify-json/logos": "^1.1.42",
-    "@iconify-json/mdi": "^1.1.66",
-    "unocss": "^0.60.3",
+    "@iconify-json/logos": "^1.1.43",
+    "@iconify-json/mdi": "^1.1.67",
+    "unocss": "^0.61.3",
     "vite-svg-loader": "^5.1.0"
   }
 }
diff --git a/package.json b/package.json
@@ -81,8 +81,8 @@
     "@typescript-eslint/parser": "^7.16.0",
     "@vitejs/plugin-vue": "^5.0.5",
     "@vitest/coverage-c8": "^0.33.0",
-    "@vitest/coverage-v8": "^2.0.1",
-    "@vitest/ui": "^2.0.1",
+    "@vitest/coverage-v8": "^2.0.2",
+    "@vitest/ui": "^2.0.2",
     "@vue/test-utils": "^2.4.6",
     "eslint": "^9.6.0",
     "eslint-plugin-vue": "^9.27.0",
@@ -109,7 +109,7 @@
     "vite-plugin-require-transform": "^1.0.21",
     "vite-svg-loader": "^5.1.0",
     "vitepress": "1.3.0",
-    "vitest": "^2.0.1",
+    "vitest": "^2.0.2",
     "vue": "^3.4.31",
     "vue-demi": "^0.14.8"
   }

diff --git a/playground/package.json b/playground/package.json
@@ -11,15 +11,15 @@
   "dependencies": {
     "@tresjs/cientos": "3.9.0",
     "@tresjs/core": "workspace:^",
-    "vue-router": "^4.3.2"
+    "vue-router": "^4.4.0"
   },
   "devDependencies": {
     "@tresjs/leches": "0.15.0-next.3",
     "@tweakpane/plugin-essentials": "^0.2.0",
-    "unplugin-auto-import": "^0.17.2",
+    "unplugin-auto-import": "^0.18.0",
     "vite-plugin-glsl": "^1.2.1",
     "vite-plugin-qrcode": "^0.2.3",
-    "vite-plugin-vue-devtools": "7.2.1",
-    "vue-tsc": "^2.0.19"
+    "vite-plugin-vue-devtools": "7.3.5",
+    "vue-tsc": "^2.0.26"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/composables/index.ts b/src/composables/index.ts
@@ -6,7 +6,6 @@ export * from './useTexture'
 export * from './useRaycaster'
 export * from './useLogger'
 export * from './useSeek'
-export * from './usePointerEventHandler'
 export * from './useTresContextProvider'
 export * from './useLoop'
 export * from './useTresEventManager'

diff --git a/src/composables/usePointerEventHandler/index.ts b/src/composables/usePointerEventHandler/index.ts
diff --git a/src/composables/useRaycaster/index.ts b/src/composables/useRaycaster/index.ts
@@ -1,15 +1,15 @@
 import { Vector2, Vector3 } from 'three'
-import type { Intersection, Object3D } from 'three'
-import type { Ref, ShallowRef } from 'vue'
+import type { Intersection, Object3D, Object3DEventMap } from 'three'
+import type { ShallowRef } from 'vue'
 import { computed, onUnmounted, shallowRef } from 'vue'
 import type { EventHook } from '@vueuse/core'
 import { createEventHook, useElementBounding, usePointer } from '@vueuse/core'
 
-import type { DomEvent, TresCamera, TresEvent } from 'src/types'
+import type { DomEvent, TresCamera, TresEvent, TresInstance } from 'src/types'
 import type { TresContext } from '../useTresContextProvider'
 
 export const useRaycaster = (
-  objectsWithEvents: Ref<Object3D[]>,
+  objectsWithEvents: ShallowRef<TresInstance[]>,
   ctx: TresContext,
 ) => {
   // having a separate computed makes useElementBounding work
@@ -34,7 +34,7 @@ export const useRaycaster = (
 
     ctx.raycaster.value.setFromCamera(new Vector2(x, y), ctx.camera.value)
 
-    intersects.value = ctx.raycaster.value.intersectObjects(objectsWithEvents.value, true)
+    intersects.value = ctx.raycaster.value.intersectObjects(objectsWithEvents.value as Object3D<Object3DEventMap>[], true)
     return intersects.value
   }
 

diff --git a/src/composables/useTresContextProvider/index.ts b/src/composables/useTresContextProvider/index.ts
@@ -10,7 +10,7 @@ import { useRenderer } from '../useRenderer'
 import { extend } from '../../core/catalogue'
 import { useLogger } from '../useLogger'
 import type { EmitEventFn, TresObject, TresScene } from '../../types'
-import type { EventProps } from '../usePointerEventHandler'
+
 import { type TresEventManager, useTresEventManager } from '../useTresEventManager'
 import useSizes, { type SizesType } from '../useSizes'
 import type { RendererLoop } from '../../core/loop'
@@ -78,7 +78,7 @@ export interface TresContext {
   // Events
   // Temporaly add the methods to the context, this should be handled later by the EventManager state on the context https://github.com/Tresjs/tres/issues/515
   // When thats done maybe we can short the names of the methods since the parent will give the context.
-  registerObjectAtPointerEventHandler?: (object: TresObject & EventProps) => void
+  registerObjectAtPointerEventHandler?: (object: TresObject) => void
   deregisterObjectAtPointerEventHandler?: (object: TresObject) => void
   registerBlockingObjectAtPointerEventHandler?: (object: TresObject) => void
   deregisterBlockingObjectAtPointerEventHandler?: (object: TresObject) => void

diff --git a/src/composables/useTresEventManager/index.ts b/src/composables/useTresEventManager/index.ts
@@ -184,13 +184,13 @@ export function useTresEventManager(
 
   function registerObject(maybeTresObject: unknown) {
     if (is.tresObject(maybeTresObject) && is.object3D(maybeTresObject)) {
-      objectsWithEvents.value.push(maybeTresObject)
+      objectsWithEvents.value.push(maybeTresObject as TresInstance)
     }
   }
 
   function deregisterObject(maybeTresObject: unknown) {
     if (is.tresObject(maybeTresObject) && is.object3D(maybeTresObject)) {
-      const index = objectsWithEvents.value.indexOf(maybeTresObject)
+      const index = objectsWithEvents.value.indexOf(maybeTresObject as TresInstance)
       if (index > -1) {
         objectsWithEvents.value.splice(index, 1)
       }

diff --git a/src/core/nodeOps.ts b/src/core/nodeOps.ts
@@ -57,7 +57,7 @@ export const nodeOps: (context: TresContext) => RendererOptions<TresObject, Tres
           __tres: () => __tres,
         },
         {
-          object: (object: TresObject, _, primitive: TresPrimitive, setTarget: (nextObject: TresObject) => void) => {
+          object: (object: TresObject, _: unknown, primitive: TresPrimitive, setTarget: (nextObject: TresObject) => void) => {
             setPrimitiveObject(object, primitive, setTarget, { patchProp, remove, insert }, context)
           },
           __tres: (t: LocalState) => { Object.assign(__tres, t) },

diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -571,7 +571,7 @@ export function doRemoveDetach(node: TresObject, context: TresContext) {
 export function doRemoveDeregister(node: TresObject, context: TresContext) {
   // TODO: Refactor as `context.deregister`?
   // That would eliminate `context.deregisterCamera`.
-  node.traverse?.((child) => {
+  node.traverse?.((child: TresObject) => {
     context.deregisterCamera(child)
     // deregisterAtPointerEventHandlerIfRequired?.(child as TresObject)
     context.eventManager?.deregisterPointerMissedObject(child)