@tresjs/core 5.6.0 → 5.7.0

package/dist/template-compiler-options.d.mts

@@ -1,6 +1,6 @@
 /**
   * name: @tresjs/core
-  * version: v5.6.0
+  * version: v5.7.0
   * (c) 2026
   * description: Declarative ThreeJS using Vue Components
   * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)

package/dist/template-compiler-options.mjs

@@ -1,6 +1,6 @@
 /**
   * name: @tresjs/core
-  * version: v5.6.0
+  * version: v5.7.0
   * (c) 2026
   * description: Declarative ThreeJS using Vue Components
   * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)

package/dist/tres.d.ts

@@ -1,11 +1,11 @@
 /**
   * name: @tresjs/core
-  * version: v5.6.0
+  * version: v5.7.0
   * (c) 2026
   * description: Declarative ThreeJS using Vue Components
   * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
   */
-import * as vue15 from "vue";
+import * as vue4 from "vue";
 import { App, ComputedRef, DefineComponent, MaybeRef, MaybeRefOrGetter, Reactive, Ref, ShallowRef, VNode, VNodeRef } from "vue";
 import * as THREE from "three";
 import { BufferGeometry, Camera, Color, ColorRepresentation, ColorSpace, Event, Fog, Group, Layers, Light, Loader, LoadingManager, Material, Mesh, Object3D, Object3DEventMap, OrthographicCamera, PerspectiveCamera, Scene, ShadowMapType, ToneMapping, Vector3, WebGLRenderer } from "three";
