@tresjs/core 3.7.0 → 4.0.0-next.1

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

@@ -10,6 +10,7 @@ export interface TresCanvasProps extends Omit<WebGLRendererParameters, 'canvas'>
     useLegacyLights?: boolean;
     outputColorSpace?: ColorSpace;
     toneMappingExposure?: number;
+    renderMode?: 'always' | 'on-demand' | 'manual';
     camera?: TresCamera;
     preset?: RendererPresetsType;
     windowSize?: boolean;
@@ -27,10 +28,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     preserveDrawingBuffer: undefined;
     logarithmicDepthBuffer: undefined;
     failIfMajorPerformanceCaveat: undefined;
+    renderMode: string;
 }>, {
     context: import("vue").ShallowRef<TresContext | null>;
     dispose: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<TresCanvasProps>, {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    render: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<TresCanvasProps>, {
     alpha: undefined;
     depth: undefined;
     shadows: undefined;
@@ -42,7 +46,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     preserveDrawingBuffer: undefined;
     logarithmicDepthBuffer: undefined;
     failIfMajorPerformanceCaveat: undefined;
-}>>>, {
+    renderMode: string;
+}>>> & {
+    onRender?: ((...args: any[]) => any) | undefined;
+}, {
     alpha: boolean;
     antialias: boolean;
     stencil: boolean;
@@ -53,6 +60,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     shadows: boolean;
     useLegacyLights: boolean;
     windowSize: boolean;
+    renderMode: "always" | "on-demand" | "manual";
     disableRender: boolean;
 }, {}>, Readonly<{
     default(): any;

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

@@ -1054,6 +1054,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             }[];
             userData: Record<string, any>;
             customDepthMaterial?: {
+                readonly isMaterial: true;
                 alphaHash: boolean;
                 alphaTest: number;
                 alphaToCoverage: boolean;
@@ -1238,7 +1239,6 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 stencilFail: import("three").StencilOp;
                 stencilZFail: import("three").StencilOp;
                 stencilZPass: import("three").StencilOp;
-                readonly isMaterial: true;
                 name: string;
                 needsUpdate: boolean;
                 opacity: number;
@@ -1262,7 +1262,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 clone: () => import("three").Material;
                 copy: (material: import("three").Material) => import("three").Material;
                 dispose: () => void;
-                onBeforeCompile: (shader: import("three").Shader, renderer: import("three").WebGLRenderer) => void;
+                onBeforeCompile: (parameters: import("three").WebGLProgramParametersWithUniforms, renderer: import("three").WebGLRenderer) => void;
                 customProgramCacheKey: () => string;
                 setValues: (values: import("three").MaterialParameters) => void;
                 toJSON: (meta?: any) => any;
@@ -1289,6 +1289,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 }[T_6]) => void;
             } | undefined;
             customDistanceMaterial?: {
+                readonly isMaterial: true;
                 alphaHash: boolean;
                 alphaTest: number;
                 alphaToCoverage: boolean;
@@ -1473,7 +1474,6 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 stencilFail: import("three").StencilOp;
                 stencilZFail: import("three").StencilOp;
                 stencilZPass: import("three").StencilOp;
-                readonly isMaterial: true;
                 name: string;
                 needsUpdate: boolean;
                 opacity: number;
@@ -1497,7 +1497,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 clone: () => import("three").Material;
                 copy: (material: import("three").Material) => import("three").Material;
                 dispose: () => void;
-                onBeforeCompile: (shader: import("three").Shader, renderer: import("three").WebGLRenderer) => void;
+                onBeforeCompile: (parameters: import("three").WebGLProgramParametersWithUniforms, renderer: import("three").WebGLRenderer) => void;
                 customProgramCacheKey: () => string;
                 setValues: (values: import("three").MaterialParameters) => void;
                 toJSON: (meta?: any) => any;
@@ -2442,6 +2442,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             }[];
             userData: Record<string, any>;
             customDepthMaterial?: {
+                readonly isMaterial: true;
                 alphaHash: boolean;
                 alphaTest: number;
                 alphaToCoverage: boolean;
@@ -2626,7 +2627,6 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 stencilFail: import("three").StencilOp;
                 stencilZFail: import("three").StencilOp;
                 stencilZPass: import("three").StencilOp;
-                readonly isMaterial: true;
                 name: string;
                 needsUpdate: boolean;
                 opacity: number;
@@ -2650,7 +2650,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 clone: () => import("three").Material;
                 copy: (material: import("three").Material) => import("three").Material;
                 dispose: () => void;
-                onBeforeCompile: (shader: import("three").Shader, renderer: import("three").WebGLRenderer) => void;
+                onBeforeCompile: (parameters: import("three").WebGLProgramParametersWithUniforms, renderer: import("three").WebGLRenderer) => void;
                 customProgramCacheKey: () => string;
                 setValues: (values: import("three").MaterialParameters) => void;
                 toJSON: (meta?: any) => any;
@@ -2677,6 +2677,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 }[T_6]) => void;
             } | undefined;
             customDistanceMaterial?: {
+                readonly isMaterial: true;
                 alphaHash: boolean;
                 alphaTest: number;
                 alphaToCoverage: boolean;
@@ -2861,7 +2862,6 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 stencilFail: import("three").StencilOp;
                 stencilZFail: import("three").StencilOp;
                 stencilZPass: import("three").StencilOp;
-                readonly isMaterial: true;
                 name: string;
                 needsUpdate: boolean;
                 opacity: number;
@@ -2885,7 +2885,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
                 clone: () => import("three").Material;
                 copy: (material: import("three").Material) => import("three").Material;
                 dispose: () => void;
-                onBeforeCompile: (shader: import("three").Shader, renderer: import("three").WebGLRenderer) => void;
+                onBeforeCompile: (parameters: import("three").WebGLProgramParametersWithUniforms, renderer: import("three").WebGLRenderer) => void;
                 customProgramCacheKey: () => string;
                 setValues: (values: import("three").MaterialParameters) => void;
                 toJSON: (meta?: any) => any;
@@ -3811,6 +3811,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
         }[];
         userData: Record<string, any>;
         customDepthMaterial?: {
+            readonly isMaterial: true;
             alphaHash: boolean;
             alphaTest: number;
             alphaToCoverage: boolean;
@@ -3995,7 +3996,6 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             stencilFail: import("three").StencilOp;
             stencilZFail: import("three").StencilOp;
             stencilZPass: import("three").StencilOp;
-            readonly isMaterial: true;
             name: string;
             needsUpdate: boolean;
             opacity: number;
@@ -4019,7 +4019,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             clone: () => import("three").Material;
             copy: (material: import("three").Material) => import("three").Material;
             dispose: () => void;
-            onBeforeCompile: (shader: import("three").Shader, renderer: import("three").WebGLRenderer) => void;
+            onBeforeCompile: (parameters: import("three").WebGLProgramParametersWithUniforms, renderer: import("three").WebGLRenderer) => void;
             customProgramCacheKey: () => string;
             setValues: (values: import("three").MaterialParameters) => void;
             toJSON: (meta?: any) => any;
@@ -4046,6 +4046,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             }[T_6]) => void;
         } | undefined;
         customDistanceMaterial?: {
+            readonly isMaterial: true;
             alphaHash: boolean;
             alphaTest: number;
             alphaToCoverage: boolean;
@@ -4230,7 +4231,6 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             stencilFail: import("three").StencilOp;
             stencilZFail: import("three").StencilOp;
             stencilZPass: import("three").StencilOp;
-            readonly isMaterial: true;
             name: string;
             needsUpdate: boolean;
             opacity: number;
@@ -4254,7 +4254,7 @@ export declare const useCamera: ({ sizes, scene }: Pick<TresContext, "sizes"> &
             clone: () => import("three").Material;
             copy: (material: import("three").Material) => import("three").Material;
             dispose: () => void;
-            onBeforeCompile: (shader: import("three").Shader, renderer: import("three").WebGLRenderer) => void;
+            onBeforeCompile: (parameters: import("three").WebGLProgramParametersWithUniforms, renderer: import("three").WebGLRenderer) => void;
             customProgramCacheKey: () => string;
             setValues: (values: import("three").MaterialParameters) => void;
             toJSON: (meta?: any) => any;

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

@@ -1,19 +1,17 @@
-import type { Intersection, Event, Object3D } from 'three';
-import type { TresScene } from 'src/types';
+import type { Intersection, Object3D, Object3DEventMap } from 'three';
 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;
     onPointerEnter?: CallbackFn;
     onPointerMove?: CallbackFn;
     onPointerLeave?: CallbackFnPointerLeave;
 }
-export declare const usePointerEventHandler: ({ scene, contextParts }: {
-    scene: TresScene;
-    contextParts: Pick<TresContext, 'renderer' | 'camera' | 'raycaster'>;
-}) => {
+export declare const usePointerEventHandler: (ctx: TresContext) => {
     registerObject: (object: Object3D & EventProps) => void;
     deregisterObject: (object: Object3D) => void;
+    registerBlockingObject: (object: Object3D) => void;
+    deregisterBlockingObject: (object: Object3D) => void;
 };
 export {};

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

@@ -1,7 +1,7 @@
-import type { Object3D, type Intersection } from 'three';
+import type { Object3D, Intersection } from 'three';
 import type { Ref } from 'vue';
 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;
@@ -10,7 +10,7 @@ interface PointerClickEventPayload {
     intersects: Intersects;
     event: PointerEvent;
 }
-export declare const useRaycaster: (objects: Ref<THREE.Object3D[]>, { renderer, camera, raycaster }: Pick<TresContext, 'renderer' | 'camera' | 'raycaster'>) => {
+export declare const useRaycaster: (objects: Ref<THREE.Object3D[]>, ctx: TresContext) => {
     intersects: import("vue").ComputedRef<Intersects>;
     onClick: (fn: (value: PointerClickEventPayload) => void) => () => void;
     onPointerMove: (fn: (value: PointerMoveEventPayload) => void) => () => void;

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

@@ -10,5 +10,9 @@ export declare const rendererPresets: {
             type: 2;
         };
     };
+    flat: {
+        toneMapping: 0;
+        toneMappingExposure: number;
+    };
 };
 export type RendererPresetsType = keyof typeof rendererPresets;

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

@@ -52,7 +52,7 @@ export interface UseRendererOptions extends TransformToMaybeRefOrGetter<WebGLRen
      * CineonToneMapping, ACESFilmicToneMapping,
      * CustomToneMapping
      *
-     * @default NoToneMapping
+     * @default ACESFilmicToneMapping
      */
     toneMapping?: MaybeRefOrGetter<ToneMapping>;
     /**
@@ -69,6 +69,7 @@ export interface UseRendererOptions extends TransformToMaybeRefOrGetter<WebGLRen
     clearColor?: MaybeRefOrGetter<TresColor>;
     windowSize?: MaybeRefOrGetter<boolean | string>;
     preset?: MaybeRefOrGetter<RendererPresetsType>;
+    renderMode?: MaybeRefOrGetter<'always' | 'on-demand' | 'manual'>;
 }
 /**
  * Reactive three.js WebGLRenderer instance
@@ -76,11 +77,15 @@ export interface UseRendererOptions extends TransformToMaybeRefOrGetter<WebGLRen
  * @param canvas
  * @param {UseRendererOptions} [options]
  */
-export declare function useRenderer({ scene, canvas, options, disableRender, contextParts: { sizes, camera }, }: {
+export declare function useRenderer({ scene, canvas, options, disableRender, emit, contextParts: { sizes, camera, render, invalidate, advance }, }: {
     canvas: MaybeRef<HTMLCanvasElement>;
     scene: Scene;
     options: UseRendererOptions;
-    contextParts: Pick<TresContext, 'sizes' | 'camera'>;
+    emit: (event: string, ...args: any[]) => void;
+    contextParts: Pick<TresContext, 'sizes' | 'camera' | 'render'> & {
+        invalidate: () => void;
+        advance: () => void;
+    };
     disableRender: MaybeRefOrGetter<boolean>;
 }): {
     renderer: import("vue").ShallowRef<WebGLRenderer>;

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

@@ -0,0 +1,11 @@
+import type { MaybeRefOrGetter, MaybeRef, ComputedRef, Ref } from 'vue';
+export interface SizesType {
+    height: Readonly<Ref<number>>;
+    width: Readonly<Ref<number>>;
+    aspectRatio: ComputedRef<number>;
+}
+export default function useSizes(windowSize: MaybeRefOrGetter<boolean>, canvas: MaybeRef<HTMLCanvasElement>, debounceMs?: number): {
+    height: Readonly<Ref<number>>;
+    width: Readonly<Ref<number>>;
+    aspectRatio: ComputedRef<number>;
+};

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

@@ -1,14 +1,42 @@
-import type { Camera, EventDispatcher, Scene, WebGLRenderer } from 'three';
+import type { Camera, EventDispatcher, Object3D, WebGLRenderer } from 'three';
 import { Raycaster } from 'three';
 import type { ComputedRef, DeepReadonly, MaybeRef, MaybeRefOrGetter, Ref, ShallowRef } from 'vue';
 import type { UseRendererOptions } from '../useRenderer';
-export interface TresContext {
-    scene: ShallowRef<Scene>;
-    sizes: {
-        height: Ref<number>;
-        width: Ref<number>;
-        aspectRatio: ComputedRef<number>;
+import type { TresScene } from '../../types';
+import type { EventProps } from '../usePointerEventHandler';
+import { type SizesType } from '../useSizes';
+export interface InternalState {
+    priority: Ref<number>;
+    frames: Ref<number>;
+    maxFrames: number;
+}
+export interface RenderState {
+    /**
+     * 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
+     */
+    mode: Ref<'always' | 'on-demand' | 'manual'>;
+    priority: Ref<number>;
+    frames: Ref<number>;
+    maxFrames: number;
+    canBeInvalidated: ComputedRef<boolean>;
+}
+export interface PerformanceState {
+    maxFrames: number;
+    fps: {
+        value: number;
+        accumulator: number[];
+    };
+    memory: {
+        currentMem: number;
+        allocatedMem: number;
+        accumulator: number[];
     };
+}
+export interface TresContext {
+    scene: ShallowRef<TresScene>;
+    sizes: SizesType;
     extend: (objects: any) => void;
     camera: ComputedRef<Camera | undefined>;
     cameras: DeepReadonly<Ref<Camera[]>>;
@@ -17,28 +45,31 @@ export interface TresContext {
     }) | null>;
     renderer: ShallowRef<WebGLRenderer>;
     raycaster: ShallowRef<Raycaster>;
-    perf: {
-        maxFrames: number;
-        fps: {
-            value: number;
-            accumulator: number[];
-        };
-        memory: {
-            currentMem: number;
-            allocatedMem: number;
-            accumulator: number[];
-        };
-    };
+    perf: PerformanceState;
+    render: RenderState;
+    /**
+     * Invalidates the current frame when renderMode === 'on-demand'
+     */
+    invalidate: () => void;
+    /**
+       * Advance one frame when renderMode === 'manual'
+       */
+    advance: () => void;
     registerCamera: (camera: Camera) => void;
     setCameraActive: (cameraOrUuid: Camera | string) => void;
     deregisterCamera: (camera: Camera) => void;
+    registerObjectAtPointerEventHandler: (object: Object3D & EventProps) => void;
+    deregisterObjectAtPointerEventHandler: (object: Object3D) => void;
+    registerBlockingObjectAtPointerEventHandler: (object: Object3D) => void;
+    deregisterBlockingObjectAtPointerEventHandler: (object: Object3D) => void;
 }
-export declare function useTresContextProvider({ scene, canvas, windowSize, disableRender, rendererOptions, }: {
-    scene: Scene;
+export declare function useTresContextProvider({ scene, canvas, windowSize, disableRender, rendererOptions, emit, }: {
+    scene: TresScene;
     canvas: MaybeRef<HTMLCanvasElement>;
     windowSize: MaybeRefOrGetter<boolean>;
     disableRender: MaybeRefOrGetter<boolean>;
     rendererOptions: UseRendererOptions;
+    emit: (event: string, ...args: any[]) => void;
 }): TresContext;
 export declare function useTresContext(): TresContext;
 export declare const useTres: typeof useTresContext;

package/dist/src/core/nodeOps.d.ts

@@ -1,3 +1,4 @@
-import type { RendererOptions } from 'vue';
+import { type RendererOptions } from 'vue';
 import type { TresObject } from '../types';
-export declare const nodeOps: RendererOptions<TresObject, TresObject>;
+export declare function invalidateInstance(instance: TresObject): void;
+export declare const nodeOps: () => RendererOptions<TresObject, TresObject | null>;

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

@@ -1,6 +1,6 @@
 import type { DefineComponent, VNode, VNodeRef } from 'vue';
 import type * as THREE from 'three';
-import type { EventProps as PointerEventHandlerEventProps } from '../composables/usePointerEventHandler';
+import type { TresContext } from '../composables/useTresContextProvider';
 export type AttachFnType<O = any> = (parent: any, self: O) => () => void;
 export type AttachType<O = any> = string | AttachFnType<O>;
 export type ConstructorRepresentation = new (...args: any[]) => any;
@@ -30,25 +30,29 @@ interface TresBaseObject {
     dispose?: () => void;
     [prop: string]: any;
 }
-export interface TresObject3D extends THREE.Object3D {
-    geometry?: THREE.BufferGeometry & TresBaseObject;
-    material?: THREE.Material & TresBaseObject;
-    userData: {
-        tres__materialViaProp: boolean;
-        tres__geometryViaProp: boolean;
+export interface LocalState {
+    type: string;
+    objects: TresObject3D[];
+    parent: TresObject3D | null;
+    primitive?: boolean;
+    eventCount: number;
+    handlers: Partial<EventHandlers>;
+    memoizedProps: {
         [key: string]: any;
     };
+    disposable: boolean;
+    root: TresContext;
 }
-export type TresObject = TresBaseObject & (TresObject3D | THREE.BufferGeometry | THREE.Material | THREE.Fog);
+export interface TresObject3D extends THREE.Object3D<THREE.Object3DEventMap> {
+    geometry?: THREE.BufferGeometry & TresBaseObject;
+    material?: THREE.Material & TresBaseObject;
+}
+export type TresObject = TresBaseObject & (TresObject3D | THREE.BufferGeometry | THREE.Material | THREE.Fog) & {
+    __tres: LocalState;
+};
 export interface TresScene extends THREE.Scene {
-    userData: {
-        tres__registerCamera?: (newCamera: THREE.Camera, active?: boolean) => void;
-        tres__deregisterCamera?: (camera: THREE.Camera) => void;
-        tres__registerAtPointerEventHandler?: (object: THREE.Object3D & PointerEventHandlerEventProps) => void;
-        tres__deregisterAtPointerEventHandler?: (object: THREE.Object3D) => void;
-        tres__registerBlockingObjectAtPointerEventHandler?: (object: THREE.Object3D) => void;
-        tres__deregisterBlockingObjectAtPointerEventHandler?: (object: THREE.Object3D) => void;
-        [key: string]: any;
+    __tres: {
+        root: TresContext;
     };
 }
 export interface Intersection extends THREE.Intersection {