@tresjs/core 5.0.0-next.1 → 5.0.0-next.3

package/dist/src/components/TresCanvas.vue.d.ts

@@ -1,85 +1,87 @@
-import { Camera, ColorSpace, ShadowMapType, ToneMapping, WebGLRenderer, WebGLRendererParameters } from 'three';
-import { RendererPresetsType } from '../composables/useRenderer/const';
-import { TresPointerEvent } from '../types/';
-import { TresContext } from '../composables';
-export interface TresCanvasProps extends Omit<WebGLRendererParameters, 'canvas'> {
-    shadows?: boolean;
-    clearColor?: string;
-    toneMapping?: ToneMapping;
-    shadowMapType?: ShadowMapType;
-    useLegacyLights?: boolean;
-    outputColorSpace?: ColorSpace;
-    toneMappingExposure?: number;
-    renderMode?: 'always' | 'on-demand' | 'manual';
-    dpr?: number | [number, number];
-    camera?: Camera;
-    preset?: RendererPresetsType;
+import { TresCamera } from '../types/';
+import { PointerEvent } from '@pmndrs/pointer-events';
+import { RendererOptions, TresContext, TresRenderer } from '../composables';
+import * as THREE from 'three';
+export interface TresCanvasProps extends RendererOptions {
+    /**
+     * Custom camera instance to use as main camera
+     * If not provided, a default PerspectiveCamera will be created
+     */
+    camera?: TresCamera;
+    /**
+     * Whether the canvas should be sized to the window
+     * When true, canvas will be fixed positioned and full viewport size
+     * @default false
+     */
     windowSize?: boolean;
+    /**
+     * Whether to enable the provide/inject bridge between Vue and TresJS
+     * When true, Vue's provide/inject will work across the TresJS boundary
+     * @default true
+     */
     enableProvideBridge?: boolean;
 }
-declare function __VLS_template(): {
-    attrs: Partial<{}>;
-    slots: Readonly<{
-        default: () => any;
-    }> & {
-        default: () => any;
-    };
-    refs: {
-        canvas: HTMLCanvasElement;
-    };
-    rootEl: HTMLCanvasElement;
-};
-type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<TresCanvasProps, {
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<TresCanvasProps, {
     context: import('vue').ShallowRef<TresContext | null, TresContext | null>;
     dispose: () => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    render: (renderer: WebGLRenderer) => any;
-    click: (event: TresPointerEvent) => any;
-    wheel: (event: TresPointerEvent) => any;
+    render: (renderer: TresRenderer) => any;
+    click: (event: PointerEvent<MouseEvent>) => any;
+    contextmenu: (event: PointerEvent<MouseEvent>) => any;
+    pointermove: (event: PointerEvent<MouseEvent>) => any;
+    pointerenter: (event: PointerEvent<MouseEvent>) => any;
+    pointerleave: (event: PointerEvent<MouseEvent>) => any;
+    pointerover: (event: PointerEvent<MouseEvent>) => any;
+    pointerout: (event: PointerEvent<MouseEvent>) => any;
+    dblclick: (event: PointerEvent<MouseEvent>) => any;
+    pointerdown: (event: PointerEvent<MouseEvent>) => any;
+    pointerup: (event: PointerEvent<MouseEvent>) => any;
+    pointercancel: (event: PointerEvent<MouseEvent>) => any;
+    lostpointercapture: (event: PointerEvent<MouseEvent>) => any;
+    wheel: (event: PointerEvent<MouseEvent>) => any;
     ready: (context: TresContext) => any;
-    doubleClick: (event: TresPointerEvent) => any;
-    contextMenu: (event: TresPointerEvent) => any;
-    pointerMove: (event: TresPointerEvent) => any;
-    pointerUp: (event: TresPointerEvent) => any;
-    pointerDown: (event: TresPointerEvent) => any;
-    pointerEnter: (event: TresPointerEvent) => any;
-    pointerLeave: (event: TresPointerEvent) => any;
-    pointerOver: (event: TresPointerEvent) => any;
-    pointerOut: (event: TresPointerEvent) => any;
-    pointerMissed: (event: TresPointerEvent) => any;
+    pointermissed: (event: PointerEvent<MouseEvent>) => any;
 }, string, import('vue').PublicProps, Readonly<TresCanvasProps> & Readonly<{
-    onRender?: ((renderer: WebGLRenderer) => any) | undefined;
-    onClick?: ((event: TresPointerEvent) => any) | undefined;
-    onWheel?: ((event: TresPointerEvent) => any) | undefined;
+    onRender?: ((renderer: TresRenderer) => any) | undefined;
+    onClick?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onContextmenu?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointermove?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointerenter?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointerleave?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointerover?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointerout?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onDblclick?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointerdown?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointerup?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onPointercancel?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onLostpointercapture?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+    onWheel?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
     onReady?: ((context: TresContext) => any) | undefined;
-    onDoubleClick?: ((event: TresPointerEvent) => any) | undefined;
-    onContextMenu?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerMove?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerUp?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerDown?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerEnter?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerLeave?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerOver?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerOut?: ((event: TresPointerEvent) => any) | undefined;
-    onPointerMissed?: ((event: TresPointerEvent) => any) | undefined;
+    onPointermissed?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
 }>, {
+    toneMapping: THREE.ToneMapping;
     alpha: boolean;
-    antialias: boolean;
+    logarithmicDepthBuffer: boolean;
+    depth: boolean;
     stencil: boolean;
+    windowSize: boolean;
+    clearColor: THREE.ColorRepresentation;
+    shadowMapType: THREE.ShadowMapType;
+    enableProvideBridge: boolean;
+    antialias: boolean;
     preserveDrawingBuffer: boolean;
-    depth: boolean;
     failIfMajorPerformanceCaveat: boolean;
-    logarithmicDepthBuffer: boolean;
+    clearAlpha: number;
     shadows: boolean;
     useLegacyLights: boolean;
-    windowSize: boolean;
     renderMode: "always" | "on-demand" | "manual";
-    enableProvideBridge: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
-    canvas: HTMLCanvasElement;
-}, HTMLCanvasElement>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+    canvasRef: HTMLCanvasElement;
+}, HTMLCanvasElement>, Readonly<{
+    default: () => any;
+}> & {
+    default: () => any;
+}>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {

package/dist/src/composables/index.d.ts

@@ -3,10 +3,8 @@ export * from './useCamera';
 export * from './useGraph';
 export * from './useLoader';
 export * from './useLoop';
-export * from './useRaycaster';
 export * from './useRenderer/useRendererManager';
 export * from './useRenderLoop';
 export * from './useTres';
 export * from './useTresContextProvider';
-export * from './useTresEventManager';
 export { UseLoader };

package/dist/src/composables/useCamera/index.d.ts

@@ -1,31 +1,31 @@
 import { TresContext } from '../useTresContextProvider';
 import { ComputedRef, Ref } from 'vue';
-import { Camera } from 'three';
+import { TresCamera } from '../../types';
 /**
  * Interface for the return value of the useCamera composable
  */
 export interface UseCameraReturn {
-    activeCamera: ComputedRef<Camera | undefined>;
+    activeCamera: ComputedRef<TresCamera>;
     /**
      * The list of cameras
      */
-    cameras: Ref<Camera[]>;
+    cameras: Ref<TresCamera[]>;
     /**
      * Register a camera
      * @param camera - The camera to register
      * @param active - Whether to set the camera as active
      */
-    registerCamera: (camera: Camera, active?: boolean) => void;
+    registerCamera: (camera: TresCamera, active?: boolean) => void;
     /**
      * Deregister a camera
      * @param camera - The camera to deregister
      */
-    deregisterCamera: (camera: Camera) => void;
+    deregisterCamera: (camera: TresCamera) => void;
     /**
      * Set the active camera
      * @param cameraOrUuid - The camera or its UUID to set as active
      */
-    setActiveCamera: (cameraOrUuid: string | Camera) => void;
+    setActiveCamera: (cameraOrUuid: string | TresCamera) => void;
 }
 /**
  * Interface for the parameters of the useCamera composable

package/dist/src/composables/useEventManager/index.d.ts

@@ -0,0 +1,10 @@
+import { PointerEvent, PointerEventsMap } from '@pmndrs/pointer-events';
+import { Event, Object3D, Object3DEventMap } from 'three';
+import { MaybeRef } from 'vue';
+import { TresContext } from '../useTresContextProvider';
+export declare function useEventManager({ canvas, contextParts: { scene, camera, loop }, }: {
+    canvas: MaybeRef<HTMLCanvasElement>;
+    contextParts: Pick<TresContext, 'scene' | 'camera' | 'loop'>;
+}): {
+    onPointerMissed: import('@vueuse/core').EventHookOn<PointerEvent<MouseEvent> & Event<"click", Object3D<Object3DEventMap & PointerEventsMap>>>;
+};

package/dist/src/composables/useRenderer/useRendererManager.d.ts

@@ -1,99 +1,188 @@
-import { ColorSpace, Scene, ShadowMapType, ToneMapping, WebGLRendererParameters, WebGLRenderer } from 'three';
-import { TresColor } from '../../types';
+import { RendererLoop } from './../../core/loop';
+import { ColorRepresentation, ColorSpace, ShadowMapType, ToneMapping, WebGLRenderer } from 'three';
 import { TresContext } from '../useTresContextProvider';
-import { RendererPresetsType } from './const';
-import { MaybeRefOrGetter } from '@vueuse/core';
-import { MaybeRef } from 'vue';
-type TransformToMaybeRefOrGetter<T> = {
-    [K in keyof T]: MaybeRefOrGetter<T[K]> | MaybeRefOrGetter<T[K]>;
-};
+import { MaybeRef, ShallowRef } from 'vue';
+import { Renderer } from 'three/webgpu';
+import { SizesType } from '../useSizes';
+import { UseCameraReturn } from '../useCamera';
+import { TresScene } from '../../types';
 /**
  * If set to 'on-demand', the scene will only be rendered when the current frame is invalidated
  * If set to 'manual', the scene will only be rendered when advance() is called
  * If set to 'always', the scene will be rendered every frame
  */
 export type RenderMode = 'always' | 'on-demand' | 'manual';
-export interface UseRendererOptions extends TransformToMaybeRefOrGetter<WebGLRendererParameters> {
+export type TresRenderer = WebGLRenderer | Renderer;
+export interface RendererOptions {
+    /**
+     * WebGL Context options (Readonly because they are passed to the renderer constructor)
+     * They can't be changed after the renderer is created because they are passed to the canvas context
+     */
+    antialias?: boolean;
+    /**
+     * Enables stencil buffer with 8 bits.
+     * Required for stencil-based operations like shadow volumes or post-processing effects.
+     * @readonly
+     * @default true
+     */
+    stencil?: boolean;
+    /**
+     * Enables depth buffer with at least 16 bits.
+     * Required for proper 3D rendering and depth testing.
+     * @readonly
+     * @default true
+     */
+    depth?: boolean;
+    /**
+     * Sets the shader precision of the renderer.
+     * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}
+     * @default 'highp'
+     */
+    precision?: 'highp' | 'mediump' | 'lowp';
+    /**
+     * Enables logarithmic depth buffer. Useful for scenes with large differences in scale.
+     * Helps prevent z-fighting in scenes with objects very close and very far from the camera.
+     * @readonly
+     * @default false
+     */
+    logarithmicDepthBuffer?: boolean;
+    /**
+     * Preserves the buffers until manually cleared or overwritten.
+     * Needed for screenshots or when reading pixels from the canvas.
+     * Warning: This may impact performance.
+     * @readonly
+     * @default false
+     */
+    preserveDrawingBuffer?: boolean;
+    /**
+     * Power preference for the renderer.
+      * Power preference for the renderer.
+      * - `default`: Automatically chooses the most suitable power setting.
+      * - `high-performance`: Prioritizes rendering performance.
+      * - `low-power`: Tries to reduce power usage.
+     * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}
+     * @default 'default'
+     * @readonly
+     */
+    powerPreference?: WebGLPowerPreference;
+    /**
+       * Whether to create the WebGL context with an alpha buffer.
+       * This is a WebGL context option that must be set during context creation and cannot be changed later.
+       * When true, the canvas can be transparent, showing content behind it.
+       * @readonly
+       * @default false
+       */
+    alpha?: boolean;
+    /**
+     * Whether to premultiply the alpha of the canvas.
+     * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}
+     * @default true
+     */
+    premultipliedAlpha?: boolean;
     /**
-     * Enable shadows in the Renderer
-     *
+     * Whether to fail if the major performance caveat is detected.
+     * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}
      * @default false
      */
-    shadows?: MaybeRefOrGetter<boolean>;
+    failIfMajorPerformanceCaveat?: boolean;
+    /**
+     * WebGL options with set methods
+     * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}
+     */
+    /**
+     * Clear color for the canvas
+     * Can include alpha value (e.g. '#00808000' for fully transparent teal)
+     */
+    clearColor?: ColorRepresentation;
     /**
-     * Set the shadow map type
-     * Can be PCFShadowMap, PCFSoftShadowMap, BasicShadowMap, VSMShadowMap
-     * [see](https://threejs.org/docs/?q=we#api/en/constants/Renderer)
-     *
-     * @default PCFSoftShadowMap
+     * The opacity of the clear color (0-1)
+     * Controls the transparency of the clear color
+     * @default 1
      */
-    shadowMapType?: MaybeRefOrGetter<ShadowMapType>;
+    clearAlpha?: number;
     /**
-     * Whether to use physically correct lighting mode.
-     * See the [lights / physical example](https://threejs.org/examples/#webgl_lights_physical).
-     *
+     * Enable shadow rendering in the scene
      * @default false
-     * @deprecated Use {@link WebGLRenderer.useLegacyLights useLegacyLights} instead.
      */
-    physicallyCorrectLights?: MaybeRefOrGetter<boolean>;
+    shadows?: boolean;
+    /**
+     * Tone mapping technique to use for the scene
+     * - `NoToneMapping`: No tone mapping is applied.
+     * - `LinearToneMapping`: Linear tone mapping.
+     * - `ReinhardToneMapping`: Reinhard tone mapping.
+     * - `CineonToneMapping`: Cineon tone mapping.
+     * - `ACESFilmicToneMapping`: ACES Filmic tone mapping.
+     * - `AgXToneMapping`: AgX tone mapping.
+     * - `NeutralToneMapping`: Neutral tone mapping.
+     * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}
+     * @default ACESFilmicToneMapping (Opinionated default by TresJS)
+     */
+    toneMapping?: ToneMapping;
     /**
-     * Whether to use legacy lighting mode.
-     *
-     * @type {MaybeRefOrGetter<boolean>}
-     * @memberof UseRendererOptions
+     * Type of shadow map to use for shadow calculations
+     * - `BasicShadowMap`: Basic shadow map.
+     * - `PCFShadowMap`: Percentage-Closer Filtering shadow map.
+     * - `PCFSoftShadowMap`: Percentage-Closer Filtering soft shadow map.
+     * - `VSMShadowMap`: Variance shadow map.
+     * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}
+     * @default PCFSoftShadowMap (Opinionated default by TresJS)
      */
-    useLegacyLights?: MaybeRefOrGetter<boolean>;
+    shadowMapType?: ShadowMapType;
     /**
-     * Defines the output encoding of the renderer.
-     * Can be LinearSRGBColorSpace, SRGBColorSpace
-     *
-     * @default LinearSRGBColorSpace
+     * Whether to use legacy lights system instead of the new one
+     * @deprecated Use `useLegacyLights: false` for the new lighting system
      */
-    outputColorSpace?: MaybeRefOrGetter<ColorSpace>;
+    useLegacyLights?: boolean;
     /**
-     * Defines the tone mapping used by the renderer.
-     * Can be NoToneMapping, LinearToneMapping,
-     * ReinhardToneMapping, Uncharted2ToneMapping,
-     * CineonToneMapping, ACESFilmicToneMapping,
-     * CustomToneMapping
-     *
-     * @default ACESFilmicToneMapping
+     * Color space for the output render
+     * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}
      */
-    toneMapping?: MaybeRefOrGetter<ToneMapping>;
+    outputColorSpace?: ColorSpace;
     /**
-     * Defines the tone mapping exposure used by the renderer.
-     *
+     * Exposure level of tone mapping
      * @default 1
      */
-    toneMappingExposure?: MaybeRefOrGetter<number>;
+    toneMappingExposure?: number;
+    /**
+     * Rendering mode for the canvas
+     * - 'always': Renders every frame
+     * - 'on-demand': Renders only when changes are detected
+     * - 'manual': Renders only when explicitly called
+     * @default 'always'
+     */
+    renderMode?: 'always' | 'on-demand' | 'manual';
     /**
-     * The color value to use when clearing the canvas.
-     *
-     * @default 0x000000
+     * Device Pixel Ratio for the renderer
+     * Can be a single number or a tuple defining a range [min, max]
      */
-    clearColor?: MaybeRefOrGetter<TresColor>;
-    windowSize?: MaybeRefOrGetter<boolean | string>;
-    preset?: MaybeRefOrGetter<RendererPresetsType>;
-    renderMode?: MaybeRef<RenderMode>;
+    dpr?: number | [number, number];
     /**
-     * A `number` sets the renderer's device pixel ratio.
-     * `[number, number]` clamp's the renderer's device pixel ratio.
+     * Custom WebGL renderer instance
+     * Allows using a pre-configured renderer instead of creating a new one
      */
-    dpr?: MaybeRefOrGetter<number | [number, number]>;
+    renderer?: (ctx: TresRendererSetupContext) => TresRenderer;
+}
+export interface TresRendererSetupContext {
+    sizes: SizesType;
+    scene: ShallowRef<TresScene>;
+    camera: UseCameraReturn;
+    loop: RendererLoop;
+    canvas: MaybeRef<HTMLCanvasElement>;
 }
-export declare function useRendererManager({ scene, canvas, options, contextParts: { sizes, loop, camera }, }: {
-    scene: Scene;
+export interface UseRendererOptions {
+    scene: ShallowRef<TresScene>;
     canvas: MaybeRef<HTMLCanvasElement>;
-    options: UseRendererOptions;
+    options: RendererOptions;
     contextParts: Pick<TresContext, 'sizes' | 'camera' | 'loop'>;
-}): {
-    instance: import('vue').ShallowRef<WebGLRenderer, WebGLRenderer>;
-    isReady: Readonly<import('vue').Ref<boolean, boolean>>;
+}
+export declare function useRendererManager({ scene, canvas, options, contextParts: { sizes, loop, camera }, }: UseRendererOptions): {
+    instance: TresRenderer;
     advance: () => void;
-    onRender: import('@vueuse/core').EventHook<WebGLRenderer>;
+    onRender: import('@vueuse/core').EventHookOn<TresRenderer>;
+    onReady: import('@vueuse/core').EventHookOn<TresRenderer>;
     invalidate: (amountOfFramesToInvalidate?: number) => void;
     canBeInvalidated: import('vue').ComputedRef<boolean>;
-    amountOfFramesToRender: import('vue').Ref<number, number>;
+    frames: import('vue').Ref<number, number>;
+    mode: "always" | "on-demand" | "manual" | undefined;
 };
 export type UseRendererManagerReturn = ReturnType<typeof useRendererManager>;
-export {};

package/dist/src/composables/useTres/index.d.ts

@@ -1,14 +1,15 @@
 import { ComputedRef } from 'vue';
 import { TresContext } from '../useTresContextProvider';
-import { Camera, WebGLRenderer } from 'three';
+import { Camera } from 'three';
+import { TresRenderer } from '..';
 export interface TresPartialContext extends Omit<TresContext, 'renderer' | 'camera'> {
     /**
      * The renderer instance
      *
-     * @type {WebGLRenderer}
+     * @type {TresRenderer}
      * @memberof TresPartialContext
      */
-    renderer: WebGLRenderer;
+    renderer: TresRenderer;
     /**
      * The current active camera
      *

package/dist/src/composables/useTresContextProvider/index.d.ts

@@ -1,11 +1,10 @@
-import { Raycaster } from 'three';
 import { MaybeRef, MaybeRefOrGetter, Ref, ShallowRef } from 'vue';
 import { RendererLoop } from '../../core/loop';
-import { TresControl, TresObject, TresScene } from '../../types';
-import { UseRendererManagerReturn, UseRendererOptions } from '../useRenderer/useRendererManager';
+import { TresControl, TresScene } from '../../types';
+import { RendererOptions, UseRendererManagerReturn } from '../useRenderer/useRendererManager';
 import { UseCameraReturn } from '../useCamera/';
 import { SizesType } from '../useSizes';
-import { TresEventManager } from '../useTresEventManager';
+import { useEventManager } from '../useEventManager';
 export interface TresContext {
     scene: ShallowRef<TresScene>;
     sizes: SizesType;
@@ -13,18 +12,13 @@ export interface TresContext {
     camera: UseCameraReturn;
     controls: Ref<TresControl | null>;
     renderer: UseRendererManagerReturn;
-    raycaster: ShallowRef<Raycaster>;
     loop: RendererLoop;
-    eventManager?: TresEventManager;
-    registerObjectAtPointerEventHandler?: (object: TresObject) => void;
-    deregisterObjectAtPointerEventHandler?: (object: TresObject) => void;
-    registerBlockingObjectAtPointerEventHandler?: (object: TresObject) => void;
-    deregisterBlockingObjectAtPointerEventHandler?: (object: TresObject) => void;
+    events: ReturnType<typeof useEventManager>;
 }
 export declare function useTresContextProvider({ scene, canvas, windowSize, rendererOptions, }: {
     scene: TresScene;
     canvas: MaybeRef<HTMLCanvasElement>;
     windowSize: MaybeRefOrGetter<boolean>;
-    rendererOptions: UseRendererOptions;
+    rendererOptions: RendererOptions;
 }): TresContext;
 export declare function useTresContext(): TresContext;

package/dist/src/types/index.d.ts

@@ -1,5 +1,6 @@
 import { DefineComponent, VNode, VNodeRef } from 'vue';
 import { TresContext } from '../composables/useTresContextProvider';
+import { PointerEventHandlers } from '../utils/pointerEvents';
 import type * as THREE from 'three';
 export type AttachFnType = (parent: any, self: TresInstance) => () => void;
 export type AttachType = string | AttachFnType;
@@ -17,13 +18,6 @@ export type Args<T> = T extends ConstructorRepresentation ? ConstructorParameter
 export interface TresCatalogue {
     [name: string]: ConstructorRepresentation;
 }
-export declare const pointerEventTypes: readonly ["click", "double-click", "context-menu", "pointer-move", "pointer-up", "pointer-down", "pointer-enter", "pointer-leave", "pointer-over", "pointer-out", "pointer-missed", "wheel"];
-export type PointerEventType = typeof pointerEventTypes[number];
-export interface TresPointerEvent {
-    type: PointerEventType;
-    event: TresEvent;
-    intersection?: Intersection;
-}
 export type TresCamera = THREE.OrthographicCamera | THREE.PerspectiveCamera;
 /**
  * Represents the properties of an instance.
@@ -45,9 +39,7 @@ interface TresBaseObject {
 }
 export interface LocalState {
     type: string;
-    eventCount: number;
     root: TresContext;
-    handlers: Partial<EventHandlers>;
     memoizedProps: {
         [key: string]: any;
     };
@@ -77,69 +69,6 @@ export interface TresScene extends THREE.Scene {
         root: TresContext;
     };
 }
-export interface Intersection extends THREE.Intersection {
-    /** The event source (the object which registered the handler) */
-    eventObject: TresObject;
-}
-export interface IntersectionEvent<TSourceEvent> extends Intersection {
-    /** The event source (the object which registered the handler) */
-    eventObject: TresObject;
-    /** An array of intersections */
-    intersections: Intersection[];
-    /** vec3.set(pointer.x, pointer.y, 0).unproject(camera) */
-    unprojectedPoint: THREE.Vector3;
-    /** Normalized event coordinates */
-    pointer: THREE.Vector2;
-    /** Delta between first click and this event */
-    delta: number;
-    /** The ray that pierced it */
-    ray: THREE.Ray;
-    /** The camera that was used by the raycaster */
-    camera: THREE.Camera;
-    /** stopPropagation will stop underlying handlers from firing */
-    stopPropagation: () => void;
-    /** The original host event */
-    nativeEvent: TSourceEvent;
-    /** If the event was stopped by calling stopPropagation */
-    stopped: boolean;
-}
-export type ThreeEvent<TEvent> = IntersectionEvent<TEvent> & Properties<TEvent>;
-export type DomEvent = PointerEvent | MouseEvent | WheelEvent;
-export interface TresEvent {
-    eventObject: TresObject;
-    event: DomEvent;
-    stopPropagation: () => void;
-    stopPropagating: boolean;
-    intersections: Intersection[];
-    intersects: Intersection[];
-}
-export interface Events {
-    onClick: EventListener;
-    onContextMenu: EventListener;
-    onDoubleClick: EventListener;
-    onWheel: EventListener;
-    onPointerDown: EventListener;
-    onPointerUp: EventListener;
-    onPointerLeave: EventListener;
-    onPointerMove: EventListener;
-    onPointerCancel: EventListener;
-    onLostPointerCapture: EventListener;
-}
-export interface EventHandlers {
-    onClick?: (event: ThreeEvent<MouseEvent>) => void;
-    onContextMenu?: (event: ThreeEvent<MouseEvent>) => void;
-    onDoubleClick?: (event: ThreeEvent<MouseEvent>) => void;
-    onPointerUp?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerDown?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerOver?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerOut?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerEnter?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerLeave?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerMove?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerMissed?: (event: MouseEvent) => void;
-    onPointerCancel?: (event: ThreeEvent<PointerEvent>) => void;
-    onWheel?: (event: ThreeEvent<WheelEvent>) => void;
-}
 interface MathRepresentation {
     set(...args: number[] | [THREE.ColorRepresentation]): any;
 }
@@ -170,7 +99,8 @@ export type WithMathProps<P> = {
 interface RaycastableRepresentation {
     raycast: (raycaster: THREE.Raycaster, intersects: THREE.Intersection[]) => void;
 }
-type EventProps<P> = P extends RaycastableRepresentation ? Partial<EventHandlers> : unknown;
+type EventProps<P> = P extends RaycastableRepresentation ? Partial<PointerEventHandlers> : unknown;
+export type { TresPointerEvent } from '../utils/pointerEvents';
 export interface VueProps {
     children?: VNode[];
     ref?: VNodeRef;
@@ -195,4 +125,3 @@ declare module 'vue' {
         primitive: DefineComponent<TresPrimitive>;
     }
 }
-export {};

package/dist/src/utils/pointerEvents.d.ts

@@ -0,0 +1,10 @@
+import { PointerEvent } from '@pmndrs/pointer-events';
+export declare const supportedPointerEvents: readonly ["onClick", "onContextmenu", "onPointermove", "onPointerenter", "onPointerleave", "onPointerover", "onPointerout", "onDblclick", "onPointerdown", "onPointerup", "onPointercancel", "onLostpointercapture", "onWheel"];
+export type SupportedVuePointerEvent = typeof supportedPointerEvents[number];
+export type TresPointerEventName = 'click' | 'contextmenu' | 'pointermove' | 'pointerenter' | 'pointerleave' | 'pointerover' | 'pointerout' | 'dblclick' | 'pointerdown' | 'pointerup' | 'pointercancel' | 'lostpointercapture' | 'wheel';
+export declare const pointerEventsMapVueToThree: Record<SupportedVuePointerEvent, TresPointerEventName>;
+export declare const isSupportedPointerEvent: (event: string) => event is SupportedVuePointerEvent;
+export type TresPointerEvent = PointerEvent<MouseEvent>;
+export type PointerEventHandlers = {
+    [key in SupportedVuePointerEvent]: (event: TresPointerEvent) => void;
+};