@tresjs/core 5.1.0 → 5.1.1

package/dist/tres.d.ts

@@ -0,0 +1,1056 @@
+/**
+  * name: @tresjs/core
+  * version: v5.1.1
+  * (c) 2025
+  * description: Declarative ThreeJS using Vue Components
+  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
+  */
+import * as vue0 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";
+import * as _vueuse_core0 from "@vueuse/core";
+import { EventHookOff, MaybeRef as MaybeRef$1, UseAsyncStateOptions, UseAsyncStateReturn } from "@vueuse/core";
+import { PointerEvent, PointerEventsMap } from "@pmndrs/pointer-events";
+import { Renderer } from "three/webgpu";
+
+//#region src/composables/useLoader/index.d.ts
+interface LoaderMethods {
+  setDRACOLoader: (dracoLoader: any) => void;
+  setMeshoptDecoder: (meshoptDecoder: any) => void;
+  setKTX2Loader: (ktx2Loader: any) => void;
+}
+type TresLoader<T> = Loader & Partial<LoaderMethods> & {
+  load: (url: string, onLoad: (result: T) => void, onProgress?: (event: ProgressEvent<EventTarget>) => void, onError?: (err: unknown) => void) => void;
+  loadAsync: (url: string, onProgress?: (event: ProgressEvent) => void) => Promise<T>;
+};
+type LoaderProto<T> = new (manager?: LoadingManager) => TresLoader<T>;
+interface TresLoaderOptions<T, Shallow extends boolean> {
+  manager?: LoadingManager;
+  extensions?: (loader: TresLoader<T>) => void;
+  initialValue?: T;
+  asyncOptions?: UseAsyncStateOptions<Shallow, any | null>;
+}
+/**
+ * Return type for the useLoader composable
+ * @template T - The type of the loaded asset (e.g., GLTF, Texture, etc.)
+ * @template Shallow - Whether to use shallow reactivity for better performance
+ * @extends {UseAsyncStateReturn<T, [string], Shallow>} - Extends VueUse's useAsyncState return type
+ */
+type UseLoaderReturn<T, Shallow extends boolean> = UseAsyncStateReturn<T, [string], Shallow> & {
+  /**
+   * Loads a new asset from the given path
+   * @param path - The URL or path to the asset to load
+   */
+  load: (path: string) => void;
+  /**
+   * Progress of the loading process
+   * @property loaded - The number of bytes loaded
+   * @property total - The total number of bytes to load
+   * @property percentage - The percentage of the loading process
+   */
+  progress: {
+    loaded: number;
+    total: number;
+    percentage: number;
+  };
+};
+/**
+ * Vue composable for loading 3D models using Three.js loaders
+ * @param Loader - The Three.js loader constructor
+ * @param path - The path to the model file
+ * @param options - Optional configuration for the loader
+ * @returns UseAsyncState composable with the loaded model
+ */
+declare function useLoader<T, Shallow extends boolean = false>(Loader: LoaderProto<T>, path: MaybeRef<string>, options?: TresLoaderOptions<T, Shallow>): UseLoaderReturn<T, Shallow>;
+//#endregion
+//#region src/composables/useCreateRafLoop/index.d.ts
+interface RafLoopContext {
+  delta: number;
+  elapsed: number;
+}
+//#endregion
+//#region src/composables/useSizes/index.d.ts
+interface SizesType {
+  height: Readonly<Ref<number>>;
+  width: Readonly<Ref<number>>;
+  aspectRatio: ComputedRef<number>;
+}
+//#endregion
+//#region src/composables/useCamera/index.d.ts
+/**
+ * Interface for the return value of the useCamera composable
+ */
+interface UseCameraReturn {
+  activeCamera: ComputedRef<TresCamera>;
+  /**
+   * The list of cameras
+   */
+  cameras: Ref<TresCamera[]>;
+  /**
+   * Register a camera
+   * @param camera - The camera to register
+   * @param active - Whether to set the camera as active
+   */
+  registerCamera: (camera: TresCamera, active?: boolean) => void;
+  /**
+   * Deregister a camera
+   * @param camera - The camera to deregister
+   */
+  deregisterCamera: (camera: TresCamera) => void;
+  /**
+   * Set the active camera
+   * @param cameraOrUuid - The camera or its UUID to set as active
+   */
+  setActiveCamera: (cameraOrUuid: string | TresCamera) => void;
+}
+/**
+ * Interface for the parameters of the useCamera composable
+ */
+interface UseCameraParams {
+  sizes: TresContext['sizes'];
+}
+/**
+ * Composable for managing cameras in a Three.js scene
+ * @param params - The parameters for the composable
+ * @param params.sizes - The sizes object containing window dimensions
+ * @returns The camera management functions and state
+ */
+declare const useCameraManager: ({
+  sizes
+}: UseCameraParams) => UseCameraReturn;
+//#endregion
+//#region src/composables/useRenderer/useRendererManager.d.ts
+/**
+ * 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
+ */
+type RenderMode = 'always' | 'on-demand' | 'manual';
+type RenderFunction = (notifySuccess: () => void) => void;
+type TresRenderer = WebGLRenderer | Renderer;
+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;
+  /**
+   * Whether to fail if the major performance caveat is detected.
+   * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}
+   * @default false
+   */
+  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;
+  /**
+   * The opacity of the clear color (0-1)
+   * Controls the transparency of the clear color
+   * @default 1
+   */
+  clearAlpha?: number;
+  /**
+   * Enable shadow rendering in the scene
+   * @default false
+   */
+  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;
+  /**
+   * 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)
+   */
+  shadowMapType?: ShadowMapType;
+  /**
+   * Whether to use legacy lights system instead of the new one
+   * @deprecated Use `useLegacyLights: false` for the new lighting system
+   */
+  useLegacyLights?: boolean;
+  /**
+   * Color space for the output render
+   * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}
+   */
+  outputColorSpace?: ColorSpace;
+  /**
+   * Exposure level of tone mapping
+   * @default 1
+   */
+  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';
+  /**
+   * Device Pixel Ratio for the renderer
+   * Can be a single number or a tuple defining a range [min, max]
+   */
+  dpr?: number | [number, number];
+  /**
+   * Custom WebGL renderer instance
+   * Allows using a pre-configured renderer instead of creating a new one
+   */
+  renderer?: (ctx: TresRendererSetupContext) => TresRenderer;
+}
+interface TresRendererSetupContext {
+  sizes: SizesType;
+  scene: ShallowRef<TresScene>;
+  camera: UseCameraReturn;
+  canvas: MaybeRef<HTMLCanvasElement>;
+}
+interface UseRendererOptions {
+  scene: ShallowRef<TresScene>;
+  canvas: MaybeRef<HTMLCanvasElement>;
+  options: Reactive<RendererOptions>;
+  contextParts: Pick<TresContext, 'sizes' | 'camera'>;
+}
+declare function useRendererManager({
+  scene,
+  canvas,
+  options,
+  contextParts: {
+    sizes,
+    camera
+  }
+}: UseRendererOptions): {
+  loop: {
+    start: () => void;
+    stop: () => void;
+    isActive: Readonly<ShallowRef<boolean>>;
+    onBeforeLoop: _vueuse_core0.EventHookOn<RafLoopContext>;
+    onLoop: _vueuse_core0.EventHookOn<RafLoopContext>;
+  };
+  instance: TresRenderer;
+  advance: () => void;
+  onReady: _vueuse_core0.EventHookOn<TresRenderer>;
+  onRender: _vueuse_core0.EventHookOn<TresRenderer>;
+  invalidate: (amountOfFramesToInvalidate?: number) => void;
+  canBeInvalidated: vue0.ComputedRef<boolean>;
+  mode: "always" | "on-demand" | "manual" | undefined;
+  replaceRenderFunction: (fn: RenderFunction) => void;
+};
+type UseRendererManagerReturn = ReturnType<typeof useRendererManager>;
+//#endregion
+//#region src/composables/useEventManager/index.d.ts
+declare function useEventManager({
+  canvas,
+  contextParts: {
+    scene,
+    camera,
+    renderer
+  }
+}: {
+  canvas: MaybeRef<HTMLCanvasElement>;
+  contextParts: Pick<TresContext, 'scene' | 'camera' | 'renderer'>;
+}): {
+  onPointerMissed: _vueuse_core0.EventHookOn<PointerEvent<MouseEvent> & Event<"click", Object3D<Object3DEventMap & PointerEventsMap>>>;
+};
+//#endregion
+//#region src/composables/useTresContextProvider/index.d.ts
+interface TresContext {
+  scene: ShallowRef<TresScene>;
+  sizes: SizesType;
+  extend: (objects: any) => void;
+  camera: UseCameraReturn;
+  controls: Ref<TresControl | null>;
+  renderer: UseRendererManagerReturn;
+  events: ReturnType<typeof useEventManager>;
+}
+declare const useTresContextProvider: (args_0: {
+  scene: TresScene;
+  canvas: MaybeRef<HTMLCanvasElement>;
+  windowSize: MaybeRefOrGetter<boolean>;
+  rendererOptions: RendererOptions;
+}) => TresContext;
+declare const useTresContext: () => TresContext;
+//#endregion
+//#region src/utils/pointerEvents.d.ts
+declare const supportedPointerEvents: readonly ["onClick", "onContextmenu", "onPointermove", "onPointerenter", "onPointerleave", "onPointerover", "onPointerout", "onDblclick", "onPointerdown", "onPointerup", "onPointercancel", "onLostpointercapture", "onWheel"];
+type SupportedVuePointerEvent = typeof supportedPointerEvents[number];
+type TresPointerEvent = PointerEvent<MouseEvent>;
+type PointerEventHandlers = { [key in SupportedVuePointerEvent]: (event: TresPointerEvent) => void };
+//#endregion
+//#region src/types/index.d.ts
+type AttachFnType = (parent: any, self: TresInstance) => () => void;
+type AttachType = string | AttachFnType;
+type DisposeType = ((self: TresInstance) => void) | boolean | 'default';
+type ConstructorRepresentation = new (...args: any[]) => any;
+type NonFunctionKeys<P> = { [K in keyof P]-?: P[K] extends ((...args: any[]) => any) ? never : K }[keyof P];
+type Overwrite<P, O> = Omit<P, NonFunctionKeys<O>> & O;
+type Properties<T> = Pick<T, NonFunctionKeys<T>>;
+type Mutable<P> = { [K in keyof P]: P[K] | Readonly<P[K]> };
+type Args<T> = T extends ConstructorRepresentation ? ConstructorParameters<T> : any[];
+interface TresCatalogue {
+  [name: string]: ConstructorRepresentation;
+}
+type TresCamera = THREE.OrthographicCamera | THREE.PerspectiveCamera;
+/**
+ * Represents the properties of an instance.
+ *
+ * @template T - The type of the object.
+ * @template P - The type of the arguments.
+ */
+interface InstanceProps<T = any, P = any> {
+  args?: Args<P>;
+  object?: T;
+  visible?: boolean;
+  dispose?: null;
+  attach?: AttachType;
+}
+interface TresBaseObject {
+  removeFromParent?: () => void;
+  dispose?: () => void;
+  [prop: string]: any;
+}
+interface LocalState {
+  type: string;
+  root: TresContext;
+  memoizedProps: {
+    [key: string]: any;
+  };
+  objects: TresObject[];
+  parent: TresObject | null;
+  primitive?: boolean;
+  dispose?: DisposeType;
+  attach?: AttachType;
+  previousAttach: any;
+}
+interface TresObject3D extends THREE.Object3D<THREE.Object3DEventMap> {
+  geometry?: THREE.BufferGeometry & TresBaseObject;
+  material?: THREE.Material & TresBaseObject;
+}
+type TresObject = TresBaseObject & (TresObject3D | THREE.BufferGeometry | THREE.Material | THREE.Fog) & {
+  __tres?: LocalState;
+};
+/**
+ * Union type covering all common Three.js material types
+ * This provides better TypeScript intellisense and type checking
+ * when accessing specific material properties
+ */
+type TresMaterial = THREE.MeshBasicMaterial | THREE.MeshStandardMaterial | THREE.MeshPhysicalMaterial | THREE.MeshLambertMaterial | THREE.MeshPhongMaterial | THREE.MeshToonMaterial | THREE.MeshNormalMaterial | THREE.MeshMatcapMaterial | THREE.MeshDepthMaterial | THREE.MeshDistanceMaterial | THREE.LineBasicMaterial | THREE.LineDashedMaterial | THREE.PointsMaterial | THREE.SpriteMaterial | THREE.ShaderMaterial | THREE.RawShaderMaterial | THREE.ShadowMaterial | THREE.Material;
+type TresInstance = TresObject & {
+  __tres: LocalState;
+};
+type TresPrimitive = TresInstance & {
+  object: TresInstance;
+  isPrimitive: true;
+};
+interface TresScene extends THREE.Scene {
+  __tres: {
+    root: TresContext;
+  };
+}
+interface MathRepresentation {
+  set(...args: number[] | [THREE.ColorRepresentation]): any;
+}
+interface VectorRepresentation extends MathRepresentation {
+  setScalar(s: number): any;
+}
+interface VectorCoordinates {
+  x: number;
+  y: number;
+  z: number;
+}
+type MathType<T extends MathRepresentation | THREE.Euler> = T extends THREE.Color ? ConstructorParameters<typeof THREE.Color> | THREE.ColorRepresentation : T extends VectorRepresentation | THREE.Layers | THREE.Euler ? T | Parameters<T['set']> | number | VectorCoordinates : T | Parameters<T['set']>;
+type VectorLike$1<VectorClass extends THREE.Vector2 | THREE.Vector3 | THREE.Vector4> = VectorClass | Parameters<VectorClass['set']> | Readonly<Parameters<VectorClass['set']>> | Parameters<VectorClass['setScalar']>[0];
+type TresVector2 = VectorLike$1<THREE.Vector2>;
+type TresVector3 = VectorLike$1<THREE.Vector3>;
+type TresVector4 = VectorLike$1<THREE.Vector4>;
+type TresColor = ConstructorParameters<typeof THREE.Color> | THREE.Color | number | string;
+type TresColorArray = typeof THREE.Color | [color: THREE.ColorRepresentation];
+type TresLayers = THREE.Layers | Parameters<THREE.Layers['set']>[0];
+type TresQuaternion = THREE.Quaternion | Parameters<THREE.Quaternion['set']>;
+type TresEuler = THREE.Euler;
+type TresControl = THREE.EventDispatcher & {
+  enabled: boolean;
+};
+type TresContextWithClock = TresContext & {
+  delta: number;
+  elapsed: number;
+};
+type WithMathProps<P> = { [K in keyof P]: P[K] extends MathRepresentation | THREE.Euler ? MathType<P[K]> : P[K] };
+interface RaycastableRepresentation {
+  raycast: (raycaster: THREE.Raycaster, intersects: THREE.Intersection[]) => void;
+}
+type EventProps<P> = P extends RaycastableRepresentation ? Partial<PointerEventHandlers> : unknown;
+interface VueProps {
+  children?: VNode[];
+  ref?: VNodeRef;
+  key?: string | number | symbol;
+}
+type ElementProps<T extends ConstructorRepresentation, P = InstanceType<T>> = Partial<Overwrite<P, WithMathProps<P> & VueProps & EventProps<P>>>;
+type ThreeElement<T extends ConstructorRepresentation> = Mutable<Overwrite<ElementProps<T>, Omit<InstanceProps<InstanceType<T>, T>, 'object'>>>;
+type ThreeExports = typeof THREE;
+type ThreeInstancesImpl = { [K in keyof ThreeExports as Uncapitalize<K>]: ThreeExports[K] extends ConstructorRepresentation ? ThreeElement<ThreeExports[K]> : never };
+interface ThreeInstances extends ThreeInstancesImpl {
+  primitive: Omit<ThreeElement<any>, 'args'> & {
+    object: object;
+  };
+}
+type TresComponents = { [K in keyof ThreeInstances as `Tres${Capitalize<string & K>}`]: DefineComponent<ThreeInstances[K]> };
+declare module 'vue' {
+  interface GlobalComponents extends TresComponents {
+    primitive: DefineComponent<TresPrimitive>;
+  }
+}
+//#endregion
+//#region src/utils/graph.d.ts
+interface TresObjectMap {
+  nodes: {
+    [name: string]: TresObject;
+  };
+  materials: {
+    [name: string]: TresMaterial;
+  };
+  meshes: {
+    [name: string]: Mesh;
+  };
+  scene?: Scene;
+}
+declare function buildGraph(object: Object3D | TresObject): TresObjectMap;
+//#endregion
+//#region src/composables/useLoader/component.vue.d.ts
+declare const __VLS_export$1: <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_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+  props: __VLS_PrettifyLocal<{
+    /**
+     * The THREE.js loader to use
+     */
+    loader: LoaderProto<T>;
+    /**
+     * Path to resource
+     */
+    path: string;
+    /**
+     * Optional THREE.js LoadingManager
+     */
+    manager?: LoadingManager;
+  } & {
+    onLoaded?: ((result: T) => any) | undefined;
+    onError?: ((error: unknown) => any) | undefined;
+  }> & vue0.PublicProps;
+  expose: (exposed: {}) => void;
+  attrs: any;
+  slots: {
+    default?: (props: {
+      state: vue0.UnwrapRef<T>;
+      isLoading: boolean;
+      error: unknown;
+    }) => any;
+  };
+  emit: ((evt: "loaded", result: T) => void) & ((evt: "error", error: unknown) => void);
+}>) => vue0.VNode & {
+  __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default$1: typeof __VLS_export$1;
+type __VLS_PrettifyLocal<T> = { [K in keyof T as K]: T[K] } & {};
+//#endregion
+//#region src/composables/useGraph/index.d.ts
+declare const useGraph: (object: MaybeRef$1<TresObject | undefined>) => vue0.ComputedRef<TresObjectMap | undefined>;
+//#endregion
+//#region src/utils/createPriorityEventHook.d.ts
+type Callback<T> = Parameters<EventHookOff<T>>[0];
+type PriorityEventHookOn<T> = (fn: Callback<T>, priority?: number) => {
+  off: () => void;
+};
+//#endregion
+//#region src/composables/useTres/index.d.ts
+interface TresPartialContext extends Omit<TresContext, 'renderer' | 'camera'> {
+  /**
+   * The renderer instance
+   *
+   * @type {TresRenderer}
+   * @memberof TresPartialContext
+   */
+  renderer: TresRenderer;
+  /**
+   * The current active camera
+   *
+   * @type {ComputedRef<Camera | undefined>}
+   * @memberof TresPartialContext
+   */
+  camera: ComputedRef<Camera | undefined>;
+  /**
+   * Marks the scene as needing an update in the next frame.
+   * This is used in on-demand rendering mode to schedule a render.
+   *
+   * @type {() => void}
+   * @memberof TresPartialContext
+   */
+  invalidate: () => void;
+  /**
+   * Manually advances the render loop by one frame.
+   * This is particularly useful in manual rendering mode where you want explicit control over when frames are rendered.
+   *
+   * @type {() => void}
+   * @memberof TresPartialContext
+   */
+  advance: () => void;
+}
+declare function useTres(): TresPartialContext;
+//#endregion
+//#region src/composables/useLoop/index.d.ts
+type LoopContext = RafLoopContext & TresPartialContext;
+/**
+ * Composable that provides control over the render loop and animation lifecycle.
+ */
+declare const useLoop: () => {
+  stop: () => void;
+  start: () => void;
+  isActive: Readonly<vue0.ShallowRef<boolean>>;
+  onBeforeRender: PriorityEventHookOn<LoopContext>;
+  onRender: PriorityEventHookOn<LoopContext>;
+  render: (fn: RenderFunction) => void;
+};
+//#endregion
+//#region src/utils/logger.d.ts
+/**
+ * Logger utility for TresJS
+ * @module logger
+ */
+declare const isProd: boolean;
+type OneOrMore<T> = {
+  0: T;
+} & Array<T>;
+/**
+ * Logs an error message with the TresJS prefix
+ * @param args - Arguments to log
+ */
+declare function logError(...args: OneOrMore<any>): void;
+/**
+ * Logs a warning message with the TresJS prefix
+ * @param args - Arguments to log
+ */
+declare function logWarning(...args: OneOrMore<any>): void;
+/**
+ * Logs a message with the TresJS prefix (only in development mode)
+ * @param name - Name of the message
+ * @param value - Value to log
+ */
+declare function logMessage(name: string, value: any): void;
+//#endregion
+//#region src/utils/index.d.ts
+declare function disposeObject3D(object: TresObject): void;
+//#endregion
+//#region src/utils/normalize.d.ts
+interface Vector2PropInterface {
+  x?: number;
+  y?: number;
+  width?: number;
+  height?: number;
+}
+interface Vector3PropInterface extends Vector2PropInterface {
+  z?: number;
+}
+type VectorFlexibleParams = Vector3 | number[] | Vector3PropInterface | number;
+declare function normalizeVectorFlexibleParam(value: VectorFlexibleParams): Array<number>;
+declare function normalizeColor(value: Color | Array<number> | string | number | ColorRepresentation): Color;
+//#endregion
+//#region src/utils/template-compiler-options.d.ts
+declare const templateCompilerOptions: {
+  template: {
+    compilerOptions: {
+      isCustomElement: (tag: string) => boolean;
+    };
+  };
+};
+//#endregion
+//#region src/components/TresCanvas.vue.d.ts
+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 const __VLS_export: __VLS_WithSlots<vue0.DefineComponent<TresCanvasProps, {
+  context: vue0.ShallowRef<TresContext | null, TresContext | null>;
+  dispose: () => void;
+}, {}, {}, {}, vue0.ComponentOptionsMixin, vue0.ComponentOptionsMixin, {
+  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;
+  pointermissed: (event: PointerEvent<MouseEvent>) => any;
+  render: (context: TresContext) => any;
+  beforeLoop: (context: TresContextWithClock) => any;
+  loop: (context: TresContextWithClock) => any;
+}, string, vue0.PublicProps, Readonly<TresCanvasProps> & Readonly<{
+  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;
+  onPointermissed?: ((event: PointerEvent<MouseEvent>) => any) | undefined;
+  onRender?: ((context: TresContext) => any) | undefined;
+  onBeforeLoop?: ((context: TresContextWithClock) => any) | undefined;
+  onLoop?: ((context: TresContextWithClock) => any) | undefined;
+}>, {
+  windowSize: boolean;
+  antialias: boolean;
+  stencil: boolean;
+  depth: boolean;
+  logarithmicDepthBuffer: boolean;
+  preserveDrawingBuffer: boolean;
+  alpha: boolean;
+  failIfMajorPerformanceCaveat: boolean;
+  clearColor: THREE.ColorRepresentation;
+  clearAlpha: number;
+  shadows: boolean;
+  toneMapping: THREE.ToneMapping;
+  shadowMapType: THREE.ShadowMapType;
+  useLegacyLights: boolean;
+  renderMode: "always" | "on-demand" | "manual";
+  enableProvideBridge: boolean;
+}, {}, {}, {}, string, vue0.ComponentProvideOptions, false, {}, any>, {
+  default: () => any;
+}>;
+declare const _default: typeof __VLS_export;
+type __VLS_WithSlots<T, S> = T & {
+  new (): {
+    $slots: S;
+  };
+};
+//#endregion
+//#region src/core/catalogue.d.ts
+declare const catalogue: Ref<TresCatalogue>;
+declare const extend: (objects: any) => any;
+//#endregion
+//#region src/devtools/DevtoolsMessenger.d.ts
+type DevtoolsMessageType = 'performance' | 'context' | 'asset-load';
+interface AssetLoadData {
+  url: string;
+  type: string;
+  loaded: boolean;
+  size: number;
+  asset: HTMLImageElement | HTMLScriptElement | HTMLLinkElement | Blob | ArrayBuffer | null;
+}
+interface DevtoolsMessage<T = any> {
+  type: DevtoolsMessageType;
+  data: T;
+  timestamp?: number;
+}
+type DevtoolsSubscriber = (message: DevtoolsMessage) => void;
+/**
+ * Messenger class for communicating with Tres DevTools
+ * This class will be attached to window.__TRES__DEVTOOLS__
+ */
+declare class DevtoolsMessenger {
+  private subscribers;
+  private messageQueue;
+  private maxQueueSize;
+  /**
+   * Send a message to devtools subscribers
+   * If no subscribers are available, only queueable message types are queued
+   */
+  send<T>(type: DevtoolsMessageType, data: T): void;
+  /**
+   * Queue a message for later delivery
+   */
+  private queueMessage;
+  /**
+   * Flush all queued messages to current subscribers
+   */
+  private flushQueue;
+  /**
+   * Subscribe to devtools messages
+   * When a new subscriber is added, all queued messages (asset-load events) are immediately delivered
+   */
+  subscribe(subscriber: DevtoolsSubscriber): () => void;
+  /**
+   * Check if there are any subscribers
+   */
+  get hasSubscribers(): boolean;
+  /**
+   * Get the current queue size
+   */
+  get queueSize(): number;
+  /**
+   * Clear all queued messages
+   */
+  clearQueue(): void;
+}
+//#endregion
+//#region src/devtools/plugin.d.ts
+declare function registerTresDevtools(app: App, tres: TresContext): void;
+//#endregion
+//#region src/directives/vDistanceTo.d.ts
+declare const vDistanceTo: {
+  updated: (el: TresObject, binding: Ref<TresObject>) => void;
+  unmounted: (el: TresObject) => void;
+};
+//#endregion
+//#region src/directives/vLightHelper.d.ts
+declare const vLightHelper: {
+  mounted: (el: TresObject) => void;
+  updated: (el: TresObject) => void;
+  unmounted: (el: TresObject) => void;
+};
+//#endregion
+//#region src/directives/vLog.d.ts
+declare const vLog: {
+  mounted: (el: TresObject, binding: {
+    arg: string;
+  }) => void;
+};
+//#endregion
+//#region src/utils/is/three.d.ts
+/**
+ * Type guard to check if a value is a Three.js Object3D
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Object3D instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.Object3D()
+ * if (isObject3D(value)) {
+ *   // TypeScript knows value is Object3D here
+ *   value.position // OK
+ *   value.rotation // OK
+ *   value.scale // OK
+ * }
+ * ```
+ */
+declare const isObject3D: (value: unknown) => value is Object3D<THREE.Object3DEventMap>;
+/**
+ * Type guard to check if a value is a Three.js Mesh
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Mesh instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.Mesh()
+ * if (isMesh(value)) {
+ *   // TypeScript knows value is Mesh here
+ *   value.geometry // OK
+ */
+declare const isMesh: (value: unknown) => value is Mesh<BufferGeometry<THREE.NormalBufferAttributes, THREE.BufferGeometryEventMap>, Material | Material[], THREE.Object3DEventMap>;
+/**
+ * Type guard to check if a value is a Three.js Camera
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Camera instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.PerspectiveCamera()
+ * if (isCamera(value)) {
+ *   // TypeScript knows value is Camera here
+ *   value.fov // OK
+ *   value.near // OK
+ *   value.far // OK
+ * }
+ * ```
+ */
+declare const isCamera: (value: unknown) => value is Camera;
+/**
+ * Type guard to check if a value is a Three.js OrthographicCamera
+ * @param value - The value to check
+ * @returns True if the value is a Three.js OrthographicCamera instance, false otherwise
+ */
+declare const isOrthographicCamera: (value: unknown) => value is OrthographicCamera;
+/**
+ * Type guard to check if a value is a Three.js PerspectiveCamera
+ * @param value - The value to check
+ * @returns True if the value is a Three.js PerspectiveCamera instance, false otherwise
+ */
+declare const isPerspectiveCamera: (value: unknown) => value is PerspectiveCamera;
+/**
+ * Type guard to check if a value is a Three.js Color
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Color instance, false otherwise
+ */
+declare const isColor: (value: unknown) => value is Color;
+/**
+ * Type guard to check if a value is a Three.js ColorRepresentation
+ * @param value - The value to check
+ * @returns True if the value is a Three.js ColorRepresentation instance, false otherwise
+ */
+declare const isColorRepresentation: (value: unknown) => value is ColorRepresentation;
+/**
+ * Type guard to check if a value is a Three.js Layers
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Layers instance, false otherwise
+ */
+declare const isLayers: (value: unknown) => value is Layers;
+/**
+ * Type guard to check if a value is a Three.js BufferGeometry
+ * @param value - The value to check
+ * @returns True if the value is a Three.js BufferGeometry instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.BufferGeometry()
+ * if (isBufferGeometry(value)) {
+ *   // TypeScript knows value is BufferGeometry here
+ *   value.attributes // OK
+ *   value.index // OK
+ *   value.computeVertexNormals() // OK
+ * }
+ * ```
+ */
+declare const isBufferGeometry: (value: unknown) => value is BufferGeometry<THREE.NormalBufferAttributes, THREE.BufferGeometryEventMap>;
+/**
+ * Type guard to check if a value is a Three.js Material
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Material instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.MeshStandardMaterial()
+ * if (isMaterial(value)) {
+ *   // TypeScript knows value is Material here
+ *   value.color // OK
+ *   value.metalness // OK
+ *   value.roughness // OK
+ * }
+ * ```
+ */
+declare const isMaterial: (value: unknown) => value is Material;
+/**
+ * Type guard to check if a value is a Three.js Light
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Light instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.DirectionalLight()
+ * if (isLight(value)) {
+ *   // TypeScript knows value is Light here
+ *   value.intensity // OK
+ *   value.color // OK
+ *   value.position // OK
+ * }
+ * ```
+ */
+declare const isLight: (value: unknown) => value is Light<THREE.LightShadow<Camera> | undefined>;
+/**
+ * Type guard to check if a value is a Three.js Fog
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Fog instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.Fog(0x000000, 1, 1000)
+ * if (isFog(value)) {
+ *   // TypeScript knows value is Fog here
+ *   value.color // OK
+ *   value.near // OK
+ *   value.far // OK
+ * }
+ * ```
+ */
+declare const isFog: (value: unknown) => value is Fog;
+/**
+ * Type guard to check if a value is a Three.js Scene
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Scene instance, false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.Scene()
+ * if (isScene(value)) {
+ *   // TypeScript knows value is Scene here
+ *   value.children // OK
+ *   value.add(new THREE.Object3D()) // OK
+ *   value.remove(new THREE.Object3D()) // OK
+ * }
+ * ```
+ */
+declare const isScene: (value: unknown) => value is Scene;
+/**
+ * Type guard to check if a value is a Three.js Group
+ * @param value - The value to check
+ * @returns True if the value is a Three.js Group instance, false otherwise
+ * ```
+ */
+declare const isGroup: (value: unknown) => value is Group<THREE.Object3DEventMap>;
+//#endregion
+//#region src/utils/is/tres.d.ts
+interface VectorLike {
+  set: (...args: any[]) => void;
+  constructor?: (...args: any[]) => any;
+}
+declare const isVectorLike: (value: unknown) => value is VectorLike;
+interface Copyable {
+  copy: (...args: any[]) => void;
+  constructor?: (...args: any[]) => any;
+}
+declare const isCopyable: (value: unknown) => value is Copyable;
+interface ClassInstance {
+  constructor?: (...args: any[]) => any;
+}
+declare const isClassInstance: (object: unknown) => object is ClassInstance;
+/**
+ * Type guard to check if a value is a TresCamera
+ * @param value - The value to check
+ * @returns True if the value is a TresCamera instance, false otherwise
+ */
+declare const isTresCamera: (value: unknown) => value is TresCamera;
+/**
+ * Type guard to check if a value is a TresObject
+ * @param value - The value to check
+ * @returns True if the value is a TresObject (Object3D | BufferGeometry | Material | Fog), false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.Mesh()
+ * if (isTresObject(value)) {
+ *   // TypeScript knows value is TresObject here
+ *   // You can use common properties and methods shared by all TresObjects
+ * }
+ * ```
+ * @remarks
+ * TresObject is a union type that represents the core Three.js objects that can be used in TresJS.
+ * This includes Object3D, BufferGeometry, Material, and Fog instances.
+ */
+declare const isTresObject: (value: unknown) => value is TresObject;
+/**
+ * Type guard to check if a value is a TresPrimitive
+ * @param value - The value to check
+ * @returns True if the value is a TresPrimitive instance, false otherwise
+ * @example
+ * ```ts
+ * const value = { isPrimitive: true }
+ * if (isTresPrimitive(value)) {
+ *   // TypeScript knows value is TresPrimitive here
+ *   // You can use properties and methods specific to TresPrimitives
+ * }
+ * ```
+ * @remarks
+ * TresPrimitive is a special type in TresJS that represents primitive objects
+ * that can be used directly in the scene without needing to be wrapped in a Three.js object.
+ */
+declare const isTresPrimitive: (value: unknown) => value is TresPrimitive;
+/**
+ * Type guard to check if a value is a TresInstance (has __tres property)
+ * @param value - The value to check
+ * @returns True if the value is a TresInstance (has __tres property), false otherwise
+ * @example
+ * ```ts
+ * const value = new THREE.Mesh()
+ * if (isTresInstance(value)) {
+ *   // TypeScript knows value is TresInstance here
+ *   // You can safely access value.__tres
+ * }
+ * ```
+ */
+declare const isTresInstance: (value: unknown) => value is TresInstance;
+//#endregion
+//#region src/index.d.ts
+interface TresOptions {
+  extends?: Record<string, unknown>;
+}
+interface TresPlugin {
+  [key: string]: any;
+  install: (app: App, options?: TresOptions) => void;
+}
+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, TresCatalogue, TresColor, TresColorArray, type TresContext, TresContextWithClock, TresControl, TresEuler, TresInstance, TresLayers, TresLoader, TresLoaderOptions, TresMaterial, TresObject, TresObject3D, TresObjectMap, TresOptions, TresPartialContext, TresPlugin, type TresPointerEvent, TresPrimitive, TresQuaternion, TresRenderer, TresRendererSetupContext, TresScene, TresVector2, TresVector3, TresVector4, UseCameraReturn, _default$1 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 };