@@ -321,11 +321,11 @@ declare function useRendererManager({
   onRender: _vueuse_core0.EventHookOn<TresRenderer>;
   onError: _vueuse_core0.EventHookOn<TresRendererError>;
   invalidate: (amountOfFramesToInvalidate?: number) => void;
-  canBeInvalidated: vue15.ComputedRef<boolean>;
+  canBeInvalidated: vue4.ComputedRef<boolean>;
   mode: "always" | "on-demand" | "manual" | undefined;
   replaceRenderFunction: (fn: RenderFunction) => void;
-  isInitialized: vue15.Ref<boolean, boolean>;
-  error: vue15.Ref<TresRendererError | null, TresRendererError | null>;
+  isInitialized: vue4.Ref<boolean, boolean>;
+  error: vue4.Ref<TresRendererError | null, TresRendererError | null>;
 };
 type UseRendererManagerReturn = ReturnType<typeof useRendererManager>;
 //#endregion
@@ -512,7 +512,7 @@ declare function buildGraph(object: Object3D | TresObject): TresObjectMap;
 //#endregion
 //#region src/composables/useLoader/component.vue.d.ts
 declare const __VLS_export$2: <T extends TresObjectMap>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-  props: vue15.PublicProps & __VLS_PrettifyLocal<{
+  props: vue4.PublicProps & __VLS_PrettifyLocal<{
     /**
      * The THREE.js loader to use
      */
@@ -526,8 +526,8 @@ declare const __VLS_export$2: <T extends TresObjectMap>(__VLS_props: NonNullable
      */
     manager?: LoadingManager;
   } & {
-    onError?: ((error: unknown) => any) | undefined;
     onLoaded?: ((result: T) => any) | undefined;
+    onError?: ((error: unknown) => any) | undefined;
   }> & (typeof globalThis extends {
     __VLS_PROPS_FALLBACK: infer P;
   } ? P : {});
@@ -535,20 +535,20 @@ declare const __VLS_export$2: <T extends TresObjectMap>(__VLS_props: NonNullable
   attrs: any;
   slots: {
     default?: (props: {
-      state: vue15.UnwrapRef<T>;
+      state: vue4.UnwrapRef<T>;
       isLoading: boolean;
       error: unknown;
     }) => any;
   };
-  emit: ((evt: "error", error: unknown) => void) & ((evt: "loaded", result: T) => void);
-}>) => vue15.VNode & {
+  emit: ((evt: "loaded", result: T) => void) & ((evt: "error", error: unknown) => void);
+}>) => vue4.VNode & {
   __ctx?: Awaited<typeof __VLS_setup>;
 };
 declare const _default$2: typeof __VLS_export$2;
 type __VLS_PrettifyLocal<T> = (T extends any ? { [K in keyof T]: T[K] } : { [K in keyof T as K]: T[K] }) & {};
 //#endregion
 //#region src/composables/useGraph/index.d.ts
-declare const useGraph: (object: MaybeRef$1<TresObject | undefined>) => vue15.ComputedRef<TresObjectMap | undefined>;
+declare const useGraph: (object: MaybeRef$1<TresObject | undefined>) => vue4.ComputedRef<TresObjectMap | undefined>;
 //#endregion
 //#region src/utils/createPriorityEventHook.d.ts
 type Callback<T> = Parameters<EventHookOff<T>>[0];
@@ -599,7 +599,7 @@ type LoopContext = RafLoopContext & TresPartialContext;
 declare const useLoop: () => {
   stop: () => void;
   start: () => void;
-  isActive: Readonly<vue15.ShallowRef<boolean>>;
+  isActive: Readonly<vue4.ShallowRef<boolean>>;
   onBeforeRender: PriorityEventHookOn<LoopContext>;
   onRender: PriorityEventHookOn<LoopContext>;
   render: (fn: RenderFunction) => void;
@@ -701,10 +701,10 @@ type __VLS_Props = ContextProps & {
 type __VLS_Slots$1 = {
   default: () => any;
 };
-declare const __VLS_base$1: vue15.DefineComponent<__VLS_Props, {
-  context: vue15.ShallowRef<TresContext, TresContext>;
+declare const __VLS_base$1: vue4.DefineComponent<__VLS_Props, {
+  context: vue4.ShallowRef<TresContext, TresContext>;
   dispose: () => void;
-}, {}, {}, {}, vue15.ComponentOptionsMixin, vue15.ComponentOptionsMixin, {
+}, {}, {}, {}, vue4.ComponentOptionsMixin, vue4.ComponentOptionsMixin, {
   click: (event: TresPointerEvent) => any;
   contextmenu: (event: TresPointerEvent) => any;
   pointermove: (event: TresPointerEvent) => any;
@@ -718,13 +718,13 @@ declare const __VLS_base$1: vue15.DefineComponent<__VLS_Props, {
   pointercancel: (event: TresPointerEvent) => any;
   lostpointercapture: (event: TresPointerEvent) => any;
   wheel: (event: TresPointerEvent) => any;
-  ready: (context: TresContext) => any;
   error: (error: Error) => any;
+  ready: (context: TresContext) => any;
   pointermissed: (event: TresPointerEvent) => any;
   render: (context: TresContext) => any;
   beforeLoop: (context: TresContextWithClock) => any;
   loop: (context: TresContextWithClock) => any;
-}, string, vue15.PublicProps, Readonly<__VLS_Props> & Readonly<{
+}, string, vue4.PublicProps, Readonly<__VLS_Props> & Readonly<{
   onClick?: ((event: TresPointerEvent) => any) | undefined;
   onContextmenu?: ((event: TresPointerEvent) => any) | undefined;
   onPointermove?: ((event: TresPointerEvent) => any) | undefined;
@@ -738,13 +738,13 @@ declare const __VLS_base$1: vue15.DefineComponent<__VLS_Props, {
   onPointercancel?: ((event: TresPointerEvent) => any) | undefined;
   onLostpointercapture?: ((event: TresPointerEvent) => any) | undefined;
   onWheel?: ((event: TresPointerEvent) => any) | undefined;
-  onReady?: ((context: TresContext) => any) | undefined;
   onError?: ((error: Error) => any) | undefined;
+  onReady?: ((context: TresContext) => any) | undefined;
   onPointermissed?: ((event: TresPointerEvent) => any) | undefined;
   onRender?: ((context: TresContext) => any) | undefined;
   onBeforeLoop?: ((context: TresContextWithClock) => any) | undefined;
   onLoop?: ((context: TresContextWithClock) => any) | undefined;
-}>, {}, {}, {}, {}, string, vue15.ComponentProvideOptions, false, {}, any>;
+}>, {}, {}, {}, {}, string, vue4.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export$1: __VLS_WithSlots$1<typeof __VLS_base$1, __VLS_Slots$1>;
 declare const _default$1: typeof __VLS_export$1;
 type __VLS_WithSlots$1<T, S> = T & {
@@ -763,7 +763,7 @@ interface TresCanvasInstance {
 type __VLS_Slots = {
   default: () => any;
 };
-declare const __VLS_base: vue15.DefineComponent<ContextProps, TresCanvasInstance, {}, {}, {}, vue15.ComponentOptionsMixin, vue15.ComponentOptionsMixin, {
+declare const __VLS_base: vue4.DefineComponent<ContextProps, TresCanvasInstance, {}, {}, {}, vue4.ComponentOptionsMixin, vue4.ComponentOptionsMixin, {
   click: (event: TresPointerEvent) => any;
   contextmenu: (event: TresPointerEvent) => any;
   pointermove: (event: TresPointerEvent) => any;
@@ -777,13 +777,13 @@ declare const __VLS_base: vue15.DefineComponent<ContextProps, TresCanvasInstance
   pointercancel: (event: TresPointerEvent) => any;
   lostpointercapture: (event: TresPointerEvent) => any;
   wheel: (event: TresPointerEvent) => any;
-  ready: (context: TresContext) => any;
   error: (error: Error) => any;
+  ready: (context: TresContext) => any;
   pointermissed: (event: TresPointerEvent) => any;
   render: (context: TresContext) => any;
   beforeLoop: (context: TresContextWithClock) => any;
   loop: (context: TresContextWithClock) => any;
-}, string, vue15.PublicProps, Readonly<ContextProps> & Readonly<{
+}, string, vue4.PublicProps, Readonly<ContextProps> & Readonly<{
   onClick?: ((event: TresPointerEvent) => any) | undefined;
   onContextmenu?: ((event: TresPointerEvent) => any) | undefined;
   onPointermove?: ((event: TresPointerEvent) => any) | undefined;
@@ -797,15 +797,14 @@ declare const __VLS_base: vue15.DefineComponent<ContextProps, TresCanvasInstance
   onPointercancel?: ((event: TresPointerEvent) => any) | undefined;
   onLostpointercapture?: ((event: TresPointerEvent) => any) | undefined;
   onWheel?: ((event: TresPointerEvent) => any) | undefined;
-  onReady?: ((context: TresContext) => any) | undefined;
   onError?: ((error: Error) => any) | undefined;
+  onReady?: ((context: TresContext) => any) | undefined;
   onPointermissed?: ((event: TresPointerEvent) => any) | undefined;
   onRender?: ((context: TresContext) => any) | undefined;
   onBeforeLoop?: ((context: TresContextWithClock) => any) | undefined;
   onLoop?: ((context: TresContextWithClock) => any) | undefined;
 }>, {
   windowSize: boolean;
-  enableProvideBridge: boolean;
   antialias: boolean;
   stencil: boolean;
   depth: boolean;
@@ -820,7 +819,8 @@ declare const __VLS_base: vue15.DefineComponent<ContextProps, TresCanvasInstance
   shadowMapType: THREE.ShadowMapType;
   useLegacyLights: boolean;
   renderMode: "always" | "on-demand" | "manual";
-}, {}, {}, {}, string, vue15.ComponentProvideOptions, false, {}, any>;
+  enableProvideBridge: boolean;
+}, {}, {}, {}, string, vue4.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 type __VLS_WithSlots<T, S> = T & {
@@ -911,6 +911,24 @@ declare const vLog: {
   }) => void;
 };
 //#endregion
+//#region src/utils/createTimer.d.ts
+interface TresTimer {
+  getDelta: () => number;
+  getElapsed: () => number;
+  update: () => void;
+  start: () => void;
+  stop: () => void;
+}
+/**
+ * Creates a unified timer abstraction that uses `Timer` on Three.js r179+
+ * and falls back to `Clock` on older versions.
+ *
+ * - On r179+: uses `Timer` with its Page Visibility API support (`connect`/`disconnect`).
+ * - On older versions: uses `Clock` with `start`/`stop`.
+ *
+ */
+declare function createTimer(): TresTimer;
+//#endregion
 //#region src/utils/is/three.d.ts
 /**
  * Type guard to check if a value is a Three.js Object3D
@@ -1154,4 +1172,4 @@ interface TresPlugin {
 }
 declare const plugin: TresPlugin;
 //#endregion
-export { Args, AssetLoadData, AttachFnType, AttachType, ConstructorRepresentation, DevtoolsMessage, DevtoolsMessageType, DevtoolsMessenger, DevtoolsSubscriber, DisposeType, ElementProps, InstanceProps, LoaderMethods, LoaderProto, LocalState, LoopContext, MathType, Mutable, NonFunctionKeys, Overwrite, Properties, RenderFunction, RenderMode, RendererOptions, ThreeElement, ThreeInstances, TresCamera, _default as TresCanvas, _default$1 as TresCanvasContext, type TresCanvasEmits, type TresCanvasInstance, type TresCanvasProps, TresCatalogue, TresColor, TresColorArray, TresComponents, type TresContext, TresContextWithClock, TresControl, type TresCustomRendererOptions, TresEuler, TresInstance, TresLayers, TresLoader, TresLoaderOptions, TresMaterial, TresObject, TresObject3D, TresObjectMap, TresOptions, TresPartialContext, TresPlugin, type TresPointerEvent, TresPrimitive, TresQuaternion, TresRenderer, TresRendererError, TresRendererErrorCode, TresRendererSetupContext, TresScene, TresVector2, TresVector3, TresVector4, UseCameraReturn, _default$2 as UseLoader, UseLoaderReturn, UseRendererManagerReturn, UseRendererOptions, VectorCoordinates, type VectorFlexibleParams, VueProps, WithMathProps, buildGraph, catalogue, plugin as default, disposeObject3D as dispose, extend, isBufferGeometry, isCamera, isClassInstance, isColor, isColorRepresentation, isCopyable, isFog, isGroup, isLayers, isLight, isMaterial, isMesh, isObject3D, isOrthographicCamera, isPerspectiveCamera, isProd, isScene, isTresCamera, isTresInstance, isTresObject, isTresPrimitive, isVectorLike, logError, logMessage, logWarning, normalizeColor, normalizeVectorFlexibleParam, registerTresDevtools, templateCompilerOptions, useCameraManager, useGraph, useLoader, useLoop, useRendererManager, useTres, useTresContext, useTresContextProvider, vDistanceTo, vLightHelper, vLog };
+export { Args, AssetLoadData, AttachFnType, AttachType, ConstructorRepresentation, DevtoolsMessage, DevtoolsMessageType, DevtoolsMessenger, DevtoolsSubscriber, DisposeType, ElementProps, InstanceProps, LoaderMethods, LoaderProto, LocalState, LoopContext, MathType, Mutable, NonFunctionKeys, Overwrite, Properties, RenderFunction, RenderMode, RendererOptions, ThreeElement, ThreeInstances, TresCamera, _default as TresCanvas, _default$1 as TresCanvasContext, type TresCanvasEmits, type TresCanvasInstance, type TresCanvasProps, TresCatalogue, TresColor, TresColorArray, TresComponents, type TresContext, TresContextWithClock, TresControl, type TresCustomRendererOptions, TresEuler, TresInstance, TresLayers, TresLoader, TresLoaderOptions, TresMaterial, TresObject, TresObject3D, TresObjectMap, TresOptions, TresPartialContext, TresPlugin, type TresPointerEvent, TresPrimitive, TresQuaternion, TresRenderer, TresRendererError, TresRendererErrorCode, TresRendererSetupContext, TresScene, TresTimer, TresVector2, TresVector3, TresVector4, UseCameraReturn, _default$2 as UseLoader, UseLoaderReturn, UseRendererManagerReturn, UseRendererOptions, VectorCoordinates, type VectorFlexibleParams, VueProps, WithMathProps, buildGraph, catalogue, createTimer, plugin as default, disposeObject3D as dispose, extend, isBufferGeometry, isCamera, isClassInstance, isColor, isColorRepresentation, isCopyable, isFog, isGroup, isLayers, isLight, isMaterial, isMesh, isObject3D, isOrthographicCamera, isPerspectiveCamera, isProd, isScene, isTresCamera, isTresInstance, isTresObject, isTresPrimitive, isVectorLike, logError, logMessage, logWarning, normalizeColor, normalizeVectorFlexibleParam, registerTresDevtools, templateCompilerOptions, useCameraManager, useGraph, useLoader, useLoop, useRendererManager, useTres, useTresContext, useTresContextProvider, vDistanceTo, vLightHelper, vLog };

package/dist/tres.js

@@ -1,20 +1,20 @@
 /**
   * name: @tresjs/core
-  * version: v5.6.0
+  * version: v5.7.0
   * (c) 2026
   * description: Declarative ThreeJS using Vue Components
   * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
   */
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createRenderer, defineComponent, getCurrentInstance, h, isRef, mergeProps, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, provide, reactive, readonly, ref, renderSlot, shallowRef, toValue, unref, useSlots, watch, watchEffect, withCtx } from "vue";
 import * as THREE from "three";
-import { ACESFilmicToneMapping, ArrowHelper, BackSide, BufferAttribute, BufferGeometry, Color, DirectionalLightHelper, DoubleSide, Float32BufferAttribute, HemisphereLightHelper, Layers, Line, LineBasicMaterial, Material, MathUtils, Mesh, MeshBasicMaterial, PCFSoftShadowMap, PerspectiveCamera, PointLightHelper, Scene, SpotLightHelper, Timer, Vector3, WebGLRenderer } from "three";
+import { ACESFilmicToneMapping, ArrowHelper, BackSide, BufferAttribute, BufferGeometry, Color, DirectionalLightHelper, DoubleSide, Float32BufferAttribute, HemisphereLightHelper, Layers, Line, LineBasicMaterial, Material, MathUtils, Mesh, MeshBasicMaterial, PCFSoftShadowMap, PerspectiveCamera, PointLightHelper, REVISION, Scene, SpotLightHelper, Vector3, WebGLRenderer } from "three";
 import { createEventHook, createInjectionState, promiseTimeout, refDebounced, tryOnScopeDispose, unrefElement, useAsyncState, useDevicePixelRatio, useElementSize, useFps, useMemory, useRafFn, useTimeout, useWindowSize, whenever } from "@vueuse/core";
 import { camel, isEqual, isFunction, isNumber, isObject, isString, isUndefined } from "radashi";
 import { forwardHtmlEvents, getVoidObject } from "@pmndrs/pointer-events";
 import { setupDevtoolsPlugin } from "@vue/devtools-api";
 
 //#region package.json
-var version = "5.6.0";
+var version = "5.7.0";
 
 //#endregion
 //#region src/utils/makeMap.ts
@@ -716,13 +716,55 @@ const setPixelRatio = (renderer, systemDpr, userDpr) => {
 	if (newDpr !== renderer.getPixelRatio?.()) renderer.setPixelRatio(newDpr);
 };
 
+//#endregion
+//#region src/core/revision.ts
+const revision = Number.parseInt(REVISION.replace("dev", ""));
+
+//#endregion
+//#region src/utils/createTimer.ts
+/**
+* Minimum Three.js revision that ships the `Timer` class.
+*/
+const TIMER_MIN_REVISION = 179;
+/**
+* Creates a unified timer abstraction that uses `Timer` on Three.js r179+
+* and falls back to `Clock` on older versions.
+*
+* - On r179+: uses `Timer` with its Page Visibility API support (`connect`/`disconnect`).
+* - On older versions: uses `Clock` with `start`/`stop`.
+*
+*/
+function createTimer() {
+	if (revision >= TIMER_MIN_REVISION) {
+		const timer = new THREE.Timer();
+		return {
+			getDelta: () => timer.getDelta(),
+			getElapsed: () => timer.getElapsed(),
+			update: () => timer.update(),
+			start: () => {
+				if (typeof document !== "undefined") timer.connect(document);
+			},
+			stop: () => timer.disconnect()
+		};
+	} else {
+		const clock = new THREE.Clock();
+		return {
+			getDelta: () => clock.getDelta(),
+			getElapsed: () => clock.elapsedTime,
+			update: () => {},
+			start: () => clock.start(),
+			stop: () => clock.stop()
+		};
+	}
+}
+
 //#endregion
 //#region src/composables/useCreateRafLoop/index.ts
 /**
 * @param cycleFn the function that is called before the after event hook is triggered and after the before event hook is triggered.
 */
 const useCreateRafLoop = (cycleFn) => {
-	const timer = new Timer();
+	const timer = createTimer();
 	const eventHooks = {
 		before: createEventHook(),
 		after: createEventHook()
@@ -738,11 +780,11 @@ const useCreateRafLoop = (cycleFn) => {
 		eventHooks.after.trigger(context);
 	}, { immediate: false });
 	const start = () => {
-		if (typeof document !== "undefined") timer.connect(document);
+		timer.start();
 		resume();
 	};
 	const stop = () => {
-		timer.disconnect();
+		timer.stop();
 		pause();
 	};
 	return {
@@ -2561,4 +2603,4 @@ const plugin = { install(app) {
 var src_default = plugin;
 
 //#endregion
-export { DevtoolsMessenger, TresCanvas_default as TresCanvas, Context_default as TresCanvasContext, TresRendererError, component_default as UseLoader, buildGraph, catalogue, src_default as default, disposeObject3D as dispose, extend, isBufferGeometry, isCamera, isClassInstance, isColor, isColorRepresentation, isCopyable, isFog, isGroup, isLayers, isLight, isMaterial, isMesh, isObject3D, isOrthographicCamera, isPerspectiveCamera, isProd, isScene, isTresCamera, isTresInstance, isTresObject, isTresPrimitive, isVectorLike, logError, logMessage, logWarning, normalizeColor, normalizeVectorFlexibleParam, registerTresDevtools, template_compiler_options_default as templateCompilerOptions, useCameraManager, useGraph, useLoader, useLoop, useRendererManager, useTres, useTresContext, useTresContextProvider, vDistanceTo, vLightHelper, vLog };
+export { DevtoolsMessenger, TresCanvas_default as TresCanvas, Context_default as TresCanvasContext, TresRendererError, component_default as UseLoader, buildGraph, catalogue, createTimer, src_default as default, disposeObject3D as dispose, extend, isBufferGeometry, isCamera, isClassInstance, isColor, isColorRepresentation, isCopyable, isFog, isGroup, isLayers, isLight, isMaterial, isMesh, isObject3D, isOrthographicCamera, isPerspectiveCamera, isProd, isScene, isTresCamera, isTresInstance, isTresObject, isTresPrimitive, isVectorLike, logError, logMessage, logWarning, normalizeColor, normalizeVectorFlexibleParam, registerTresDevtools, template_compiler_options_default as templateCompilerOptions, useCameraManager, useGraph, useLoader, useLoop, useRendererManager, useTres, useTresContext, useTresContextProvider, vDistanceTo, vLightHelper, vLog };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/core",
   "type": "module",
-  "version": "5.6.0",
+  "version": "5.7.0",
   "description": "Declarative ThreeJS using Vue Components",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "license": "MIT",