angular-three 2.0.0-beta.31 → 2.0.0-beta.310

package/index.d.ts

@@ -1,24 +1,26 @@
-export * from './lib/before-render';
 export * from './lib/canvas';
 export * from './lib/directives/args';
-export * from './lib/directives/key';
-export * from './lib/directives/parent';
-export { type NgtCamera, type NgtThreeEvent } from './lib/events';
+export * from './lib/directives/selection';
+export * from './lib/html';
 export * from './lib/instance';
 export * from './lib/loader';
-export { addAfterEffect, addEffect, addTail } from './lib/loop';
-export { NgtPortal, NgtPortalContent } from './lib/portal';
-export * from './lib/ref';
+export * from './lib/loop';
+export * from './lib/pipes/hexify';
+export * from './lib/portal';
 export * from './lib/renderer';
+export * from './lib/roots';
 export * from './lib/routed-scene';
 export * from './lib/store';
-export * from './lib/three-types';
-export * from './lib/types';
 export * from './lib/utils/apply-props';
-export { createAttachFunction } from './lib/utils/attach';
+export * from './lib/utils/attach';
+export * from './lib/utils/before-render';
 export * from './lib/utils/is';
 export * from './lib/utils/make';
-export * from './lib/utils/safe-detect-changes';
+export * from './lib/utils/non-nullish';
+export * from './lib/utils/object-events';
+export * from './lib/utils/parameters';
+export * from './lib/utils/resolve-ref';
 export * from './lib/utils/signal-store';
 export * from './lib/utils/update';
-import './lib/three-types';
+export type * from './lib/three-types';
+export type * from './lib/types';

package/lib/canvas.d.ts

@@ -1,107 +1,377 @@
-import { ElementRef, EventEmitter, type OnChanges, type OnInit, type SimpleChanges, type Type } from '@angular/core';
-import { type ResizeResult } from 'ngxtension/resize';
-import * as THREE from 'three';
-import type { NgtCamera, NgtEventManager } from './events';
-import { type NgtDpr, type NgtPerformance, type NgtRenderer, type NgtSize, type NgtState } from './store';
-import type { NgtObject3DNode } from './three-types';
-import type { NgtAnyRecord, NgtProperties } from './types';
-import { type NgtSignalStore } from './utils/signal-store';
+import { ElementRef, Type, ViewContainerRef } from '@angular/core';
+import { ResizeResult } from 'ngxtension/resize';
+import { Raycaster, Scene, Vector3 } from 'three';
+import { createPointerEvents } from './dom/events';
+import { NgtDpr, NgtGLOptions, NgtPerformance, NgtSize, NgtState } from './types';
 import * as i0 from "@angular/core";
-export type NgtGLOptions = NgtRenderer | ((canvas: HTMLCanvasElement) => NgtRenderer) | Partial<NgtProperties<THREE.WebGLRenderer> | THREE.WebGLRendererParameters> | undefined;
-export type NgtCanvasInputs = {
-    /** A threejs renderer instance or props that go into the default renderer */
-    gl?: NgtGLOptions;
-    size?: NgtSize;
-    /**
-     * Enables shadows (by default PCFsoft). Can accept `gl.shadowMap` options for fine-tuning,
-     * but also strings: 'basic' | 'percentage' | 'soft' | 'variance'.
-     * @see https://threejs.org/docs/#api/en/renderers/WebGLRenderer.shadowMap
-     */
-    shadows?: boolean | 'basic' | 'percentage' | 'soft' | 'variance' | Partial<THREE.WebGLShadowMap>;
-    /**
-     * Disables three r139 color management.
-     * @see https://threejs.org/docs/#manual/en/introduction/Color-management
-     */
-    legacy?: boolean;
-    /** Switch off automatic sRGB encoding and gamma correction */
-    linear?: boolean;
-    /** Use `THREE.NoToneMapping` instead of `THREE.ACESFilmicToneMapping` */
-    flat?: boolean;
-    /** Creates an orthographic camera */
-    orthographic?: boolean;
-    /**
-     * R3F's render mode. Set to `demand` to only render on state change or `never` to take control.
-     * @see https://docs.pmnd.rs/react-three-fiber/advanced/scaling-performance#on-demand-rendering
-     */
-    frameloop?: 'always' | 'demand' | 'never';
-    /**
-     * R3F performance options for adaptive performance.
-     * @see https://docs.pmnd.rs/react-three-fiber/advanced/scaling-performance#movement-regression
-     */
-    performance?: Partial<Omit<NgtPerformance, 'regress'>>;
-    /** Target pixel ratio. Can clamp between a range: `[min, max]` */
-    dpr?: NgtDpr;
-    /** Props that go into the default raycaster */
-    raycaster?: Partial<THREE.Raycaster>;
-    /** A `THREE.Scene` instance or props that go into the default scene */
-    scene?: THREE.Scene | Partial<THREE.Scene>;
-    /** A `Camera` instance or props that go into the default camera */
-    camera?: (NgtCamera | Partial<NgtObject3DNode<THREE.Camera, typeof THREE.Camera> & NgtObject3DNode<THREE.PerspectiveCamera, typeof THREE.PerspectiveCamera> & NgtObject3DNode<THREE.OrthographicCamera, typeof THREE.OrthographicCamera>>) & {
-        /** Flags the camera as manual, putting projection into your own hands */
-        manual?: boolean;
-    };
-    /** An R3F event manager to manage elements' pointer events */
-    events?: (store: NgtSignalStore<NgtState>) => NgtEventManager<HTMLElement>;
-    /** The target where events are being subscribed to, default: the div that wraps canvas */
-    eventSource?: HTMLElement | ElementRef<HTMLElement>;
-    /** The event prefix that is cast into canvas pointer x/y events, default: "offset" */
-    eventPrefix?: 'offset' | 'client' | 'page' | 'layer' | 'screen';
-    /** Default coordinate for the camera to look at */
-    lookAt?: THREE.Vector3 | Parameters<THREE.Vector3['set']>;
-};
-export declare class NgtCanvas implements OnInit, OnChanges {
+export declare class NgtCanvas {
     private store;
     private initRoot;
+    private autoEffect;
     private host;
-    private viewContainerRef;
-    private injector;
-    private environmentInjector;
     private zone;
-    private destroyRef;
-    private cdr;
-    private inputs;
-    sceneGraph: Type<unknown>;
-    sceneGraphInputs: NgtAnyRecord;
-    compoundPrefixes: string[];
-    set linear(linear: boolean);
-    set legacy(legacy: boolean);
-    set flat(flat: boolean);
-    set orthographic(orthographic: boolean);
-    set frameloop(frameloop: NgtCanvasInputs['frameloop']);
-    set dpr(dpr: NgtDpr);
-    set raycaster(raycaster: Partial<THREE.Raycaster>);
-    set shadows(shadows: boolean | Partial<THREE.WebGLShadowMap>);
-    set camera(camera: NgtCanvasInputs['camera']);
-    set scene(scene: NgtCanvasInputs['scene']);
-    set gl(gl: NgtCanvasInputs['gl']);
-    set eventSource(eventSource: NgtCanvasInputs['eventSource']);
-    set eventPrefix(eventPrefix: NgtCanvasInputs['eventPrefix']);
-    set lookAt(lookAt: NgtCanvasInputs['lookAt']);
-    set performance(performance: NgtCanvasInputs['performance']);
-    created: EventEmitter<NgtState>;
-    private inputsEventSource;
+    private environmentInjector;
+    private injector;
+    sceneGraph: import("@angular/core").InputSignalWithTransform<Type<any>, Type<any> | "routed">;
+    gl: import("@angular/core").InputSignal<NgtGLOptions>;
+    size: import("@angular/core").InputSignal<NgtSize | undefined>;
+    shadows: import("@angular/core").InputSignalWithTransform<NonNullable<boolean | Partial<import("three").WebGLShadowMap> | "basic" | "percentage" | "soft" | "variance" | undefined>, unknown>;
+    legacy: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    linear: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    flat: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    orthographic: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    frameloop: import("@angular/core").InputSignal<NonNullable<"always" | "demand" | "never" | undefined>>;
+    performance: import("@angular/core").InputSignal<Partial<Omit<NgtPerformance, "regress">> | undefined>;
+    dpr: import("@angular/core").InputSignal<NgtDpr>;
+    raycaster: import("@angular/core").InputSignal<Partial<Raycaster> | undefined>;
+    scene: import("@angular/core").InputSignal<Scene | Partial<Scene> | undefined>;
+    camera: import("@angular/core").InputSignal<NonNullable<((import("./types").NgtCamera | Partial<{
+        addEventListener: (<TEventKey extends keyof import("angular-three").NgtNodeEventMap<import("three").Camera>>(type: TEventKey, listener: (this: import("angular-three").NgtNodeElement<import("three").Camera, typeof import("three").Camera>, ev: import("angular-three").NgtNodeEventMap<import("three").Camera>[TEventKey]) => any) => void) & (<TEventKey extends keyof import("angular-three").NgtAllObject3DEventsMap>(type: TEventKey, listener: (this: any, ev: import("angular-three").NgtAllObject3DEventsMap[TEventKey]) => any) => void);
+        removeEventListener: (<TEventKey extends keyof import("angular-three").NgtNodeEventMap<import("three").Camera>>(type: TEventKey, listener: (this: import("angular-three").NgtNodeElement<import("three").Camera, typeof import("three").Camera>, ev: import("angular-three").NgtNodeEventMap<import("three").Camera>[TEventKey]) => any) => void) & (<TEventKey extends keyof import("angular-three").NgtAllObject3DEventsMap>(type: TEventKey, listener: (this: any, ev: import("angular-three").NgtAllObject3DEventsMap[TEventKey]) => any) => void);
+        clone?: ((recursive?: boolean) => import("three").Camera) | undefined;
+        copy?: ((object: import("three").Object3D, recursive?: boolean) => import("three").Camera) | undefined;
+        add?: ((...object: import("three").Object3D[]) => import("three").Camera) | undefined;
+        applyMatrix4?: ((matrix: import("three").Matrix4) => void) | undefined;
+        applyQuaternion?: ((quaternion: import("three").Quaternion) => import("three").Camera) | undefined;
+        attach: string | string[] | import("./types").NgtAttachFunction;
+        __ngt_args__: [];
+        readonly type?: string | undefined;
+        readonly id?: number | undefined;
+        uuid?: string | undefined;
+        name?: string | undefined;
+        userData?: Record<string, any> | undefined;
+        rotateX?: ((angle: number) => import("three").Camera) | undefined;
+        rotateY?: ((angle: number) => import("three").Camera) | undefined;
+        rotateZ?: ((angle: number) => import("three").Camera) | undefined;
+        lookAt?: {
+            (vector: Vector3): void;
+            (x: number, y: number, z: number): void;
+        } | undefined;
+        toJSON?: ((meta?: import("three").JSONMeta) => import("three").Object3DJSON) | undefined;
+        hasEventListener?: {
+            <T extends keyof import("three").Object3DEventMap>(type: T, listener: import("three").EventListener<import("three").Object3DEventMap[T], T, import("three").Camera>): boolean;
+            <T extends string>(type: T, listener: import("three").EventListener<{}, T, import("three").Camera>): boolean;
+        } | undefined;
+        dispatchEvent?: (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | undefined;
+        visible?: boolean | undefined;
+        onBeforeRender?: ((renderer: import("three").WebGLRenderer, scene: Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry, material: import("three").Material, group: import("three").Group) => void) | undefined;
+        readonly isObject3D?: true | undefined;
+        parent?: import("three").Object3D<import("three").Object3DEventMap> | null | undefined;
+        children?: import("three").Object3D<import("three").Object3DEventMap>[] | undefined;
+        readonly modelViewMatrix?: import("three").Matrix4 | undefined;
+        readonly normalMatrix?: import("three").Matrix3 | undefined;
+        matrixWorld?: import("three").Matrix4 | undefined;
+        matrixAutoUpdate?: boolean | undefined;
+        matrixWorldAutoUpdate?: boolean | undefined;
+        matrixWorldNeedsUpdate?: boolean | undefined;
+        castShadow?: boolean | undefined;
+        receiveShadow?: boolean | undefined;
+        frustumCulled?: boolean | undefined;
+        renderOrder?: number | undefined;
+        animations?: import("three").AnimationClip[] | undefined;
+        customDepthMaterial?: import("three").Material | undefined;
+        customDistanceMaterial?: import("three").Material | undefined;
+        onBeforeShadow?: ((renderer: import("three").WebGLRenderer, scene: Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry, depthMaterial: import("three").Material, group: import("three").Group) => void) | undefined;
+        onAfterShadow?: ((renderer: import("three").WebGLRenderer, scene: Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry, depthMaterial: import("three").Material, group: import("three").Group) => void) | undefined;
+        onAfterRender?: ((renderer: import("three").WebGLRenderer, scene: Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry, material: import("three").Material, group: import("three").Group) => void) | undefined;
+        setRotationFromAxisAngle?: ((axis: Vector3, angle: number) => void) | undefined;
+        setRotationFromEuler?: ((euler: import("three").Euler) => void) | undefined;
+        setRotationFromMatrix?: ((m: import("three").Matrix4) => void) | undefined;
+        setRotationFromQuaternion?: ((q: import("three").Quaternion) => void) | undefined;
+        rotateOnAxis?: ((axis: Vector3, angle: number) => import("three").Camera) | undefined;
+        rotateOnWorldAxis?: ((axis: Vector3, angle: number) => import("three").Camera) | undefined;
+        translateOnAxis?: ((axis: Vector3, distance: number) => import("three").Camera) | undefined;
+        translateX?: ((distance: number) => import("three").Camera) | undefined;
+        translateY?: ((distance: number) => import("three").Camera) | undefined;
+        translateZ?: ((distance: number) => import("three").Camera) | undefined;
+        localToWorld?: ((vector: Vector3) => Vector3) | undefined;
+        worldToLocal?: ((vector: Vector3) => Vector3) | undefined;
+        remove?: ((...object: import("three").Object3D[]) => import("three").Camera) | undefined;
+        removeFromParent?: (() => import("three").Camera) | undefined;
+        clear?: (() => import("three").Camera) | undefined;
+        getObjectById?: ((id: number) => import("three").Object3D | undefined) | undefined;
+        getObjectByName?: ((name: string) => import("three").Object3D | undefined) | undefined;
+        getObjectByProperty?: ((name: string, value: any) => import("three").Object3D | undefined) | undefined;
+        getObjectsByProperty?: ((name: string, value: any, optionalTarget?: import("three").Object3D[]) => import("three").Object3D[]) | undefined;
+        getWorldPosition?: ((target: Vector3) => Vector3) | undefined;
+        getWorldQuaternion?: ((target: import("three").Quaternion) => import("three").Quaternion) | undefined;
+        getWorldScale?: ((target: Vector3) => Vector3) | undefined;
+        getWorldDirection?: ((target: Vector3) => Vector3) | undefined;
+        traverse?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        traverseVisible?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        traverseAncestors?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        updateMatrix?: (() => void) | undefined;
+        updateMatrixWorld?: ((force?: boolean) => void) | undefined;
+        updateWorldMatrix?: ((updateParents: boolean, updateChildren: boolean) => void) | undefined;
+        readonly isCamera?: true | undefined;
+        matrixWorldInverse?: import("three").Matrix4 | undefined;
+        projectionMatrix?: import("three").Matrix4 | undefined;
+        projectionMatrixInverse?: import("three").Matrix4 | undefined;
+        coordinateSystem?: import("three").CoordinateSystem | undefined;
+        viewport?: import("three").Vector4 | undefined;
+        position: import("angular-three").NgtVector3;
+        up: import("angular-three").NgtVector3;
+        scale: import("angular-three").NgtVector3;
+        rotation: import("angular-three").NgtEuler;
+        matrix: import("angular-three").NgtMatrix4;
+        quaternion: import("angular-three").NgtQuaternion;
+        layers: import("angular-three").NgtLayers;
+        dispose: (() => void) | null;
+        raycast: import("three").Object3D["raycast"] | null;
+    } & {
+        addEventListener: (<TEventKey extends keyof import("angular-three").NgtNodeEventMap<import("three").PerspectiveCamera>>(type: TEventKey, listener: (this: import("angular-three").NgtNodeElement<import("three").PerspectiveCamera, typeof import("three").PerspectiveCamera>, ev: import("angular-three").NgtNodeEventMap<import("three").PerspectiveCamera>[TEventKey]) => any) => void) & (<TEventKey extends keyof import("angular-three").NgtAllObject3DEventsMap>(type: TEventKey, listener: (this: any, ev: import("angular-three").NgtAllObject3DEventsMap[TEventKey]) => any) => void);
+        removeEventListener: (<TEventKey extends keyof import("angular-three").NgtNodeEventMap<import("three").PerspectiveCamera>>(type: TEventKey, listener: (this: import("angular-three").NgtNodeElement<import("three").PerspectiveCamera, typeof import("three").PerspectiveCamera>, ev: import("angular-three").NgtNodeEventMap<import("three").PerspectiveCamera>[TEventKey]) => any) => void) & (<TEventKey extends keyof import("angular-three").NgtAllObject3DEventsMap>(type: TEventKey, listener: (this: any, ev: import("angular-three").NgtAllObject3DEventsMap[TEventKey]) => any) => void);
+        clone?: ((recursive?: boolean) => import("three").PerspectiveCamera) | undefined;
+        copy?: ((object: import("three").Object3D, recursive?: boolean) => import("three").PerspectiveCamera) | undefined;
+        add?: ((...object: import("three").Object3D[]) => import("three").PerspectiveCamera) | undefined;
+        applyMatrix4?: ((matrix: import("three").Matrix4) => void) | undefined;
+        applyQuaternion?: ((quaternion: import("three").Quaternion) => import("three").PerspectiveCamera) | undefined;
+        attach: string | string[] | import("./types").NgtAttachFunction;
+        __ngt_args__: [fov?: number | undefined, aspect?: number | undefined, near?: number | undefined, far?: number | undefined];
+        view?: {
+            enabled: boolean;
+            fullWidth: number;
+            fullHeight: number;
+            offsetX: number;
+            offsetY: number;
+            width: number;
+            height: number;
+        } | null | undefined;
+        readonly type?: string | undefined;
+        readonly id?: number | undefined;
+        uuid?: string | undefined;
+        name?: string | undefined;
+        userData?: Record<string, any> | undefined;
+        rotateX?: ((angle: number) => import("three").PerspectiveCamera) | undefined;
+        rotateY?: ((angle: number) => import("three").PerspectiveCamera) | undefined;
+        rotateZ?: ((angle: number) => import("three").PerspectiveCamera) | undefined;
+        lookAt?: {
+            (vector: Vector3): void;
+            (x: number, y: number, z: number): void;
+        } | undefined;
+        toJSON?: ((meta?: import("three").JSONMeta) => import("three").PerspectiveCameraJSON) | undefined;
+        hasEventListener?: {
+            <T extends keyof import("three").Object3DEventMap>(type: T, listener: import("three").EventListener<import("three").Object3DEventMap[T], T, import("three").PerspectiveCamera>): boolean;
+            <T extends string>(type: T, listener: import("three").EventListener<{}, T, import("three").PerspectiveCamera>): boolean;
+        } | undefined;
+        dispatchEvent?: (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | undefined;
+        visible?: boolean | undefined;
+        onBeforeRender?: ((renderer: import("three").WebGLRenderer, scene: Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry, material: import("three").Material, group: import("three").Group) => void) | undefined;
+        readonly isObject3D?: true | undefined;
+        parent?: import("three").Object3D<import("three").Object3DEventMap> | null | undefined;
+        children?: import("three").Object3D<import("three").Object3DEventMap>[] | undefined;
+        readonly modelViewMatrix?: import("three").Matrix4 | undefined;
+        readonly normalMatrix?: import("three").Matrix3 | undefined;
+        matrixWorld?: import("three").Matrix4 | undefined;
+        matrixAutoUpdate?: boolean | undefined;
+        matrixWorldAutoUpdate?: boolean | undefined;
+        matrixWorldNeedsUpdate?: boolean | undefined;
+        castShadow?: boolean | undefined;
+        receiveShadow?: boolean | undefined;
+        frustumCulled?: boolean | undefined;
+        renderOrder?: number | undefined;
+        animations?: import("three").AnimationClip[] | undefined;
+        customDepthMaterial?: import("three").Material | undefined;
+        customDistanceMaterial?: import("three").Material | undefined;
+        onBeforeShadow?: ((renderer: import("three").WebGLRenderer, scene: Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry, depthMaterial: import("three").Material, group: import("three").Group) => void) | undefined;
+        onAfterShadow?: ((renderer: import("three").WebGLRenderer, scene: Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry, depthMaterial: import("three").Material, group: import("three").Group) => void) | undefined;
+        onAfterRender?: ((renderer: import("three").WebGLRenderer, scene: Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry, material: import("three").Material, group: import("three").Group) => void) | undefined;
+        setRotationFromAxisAngle?: ((axis: Vector3, angle: number) => void) | undefined;
+        setRotationFromEuler?: ((euler: import("three").Euler) => void) | undefined;
+        setRotationFromMatrix?: ((m: import("three").Matrix4) => void) | undefined;
+        setRotationFromQuaternion?: ((q: import("three").Quaternion) => void) | undefined;
+        rotateOnAxis?: ((axis: Vector3, angle: number) => import("three").PerspectiveCamera) | undefined;
+        rotateOnWorldAxis?: ((axis: Vector3, angle: number) => import("three").PerspectiveCamera) | undefined;
+        translateOnAxis?: ((axis: Vector3, distance: number) => import("three").PerspectiveCamera) | undefined;
+        translateX?: ((distance: number) => import("three").PerspectiveCamera) | undefined;
+        translateY?: ((distance: number) => import("three").PerspectiveCamera) | undefined;
+        translateZ?: ((distance: number) => import("three").PerspectiveCamera) | undefined;
+        localToWorld?: ((vector: Vector3) => Vector3) | undefined;
+        worldToLocal?: ((vector: Vector3) => Vector3) | undefined;
+        remove?: ((...object: import("three").Object3D[]) => import("three").PerspectiveCamera) | undefined;
+        removeFromParent?: (() => import("three").PerspectiveCamera) | undefined;
+        clear?: (() => import("three").PerspectiveCamera) | undefined;
+        getObjectById?: ((id: number) => import("three").Object3D | undefined) | undefined;
+        getObjectByName?: ((name: string) => import("three").Object3D | undefined) | undefined;
+        getObjectByProperty?: ((name: string, value: any) => import("three").Object3D | undefined) | undefined;
+        getObjectsByProperty?: ((name: string, value: any, optionalTarget?: import("three").Object3D[]) => import("three").Object3D[]) | undefined;
+        getWorldPosition?: ((target: Vector3) => Vector3) | undefined;
+        getWorldQuaternion?: ((target: import("three").Quaternion) => import("three").Quaternion) | undefined;
+        getWorldScale?: ((target: Vector3) => Vector3) | undefined;
+        getWorldDirection?: ((target: Vector3) => Vector3) | undefined;
+        traverse?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        traverseVisible?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        traverseAncestors?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        updateMatrix?: (() => void) | undefined;
+        updateMatrixWorld?: ((force?: boolean) => void) | undefined;
+        updateWorldMatrix?: ((updateParents: boolean, updateChildren: boolean) => void) | undefined;
+        readonly isCamera?: true | undefined;
+        matrixWorldInverse?: import("three").Matrix4 | undefined;
+        projectionMatrix?: import("three").Matrix4 | undefined;
+        projectionMatrixInverse?: import("three").Matrix4 | undefined;
+        coordinateSystem?: import("three").CoordinateSystem | undefined;
+        viewport?: import("three").Vector4 | undefined;
+        readonly isPerspectiveCamera?: true | undefined;
+        zoom?: number | undefined;
+        fov?: number | undefined;
+        aspect?: number | undefined;
+        near?: number | undefined;
+        far?: number | undefined;
+        focus?: number | undefined;
+        filmGauge?: number | undefined;
+        filmOffset?: number | undefined;
+        getFocalLength?: (() => number) | undefined;
+        setFocalLength?: ((focalLength: number) => void) | undefined;
+        getEffectiveFOV?: (() => number) | undefined;
+        getFilmWidth?: (() => number) | undefined;
+        getFilmHeight?: (() => number) | undefined;
+        getViewBounds?: ((distance: number, minTarget: import("three").Vector2, maxTarget: import("three").Vector2) => void) | undefined;
+        getViewSize?: ((distance: number, target: import("three").Vector2) => import("three").Vector2) | undefined;
+        setViewOffset?: ((fullWidth: number, fullHeight: number, x: number, y: number, width: number, height: number) => void) | undefined;
+        clearViewOffset?: (() => void) | undefined;
+        updateProjectionMatrix?: (() => void) | undefined;
+        setLens?: ((focalLength: number, frameHeight?: number) => void) | undefined;
+        position: import("angular-three").NgtVector3;
+        up: import("angular-three").NgtVector3;
+        scale: import("angular-three").NgtVector3;
+        rotation: import("angular-three").NgtEuler;
+        matrix: import("angular-three").NgtMatrix4;
+        quaternion: import("angular-three").NgtQuaternion;
+        layers: import("angular-three").NgtLayers;
+        dispose: (() => void) | null;
+        raycast: import("three").Object3D["raycast"] | null;
+    } & {
+        addEventListener: (<TEventKey extends keyof import("angular-three").NgtNodeEventMap<import("three").OrthographicCamera>>(type: TEventKey, listener: (this: import("angular-three").NgtNodeElement<import("three").OrthographicCamera, typeof import("three").OrthographicCamera>, ev: import("angular-three").NgtNodeEventMap<import("three").OrthographicCamera>[TEventKey]) => any) => void) & (<TEventKey extends keyof import("angular-three").NgtAllObject3DEventsMap>(type: TEventKey, listener: (this: any, ev: import("angular-three").NgtAllObject3DEventsMap[TEventKey]) => any) => void);
+        removeEventListener: (<TEventKey extends keyof import("angular-three").NgtNodeEventMap<import("three").OrthographicCamera>>(type: TEventKey, listener: (this: import("angular-three").NgtNodeElement<import("three").OrthographicCamera, typeof import("three").OrthographicCamera>, ev: import("angular-three").NgtNodeEventMap<import("three").OrthographicCamera>[TEventKey]) => any) => void) & (<TEventKey extends keyof import("angular-three").NgtAllObject3DEventsMap>(type: TEventKey, listener: (this: any, ev: import("angular-three").NgtAllObject3DEventsMap[TEventKey]) => any) => void);
+        clone?: ((recursive?: boolean) => import("three").OrthographicCamera) | undefined;
+        copy?: ((object: import("three").Object3D, recursive?: boolean) => import("three").OrthographicCamera) | undefined;
+        add?: ((...object: import("three").Object3D[]) => import("three").OrthographicCamera) | undefined;
+        applyMatrix4?: ((matrix: import("three").Matrix4) => void) | undefined;
+        applyQuaternion?: ((quaternion: import("three").Quaternion) => import("three").OrthographicCamera) | undefined;
+        attach: string | string[] | import("./types").NgtAttachFunction;
+        __ngt_args__: [left?: number | undefined, right?: number | undefined, top?: number | undefined, bottom?: number | undefined, near?: number | undefined, far?: number | undefined];
+        view?: {
+            enabled: boolean;
+            fullWidth: number;
+            fullHeight: number;
+            offsetX: number;
+            offsetY: number;
+            width: number;
+            height: number;
+        } | null | undefined;
+        readonly type?: string | undefined;
+        readonly id?: number | undefined;
+        uuid?: string | undefined;
+        name?: string | undefined;
+        userData?: Record<string, any> | undefined;
+        rotateX?: ((angle: number) => import("three").OrthographicCamera) | undefined;
+        rotateY?: ((angle: number) => import("three").OrthographicCamera) | undefined;
+        rotateZ?: ((angle: number) => import("three").OrthographicCamera) | undefined;
+        lookAt?: {
+            (vector: Vector3): void;
+            (x: number, y: number, z: number): void;
+        } | undefined;
+        toJSON?: ((meta?: import("three").JSONMeta) => import("three").OrthographicCameraJSON) | undefined;
+        hasEventListener?: {
+            <T extends keyof import("three").Object3DEventMap>(type: T, listener: import("three").EventListener<import("three").Object3DEventMap[T], T, import("three").OrthographicCamera>): boolean;
+            <T extends string>(type: T, listener: import("three").EventListener<{}, T, import("three").OrthographicCamera>): boolean;
+        } | undefined;
+        dispatchEvent?: (<T extends keyof import("three").Object3DEventMap>(event: import("three").BaseEvent<T> & import("three").Object3DEventMap[T]) => void) | undefined;
+        visible?: boolean | undefined;
+        onBeforeRender?: ((renderer: import("three").WebGLRenderer, scene: Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry, material: import("three").Material, group: import("three").Group) => void) | undefined;
+        readonly isObject3D?: true | undefined;
+        parent?: import("three").Object3D<import("three").Object3DEventMap> | null | undefined;
+        children?: import("three").Object3D<import("three").Object3DEventMap>[] | undefined;
+        readonly modelViewMatrix?: import("three").Matrix4 | undefined;
+        readonly normalMatrix?: import("three").Matrix3 | undefined;
+        matrixWorld?: import("three").Matrix4 | undefined;
+        matrixAutoUpdate?: boolean | undefined;
+        matrixWorldAutoUpdate?: boolean | undefined;
+        matrixWorldNeedsUpdate?: boolean | undefined;
+        castShadow?: boolean | undefined;
+        receiveShadow?: boolean | undefined;
+        frustumCulled?: boolean | undefined;
+        renderOrder?: number | undefined;
+        animations?: import("three").AnimationClip[] | undefined;
+        customDepthMaterial?: import("three").Material | undefined;
+        customDistanceMaterial?: import("three").Material | undefined;
+        onBeforeShadow?: ((renderer: import("three").WebGLRenderer, scene: Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry, depthMaterial: import("three").Material, group: import("three").Group) => void) | undefined;
+        onAfterShadow?: ((renderer: import("three").WebGLRenderer, scene: Scene, shadowCamera: import("three").Camera, geometry: import("three").BufferGeometry, depthMaterial: import("three").Material, group: import("three").Group) => void) | undefined;
+        onAfterRender?: ((renderer: import("three").WebGLRenderer, scene: Scene, camera: import("three").Camera, geometry: import("three").BufferGeometry, material: import("three").Material, group: import("three").Group) => void) | undefined;
+        setRotationFromAxisAngle?: ((axis: Vector3, angle: number) => void) | undefined;
+        setRotationFromEuler?: ((euler: import("three").Euler) => void) | undefined;
+        setRotationFromMatrix?: ((m: import("three").Matrix4) => void) | undefined;
+        setRotationFromQuaternion?: ((q: import("three").Quaternion) => void) | undefined;
+        rotateOnAxis?: ((axis: Vector3, angle: number) => import("three").OrthographicCamera) | undefined;
+        rotateOnWorldAxis?: ((axis: Vector3, angle: number) => import("three").OrthographicCamera) | undefined;
+        translateOnAxis?: ((axis: Vector3, distance: number) => import("three").OrthographicCamera) | undefined;
+        translateX?: ((distance: number) => import("three").OrthographicCamera) | undefined;
+        translateY?: ((distance: number) => import("three").OrthographicCamera) | undefined;
+        translateZ?: ((distance: number) => import("three").OrthographicCamera) | undefined;
+        localToWorld?: ((vector: Vector3) => Vector3) | undefined;
+        worldToLocal?: ((vector: Vector3) => Vector3) | undefined;
+        remove?: ((...object: import("three").Object3D[]) => import("three").OrthographicCamera) | undefined;
+        removeFromParent?: (() => import("three").OrthographicCamera) | undefined;
+        clear?: (() => import("three").OrthographicCamera) | undefined;
+        getObjectById?: ((id: number) => import("three").Object3D | undefined) | undefined;
+        getObjectByName?: ((name: string) => import("three").Object3D | undefined) | undefined;
+        getObjectByProperty?: ((name: string, value: any) => import("three").Object3D | undefined) | undefined;
+        getObjectsByProperty?: ((name: string, value: any, optionalTarget?: import("three").Object3D[]) => import("three").Object3D[]) | undefined;
+        getWorldPosition?: ((target: Vector3) => Vector3) | undefined;
+        getWorldQuaternion?: ((target: import("three").Quaternion) => import("three").Quaternion) | undefined;
+        getWorldScale?: ((target: Vector3) => Vector3) | undefined;
+        getWorldDirection?: ((target: Vector3) => Vector3) | undefined;
+        traverse?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        traverseVisible?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        traverseAncestors?: ((callback: (object: import("three").Object3D) => any) => void) | undefined;
+        updateMatrix?: (() => void) | undefined;
+        updateMatrixWorld?: ((force?: boolean) => void) | undefined;
+        updateWorldMatrix?: ((updateParents: boolean, updateChildren: boolean) => void) | undefined;
+        readonly isCamera?: true | undefined;
+        matrixWorldInverse?: import("three").Matrix4 | undefined;
+        projectionMatrix?: import("three").Matrix4 | undefined;
+        projectionMatrixInverse?: import("three").Matrix4 | undefined;
+        coordinateSystem?: import("three").CoordinateSystem | undefined;
+        viewport?: import("three").Vector4 | undefined;
+        zoom?: number | undefined;
+        near?: number | undefined;
+        far?: number | undefined;
+        setViewOffset?: ((fullWidth: number, fullHeight: number, offsetX: number, offsetY: number, width: number, height: number) => void) | undefined;
+        clearViewOffset?: (() => void) | undefined;
+        updateProjectionMatrix?: (() => void) | undefined;
+        readonly isOrthographicCamera?: true | undefined;
+        left?: number | undefined;
+        right?: number | undefined;
+        top?: number | undefined;
+        bottom?: number | undefined;
+        position: import("angular-three").NgtVector3;
+        up: import("angular-three").NgtVector3;
+        scale: import("angular-three").NgtVector3;
+        rotation: import("angular-three").NgtEuler;
+        matrix: import("angular-three").NgtMatrix4;
+        quaternion: import("angular-three").NgtQuaternion;
+        layers: import("angular-three").NgtLayers;
+        dispose: (() => void) | null;
+        raycast: import("three").Object3D["raycast"] | null;
+    }>) & {
+        manual?: boolean;
+    }) | undefined> | undefined>;
+    events: import("@angular/core").InputSignal<typeof createPointerEvents>;
+    eventSource: import("@angular/core").InputSignal<HTMLElement | ElementRef<HTMLElement> | undefined>;
+    eventPrefix: import("@angular/core").InputSignal<NonNullable<"offset" | "client" | "page" | "layer" | "screen" | undefined>>;
+    lookAt: import("@angular/core").InputSignal<Vector3 | [x: number, y: number, z: number] | undefined>;
+    created: import("@angular/core").OutputEmitterRef<NgtState>;
+    pointerMissed: import("@angular/core").OutputRef<MouseEvent>;
+    glCanvas: import("@angular/core").Signal<ElementRef<HTMLCanvasElement>>;
+    glCanvasViewContainerRef: import("@angular/core").Signal<ViewContainerRef>;
     protected hbPointerEvents: import("@angular/core").Signal<"none" | "auto">;
-    glCanvas: ElementRef<HTMLCanvasElement>;
-    private resizeEffectRef?;
+    protected resizeResult: import("@angular/core").WritableSignal<ResizeResult>;
     private configurator?;
     private glEnvironmentInjector?;
     private glRef?;
-    ngOnChanges(changes: SimpleChanges): void;
-    ngOnInit(): void;
-    onResize(result: ResizeResult): void;
-    private render;
-    private overrideChangeDetectorRef;
-    private setSceneGraphInputs;
+    constructor();
+    private noZoneResizeEffect;
+    private noZoneRender;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtCanvas, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvas, "ngt-canvas", never, { "sceneGraph": { "alias": "sceneGraph"; "required": true; }; "sceneGraphInputs": { "alias": "sceneGraphInputs"; "required": false; }; "compoundPrefixes": { "alias": "compoundPrefixes"; "required": false; }; "linear": { "alias": "linear"; "required": false; }; "legacy": { "alias": "legacy"; "required": false; }; "flat": { "alias": "flat"; "required": false; }; "orthographic": { "alias": "orthographic"; "required": false; }; "frameloop": { "alias": "frameloop"; "required": false; }; "dpr": { "alias": "dpr"; "required": false; }; "raycaster": { "alias": "raycaster"; "required": false; }; "shadows": { "alias": "shadows"; "required": false; }; "camera": { "alias": "camera"; "required": false; }; "scene": { "alias": "scene"; "required": false; }; "gl": { "alias": "gl"; "required": false; }; "eventSource": { "alias": "eventSource"; "required": false; }; "eventPrefix": { "alias": "eventPrefix"; "required": false; }; "lookAt": { "alias": "lookAt"; "required": false; }; "performance": { "alias": "performance"; "required": false; }; }, { "created": "created"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvas, "ngt-canvas", never, { "sceneGraph": { "alias": "sceneGraph"; "required": true; "isSignal": true; }; "gl": { "alias": "gl"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shadows": { "alias": "shadows"; "required": false; "isSignal": true; }; "legacy": { "alias": "legacy"; "required": false; "isSignal": true; }; "linear": { "alias": "linear"; "required": false; "isSignal": true; }; "flat": { "alias": "flat"; "required": false; "isSignal": true; }; "orthographic": { "alias": "orthographic"; "required": false; "isSignal": true; }; "frameloop": { "alias": "frameloop"; "required": false; "isSignal": true; }; "performance": { "alias": "performance"; "required": false; "isSignal": true; }; "dpr": { "alias": "dpr"; "required": false; "isSignal": true; }; "raycaster": { "alias": "raycaster"; "required": false; "isSignal": true; }; "scene": { "alias": "scene"; "required": false; "isSignal": true; }; "camera": { "alias": "camera"; "required": false; "isSignal": true; }; "events": { "alias": "events"; "required": false; "isSignal": true; }; "eventSource": { "alias": "eventSource"; "required": false; "isSignal": true; }; "eventPrefix": { "alias": "eventPrefix"; "required": false; "isSignal": true; }; "lookAt": { "alias": "lookAt"; "required": false; "isSignal": true; }; }, { "created": "created"; "pointerMissed": "pointerMissed"; }, never, never, true, never>;
 }

package/lib/directives/args.d.ts

@@ -1,10 +1,17 @@
-import { NgtCommonDirective } from './common';
 import * as i0 from "@angular/core";
-export declare class NgtArgs<TArgs extends any[] = any[]> extends NgtCommonDirective {
-    private injectedArgs;
-    set args(args: TArgs | null);
-    get args(): TArgs | null;
+export declare class NgtArgs {
+    args: import("@angular/core").InputSignal<any[] | null>;
+    private vcr;
+    private zone;
+    private template;
+    private autoEffect;
+    protected injected: boolean;
+    protected injectedArgs: any[] | null;
+    private view?;
+    constructor();
+    get value(): any[] | null;
     validate(): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NgtArgs<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtArgs<any>, "ng-template[args]", never, { "args": { "alias": "args"; "required": false; }; }, {}, never, never, true, never>;
+    private createView;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtArgs, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtArgs, "ng-template[args]", never, { "args": { "alias": "args"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/directives/selection.d.ts

@@ -0,0 +1,17 @@
+import { ElementRef } from '@angular/core';
+import { Object3D } from 'three';
+import * as i0 from "@angular/core";
+export declare class NgtSelection {
+    enabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    private source;
+    selected: import("@angular/core").Signal<(Object3D<import("three").Object3DEventMap> | ElementRef<Object3D<import("three").Object3DEventMap>>)[]>;
+    update: (updateFn: (value: (Object3D<import("three").Object3DEventMap> | ElementRef<Object3D<import("three").Object3DEventMap>>)[]) => (Object3D<import("three").Object3DEventMap> | ElementRef<Object3D<import("three").Object3DEventMap>>)[]) => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtSelection, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtSelection, "[ngtSelection]", never, { "enabled": { "alias": "ngtSelection"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export declare class NgtSelect {
+    enabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtSelect, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtSelect, "ngt-group[ngtSelect], ngt-mesh[ngtSelect]", never, { "enabled": { "alias": "ngtSelect"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/dom/events.d.ts

@@ -1,5 +1,4 @@
-import { type NgtEventManager } from '../events';
-import type { NgtState } from '../store';
-import type { NgtSignalStore } from '../utils/signal-store';
+import { NgtEventManager, NgtState } from '../types';
+import { NgtSignalStore } from '../utils/signal-store';
 export declare const supportedEvents: readonly ["click", "contextmenu", "dblclick", "pointerup", "pointerdown", "pointerover", "pointerout", "pointerenter", "pointerleave", "pointermove", "pointermissed", "pointercancel", "wheel"];
 export declare function createPointerEvents(store: NgtSignalStore<NgtState>): NgtEventManager<HTMLElement>;