angular-three 1.10.3 → 2.0.0-beta.0

package/index.d.ts

@@ -1,18 +1,15 @@
 export * from './lib/canvas';
 export * from './lib/di/before-render';
 export * from './lib/di/catalogue';
-export * from './lib/di/destroy';
 export * from './lib/di/ref';
-export * from './lib/di/run-in-context';
 export * from './lib/directives/args';
 export * from './lib/directives/parent';
 export * from './lib/directives/repeat';
 export * from './lib/loader';
-export * from './lib/loop';
-export * from './lib/pipes/push';
-export * from './lib/portal';
+export { addAfterEffect, addEffect, addTail } from './lib/loop';
+export { NgtPortal, NgtPortalContent } from './lib/portal';
 export * from './lib/routed-scene';
-export * from './lib/stores/rx-store';
+export * from './lib/stores/signal.store';
 export * from './lib/stores/store';
 export * from './lib/three-types';
 export * from './lib/types';

package/lib/canvas.d.ts

@@ -1,17 +1,11 @@
-import { ElementRef, EventEmitter, OnChanges, OnDestroy, OnInit, SimpleChanges, Type, ViewContainerRef } from '@angular/core';
-import { NgxResizeResult } from 'ngx-resize';
-import { NgtRxStore } from './stores/rx-store';
+import { ElementRef, EventEmitter, ViewContainerRef, type OnChanges, type OnInit, type SimpleChanges, type Type } from '@angular/core';
+import { type NgxResizeResult } from 'ngx-resize';
+import { NgtSignalStore } from './stores/signal.store';
 import type { NgtAnyRecord, NgtCanvasInputs, NgtDpr, NgtState } from './types';
 import * as i0 from "@angular/core";
-export declare class NgtCanvas extends NgtRxStore<NgtCanvasInputs> implements OnInit, OnDestroy, OnChanges {
-    private readonly cdr;
-    private readonly envInjector;
-    private readonly host;
-    private readonly store;
-    initialize(): void;
-    readonly hbClass = true;
-    get hbPointerEvents(): "none" | "auto";
-    sceneGraph: Type<any>;
+export declare class NgtCanvas extends NgtSignalStore<NgtCanvasInputs> implements OnInit, OnChanges {
+    #private;
+    sceneGraph: Type<unknown>;
     sceneGraphInputs: NgtAnyRecord;
     compoundPrefixes: string[];
     set linear(linear: boolean);
@@ -23,6 +17,7 @@ export declare class NgtCanvas extends NgtRxStore<NgtCanvasInputs> implements On
     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']);
@@ -32,15 +27,11 @@ export declare class NgtCanvas extends NgtRxStore<NgtCanvasInputs> implements On
     pointerMissed: EventEmitter<MouseEvent>;
     glCanvas: ElementRef<HTMLCanvasElement>;
     glAnchor: ViewContainerRef;
-    private glRef?;
-    private glEnvInjector?;
+    constructor();
+    get hbPointerEvents(): "none" | "auto";
     ngOnChanges(changes: SimpleChanges): void;
     ngOnInit(): void;
-    onResize({ width, height }: NgxResizeResult): void;
-    private storeReady;
-    ngOnDestroy(): void;
-    private overrideDetectChanges;
-    private setSceneGraphInputs;
+    onResize({ width, height, top, left }: NgxResizeResult): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtCanvas, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvas, "ngt-canvas", never, { "sceneGraph": { "alias": "sceneGraph"; "required": false; }; "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; }; "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"; "pointerMissed": "pointerMissed"; }, never, never, true, 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"; "pointerMissed": "pointerMissed"; }, never, never, true, never>;
 }

package/lib/di/before-render.d.ts

@@ -1,2 +1,6 @@
+import { Injector } from '@angular/core';
 import { NgtBeforeRenderRecord } from '../types';
-export declare function injectBeforeRender(cb: NgtBeforeRenderRecord['callback'], priority?: number): () => void;
+export declare function injectBeforeRender(cb: NgtBeforeRenderRecord['callback'], { priority, injector, }?: {
+    priority?: number;
+    injector?: Injector | null;
+}): () => void;

package/lib/di/ref.d.ts

@@ -1,12 +1,6 @@
-import { ChangeDetectorRef, ElementRef } from '@angular/core';
-import { Observable, Subscription } from 'rxjs';
-import type { NgtInstanceNode } from '../types';
-type Subscribe<T> = (callback: (current: T, previous: T | null) => void) => Subscription;
-export type NgtInjectedRef<T> = ElementRef<T> & {
-    subscribe: Subscribe<T>;
-    $: Observable<T>;
-    children$: (type?: 'objects' | 'nonObjects' | 'both') => Observable<NgtInstanceNode[]>;
-    useCDR: (cdr: ChangeDetectorRef) => void;
+import { ElementRef, Injector, Signal } from '@angular/core';
+import { NgtInstanceNode } from '../types';
+export type NgtInjectedRef<TElement> = ElementRef<TElement> & {
+    children: (type?: 'objects' | 'nonObjects' | 'both') => Signal<NgtInstanceNode[]>;
 };
-export declare function injectNgtRef<T>(initialValue?: NgtInjectedRef<T> | (T | null)): NgtInjectedRef<T>;
-export {};
+export declare function injectNgtRef<TElement>(initial?: ElementRef<TElement> | TElement, injector?: Injector | null): NgtInjectedRef<TElement>;

package/lib/directives/args.d.ts

@@ -1,10 +1,10 @@
 import { NgtCommonDirective } from './common';
 import * as i0 from "@angular/core";
-export declare class NgtArgs extends NgtCommonDirective {
-    private injectedArgs;
-    set args(args: any[] | null);
-    get args(): any[] | null;
+export declare class NgtArgs<TArgs extends any[] = any[]> extends NgtCommonDirective {
+    #private;
+    set args(args: TArgs | null);
+    get args(): TArgs | null;
     validate(): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NgtArgs, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtArgs, "[args]", never, { "args": { "alias": "args"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtArgs<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtArgs<any>, "[args]", never, { "args": { "alias": "args"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/directives/common.d.ts

@@ -1,11 +1,8 @@
-import { TemplateRef, ViewContainerRef } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare abstract class NgtCommonDirective {
-    protected readonly vcr: ViewContainerRef;
-    protected readonly template: TemplateRef<any>;
+    #private;
     protected injected: boolean;
     protected shouldCreateView: boolean;
-    private view?;
     constructor();
     abstract validate(): boolean;
     protected createView(): void;

package/lib/directives/parent.d.ts

@@ -2,7 +2,7 @@ import { NgtInjectedRef } from '../di/ref';
 import { NgtCommonDirective } from './common';
 import * as i0 from "@angular/core";
 export declare class NgtParent extends NgtCommonDirective {
-    private injectedParent;
+    #private;
     set parent(parent: string | THREE.Object3D | NgtInjectedRef<THREE.Object3D>);
     get parent(): string | THREE.Object3D | NgtInjectedRef<THREE.Object3D>;
     validate(): boolean;

package/lib/{web → dom}/events.d.ts

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

package/lib/events.d.ts

@@ -1,7 +1,7 @@
 import * as THREE from 'three';
-import type { NgtRxStore } from './stores/rx-store';
+import type { NgtSignalStore } from './stores/signal.store';
 import type { NgtDomEvent, NgtState } from './types';
-export declare function removeInteractivity(store: NgtRxStore<NgtState>, object: THREE.Object3D): void;
-export declare function createEvents(store: NgtRxStore<NgtState>): {
+export declare function removeInteractivity(store: NgtSignalStore<NgtState>, object: THREE.Object3D): void;
+export declare function createEvents(store: NgtSignalStore<NgtState>): {
     handlePointer: (name: string) => (event: NgtDomEvent) => void;
 };

package/lib/loader.d.ts

@@ -1,7 +1,11 @@
-import { type Observable } from 'rxjs';
+import { Injector, type Signal } from '@angular/core';
 import type { GLTF } from 'three/examples/jsm/loaders/GLTFLoader';
 import type { NgtBranchingReturn, NgtLoaderExtensions, NgtLoaderProto, NgtLoaderReturnType, NgtObjectMap } from './types';
 export type NgtLoaderResults<TInput extends string | string[] | Record<string, string>, TReturn> = TInput extends string[] ? TReturn[] : TInput extends object ? {
     [key in keyof TInput]: TReturn;
 } : TReturn;
-export declare function injectNgtLoader<TData, TUrl extends string | string[] | Record<string, string>, TLoaderConstructor extends NgtLoaderProto<TData>, TReturn = NgtLoaderReturnType<TData, TLoaderConstructor>>(loaderConstructorFactory: (inputs: TUrl) => TLoaderConstructor, input: TUrl | Observable<TUrl>, extensions?: NgtLoaderExtensions<TLoaderConstructor>, onProgress?: (event: ProgressEvent) => void): Observable<NgtLoaderResults<TUrl, NgtBranchingReturn<TReturn, GLTF, GLTF & NgtObjectMap>>>;
+export declare function injectNgtLoader<TData, TUrl extends string | string[] | Record<string, string>, TLoaderConstructor extends NgtLoaderProto<TData>, TReturn = NgtLoaderReturnType<TData, TLoaderConstructor>>(loaderConstructorFactory: (inputs: string[]) => TLoaderConstructor, inputs: () => TUrl, { extensions, onProgress, injector, }?: {
+    extensions?: NgtLoaderExtensions<TLoaderConstructor>;
+    onProgress?: (event: ProgressEvent) => void;
+    injector?: Injector | null;
+}): Signal<NgtLoaderResults<TUrl, NgtBranchingReturn<TReturn, GLTF, GLTF & NgtObjectMap>>>;

package/lib/loop.d.ts

@@ -1,4 +1,4 @@
-import { NgtRxStore } from './stores/rx-store';
+import type { NgtSignalStore } from './stores/signal.store';
 import type { NgtState } from './types';
 export type NgtGlobalRenderCallback = (timestamp: number) => void;
 /**
@@ -18,16 +18,16 @@ export declare const addAfterEffect: (callback: NgtGlobalRenderCallback) => () =
 export declare const addTail: (callback: NgtGlobalRenderCallback) => () => void;
 export type GlobalEffectType = 'before' | 'after' | 'tail';
 export declare function flushGlobalEffects(type: GlobalEffectType, timestamp: number): void;
-export declare function createLoop<TCanvas>(roots: Map<TCanvas, NgtRxStore<NgtState>>): {
+export declare function createLoop<TCanvas>(roots: Map<TCanvas, NgtSignalStore<NgtState>>): {
     loop: (timestamp: number) => void;
     /**
      * Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
      * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#invalidate
      */
-    invalidate: (store?: NgtRxStore<NgtState>, frames?: number) => void;
+    invalidate: (store?: NgtSignalStore<NgtState>, frames?: number) => void;
     /**
      * Advances the frameloop and runs render effects, useful for when manually rendering via `frameloop="never"`.
      * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
      */
-    advance: (timestamp: number, runGlobalEffects?: boolean, store?: NgtRxStore<NgtState>, frame?: XRFrame) => void;
+    advance: (timestamp: number, runGlobalEffects?: boolean, store?: NgtSignalStore<NgtState>, frame?: XRFrame) => void;
 };

package/lib/portal.d.ts

@@ -1,9 +1,9 @@
-import { ElementRef, EventEmitter, OnDestroy, OnInit, TemplateRef, ViewContainerRef } from '@angular/core';
+import { EventEmitter, TemplateRef, ViewContainerRef, type ElementRef, type OnInit } from '@angular/core';
 import * as THREE from 'three';
-import { NgtRxStore } from './stores/rx-store';
-import { NgtEventManager, NgtRenderState, NgtSize, NgtState } from './types';
+import { NgtSignalStore } from './stores/signal.store';
+import type { NgtEventManager, NgtRenderState, NgtSize, NgtState } from './types';
 import * as i0 from "@angular/core";
-declare const privateKeys: readonly ["get", "set", "select", "setSize", "setDpr", "setFrameloop", "events", "invalidate", "advance", "size", "viewport", "addInteraction", "removeInteraction"];
+declare const privateKeys: readonly ["get", "set", "select", "setSize", "setDpr", "setFrameloop", "events", "invalidate", "advance", "size", "viewport"];
 type PrivateKeys = (typeof privateKeys)[number];
 export interface NgtPortalInputs {
     container: ElementRef<THREE.Object3D> | THREE.Object3D;
@@ -13,24 +13,24 @@ export interface NgtPortalInputs {
         size: NgtSize;
     }>;
 }
-export declare class NgtPortalBeforeRender implements OnInit, OnDestroy {
-    private readonly portalStore;
+export declare class NgtPortalBeforeRender implements OnInit {
+    #private;
     renderPriority: number;
     parentScene: THREE.Scene;
     parentCamera: THREE.Camera;
     beforeRender: EventEmitter<NgtRenderState>;
-    private subscription?;
+    constructor();
     ngOnInit(): void;
-    ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtPortalBeforeRender, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtPortalBeforeRender, "[ngtPortalBeforeRender]", never, { "renderPriority": { "alias": "renderPriority"; "required": false; }; "parentScene": { "alias": "parentScene"; "required": false; }; "parentCamera": { "alias": "parentCamera"; "required": false; }; }, { "beforeRender": "beforeRender"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgtPortalBeforeRender, "[ngtPortalBeforeRender]", never, { "renderPriority": { "alias": "renderPriority"; "required": false; }; "parentScene": { "alias": "parentScene"; "required": true; }; "parentCamera": { "alias": "parentCamera"; "required": true; }; }, { "beforeRender": "beforeRender"; }, never, never, true, never>;
 }
 export declare class NgtPortalContent {
     constructor(vcr: ViewContainerRef, parentVcr: ViewContainerRef);
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtPortalContent, [null, { skipSelf: true; }]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<NgtPortalContent, "ng-template[ngtPortalContent]", never, {}, {}, never, never, true, never>;
 }
-export declare class NgtPortal extends NgtRxStore<NgtPortalInputs> implements OnInit, OnDestroy {
+export declare class NgtPortal extends NgtSignalStore<NgtPortalInputs> implements OnInit {
+    #private;
     set container(container: NgtPortalInputs['container']);
     set state(state: NgtPortalInputs['state']);
     autoRender: boolean;
@@ -41,19 +41,12 @@ export declare class NgtPortal extends NgtRxStore<NgtPortalInputs> implements On
     }>;
     readonly portalContentTemplate: TemplateRef<unknown>;
     readonly portalContentAnchor: ViewContainerRef;
-    private readonly parentStore;
     readonly parentScene: THREE.Scene;
     readonly parentCamera: import("./types").NgtCameraManual;
-    private readonly portalStore;
-    private readonly raycaster;
-    private readonly pointer;
     portalContentRendered: boolean;
-    private portalContentView?;
-    initialize(): void;
+    constructor();
     ngOnInit(): void;
     onBeforeRender(portal: NgtRenderState): void;
-    ngOnDestroy(): void;
-    private inject;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtPortal, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<NgtPortal, "ngt-portal", never, { "container": { "alias": "container"; "required": false; }; "state": { "alias": "state"; "required": false; }; "autoRender": { "alias": "autoRender"; "required": false; }; "autoRenderPriority": { "alias": "autoRenderPriority"; "required": false; }; }, { "beforeRender": "beforeRender"; }, ["portalContentTemplate"], never, true, never>;
 }

package/lib/renderer/renderer.d.ts

@@ -1,13 +1,9 @@
-import { Renderer2, RendererFactory2, RendererType2 } from '@angular/core';
-import { NgtAnyRecord } from '../types';
-import { NgtRendererNode, NgtRendererState, NgtRendererStore } from './store';
+import { ChangeDetectorRef, NgZone, Renderer2, RendererFactory2, type RendererType2 } from '@angular/core';
+import type { NgtAnyRecord } from '../types';
+import { NgtRendererStore, type NgtRendererNode, type NgtRendererState } from './store';
 import * as i0 from "@angular/core";
 export declare class NgtRendererFactory implements RendererFactory2 {
-    private readonly delegateRendererFactory;
-    private readonly catalogue;
-    private readonly rendererMap;
-    private readonly routedSet;
-    private readonly rendererStore;
+    #private;
     createRenderer(hostElement: any, type: RendererType2 | null): Renderer2;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtRendererFactory, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<NgtRendererFactory>;
@@ -19,8 +15,10 @@ export declare class NgtRenderer implements Renderer2 {
     private readonly delegate;
     private readonly store;
     private readonly catalogue;
+    private readonly zone;
+    private readonly cdr;
     private root;
-    constructor(delegate: Renderer2, store: NgtRendererStore, catalogue: Record<string, new (...args: any[]) => any>, root?: boolean);
+    constructor(delegate: Renderer2, store: NgtRendererStore, catalogue: Record<string, new (...args: any[]) => any>, zone: NgZone, cdr: ChangeDetectorRef, root?: boolean);
     createElement(name: string, namespace?: string | null | undefined): NgtAnyRecord & {
         __ngt_renderer__: NgtRendererState;
     };

package/lib/renderer/store.d.ts

@@ -1,11 +1,10 @@
-import { ChangeDetectorRef, Injector } from '@angular/core';
-import { NgtInjectedRef } from '../di/ref';
+import { type Injector } from '@angular/core';
+import type { NgtInjectedRef } from '../di/ref';
 import { NgtStore } from '../stores/store';
 import type { NgtAnyRecord } from '../types';
 import { NgtRendererClassId } from './enums';
 export type NgtRendererRootState = {
     store: NgtStore;
-    cdr: ChangeDetectorRef;
     compoundPrefixes: string[];
     document: Document;
     portals: Array<NgtRendererNode>;
@@ -32,8 +31,8 @@ export type NgtRendererNode = {
     __ngt_renderer__: NgtRendererState;
 };
 export declare class NgtRendererStore {
+    #private;
     private readonly root;
-    private readonly comments;
     constructor(root: NgtRendererRootState);
     createNode(type: NgtRendererState[NgtRendererClassId.type], node: NgtAnyRecord): NgtAnyRecord & {
         __ngt_renderer__: NgtRendererState;
@@ -50,7 +49,6 @@ export declare class NgtRendererStore {
     isCompound(name: string): boolean;
     isDOM(node: NgtAnyRecord): boolean;
     get rootScene(): import("three").Scene;
-    get rootCdr(): ChangeDetectorRef;
     get portals(): NgtRendererNode[];
     getClosestParentWithInstance(node: NgtRendererNode): NgtRendererNode | null;
     getClosestParentWithCompound(node: NgtRendererNode): NgtRendererNode | null | undefined;

package/lib/renderer/utils.d.ts

@@ -1,6 +1,8 @@
-import { ChangeDetectorRef } from '@angular/core';
+import { ChangeDetectorRef, NgZone } from '@angular/core';
+import { supportedEvents } from '../dom/events';
 import type { NgtEventHandlers, NgtInstanceNode } from '../types';
-import { supportedEvents } from '../web/events';
+export declare const ROUTED_SCENE = "__ngt_renderer_is_routed_scene__";
+export declare const SPECIAL_INTERNAL_ADD_COMMENT = "__ngt_renderer_add_comment__";
 export declare const SPECIAL_DOM_TAG: {
     readonly NGT_PORTAL: "ngt-portal";
     readonly NGT_PRIMITIVE: "ngt-primitive";
@@ -15,6 +17,6 @@ export declare const SPECIAL_PROPERTIES: {
 };
 export declare function attachThreeChild(parent: NgtInstanceNode, child: NgtInstanceNode): void;
 export declare function removeThreeChild(parent: NgtInstanceNode, child: NgtInstanceNode, dispose?: boolean): void;
-export declare function processThreeEvent(instance: NgtInstanceNode, priority: number, eventName: string, callback: (event: any) => void, cdr: ChangeDetectorRef, targetCdr?: ChangeDetectorRef): () => void;
-export declare function eventToHandler(callback: (event: any) => void, cdr: ChangeDetectorRef, targetCdr?: ChangeDetectorRef): (event: Parameters<Exclude<NgtEventHandlers[(typeof supportedEvents)[number]], undefined>>[0]) => void;
+export declare function processThreeEvent(instance: NgtInstanceNode, priority: number, eventName: string, callback: (event: any) => void, zone: NgZone, cdr: ChangeDetectorRef): () => void;
+export declare function eventToHandler(callback: (event: any) => void): (event: Parameters<Exclude<NgtEventHandlers[(typeof supportedEvents)[number]], undefined>>[0]) => void;
 export declare function kebabToPascal(str: string): string;

package/lib/routed-scene.d.ts

@@ -1,8 +1,10 @@
+import { ChangeDetectorRef } from '@angular/core';
 import { Router } from '@angular/router';
+import { ROUTED_SCENE } from './renderer/utils';
 import * as i0 from "@angular/core";
 export declare class NgtRoutedScene {
-    static isRoutedScene: boolean;
-    constructor(router: Router);
+    static [ROUTED_SCENE]: boolean;
+    constructor(router: Router, cdr: ChangeDetectorRef);
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtRoutedScene, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<NgtRoutedScene, "ngt-routed-scene", never, {}, {}, never, never, true, never>;
 }

package/lib/stores/signal.store.d.ts

@@ -0,0 +1,19 @@
+import { type CreateComputedOptions, type Signal } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class NgtSignalStore<TState extends object> {
+    #private;
+    constructor(initialState?: Partial<TState>);
+    select<TKey1 extends keyof TState, TKey2 extends keyof TState[TKey1], TKey3 extends keyof TState[TKey1][TKey2], TKey4 extends keyof TState[TKey1][TKey2][TKey3]>(key1: TKey1, key2: TKey2, key3: TKey3, key4: TKey4, options?: CreateComputedOptions<TState[TKey1][TKey2][TKey3][TKey4]>): Signal<TState[TKey1][TKey2][TKey3][TKey4]>;
+    select<TKey1 extends keyof TState, TKey2 extends keyof TState[TKey1], TKey3 extends keyof TState[TKey1][TKey2]>(key1: TKey1, key2: TKey2, key3: TKey3, options?: CreateComputedOptions<TState[TKey1][TKey2][TKey3]>): Signal<TState[TKey1][TKey2][TKey3]>;
+    select<TKey1 extends keyof TState, TKey2 extends keyof TState[TKey1]>(key1: TKey1, key2: TKey2, options?: CreateComputedOptions<TState[TKey1][TKey2]>): Signal<TState[TKey1][TKey2]>;
+    select<TKey extends keyof TState>(key: TKey, options?: CreateComputedOptions<TState[TKey]>): Signal<TState[TKey]>;
+    select(options?: CreateComputedOptions<TState>): Signal<TState>;
+    get<TKey1 extends keyof TState, TKey2 extends keyof TState[TKey1], TKey3 extends keyof TState[TKey1][TKey2], TKey4 extends keyof TState[TKey1][TKey2][TKey3]>(key1: TKey1, key2: TKey2, key3: TKey3, key4: TKey4): TState[TKey1][TKey2][TKey3][TKey4];
+    get<TKey1 extends keyof TState, TKey2 extends keyof TState[TKey1], TKey3 extends keyof TState[TKey1][TKey2]>(key1: TKey1, key2: TKey2, key3: TKey3): TState[TKey1][TKey2][TKey3];
+    get<TKey1 extends keyof TState, TKey2 extends keyof TState[TKey1]>(key1: TKey1, key2: TKey2): TState[TKey1][TKey2];
+    get<TKey extends keyof TState>(key: TKey): TState[TKey];
+    get(): TState;
+    set(state: Partial<TState> | ((previous: TState) => Partial<TState>)): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtSignalStore<any>, [{ optional: true; }]>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NgtSignalStore<any>>;
+}

package/lib/stores/store.d.ts

@@ -1,16 +1,13 @@
 import type { NgtCanvasInputs, NgtState } from '../types';
-import { NgtRxStore } from './rx-store';
+import { NgtSignalStore } from './signal.store';
 import * as i0 from "@angular/core";
-export declare const rootStateMap: Map<Element, NgtRxStore<NgtState, NgtState & Record<string, any>>>;
-export declare class NgtStore extends NgtRxStore<NgtState> {
-    private readonly parentStore;
-    private readonly window;
+export declare const rootStateMap: Map<Element, NgtSignalStore<NgtState>>;
+export declare class NgtStore extends NgtSignalStore<NgtState> {
+    #private;
     isInit: boolean;
     init(): void;
     configure(inputs: NgtCanvasInputs, canvasElement: HTMLCanvasElement): void;
     destroy(canvas: HTMLCanvasElement): void;
-    private resize;
-    private invalidate;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtStore, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<NgtStore>;
 }

package/lib/types.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="webxr" />
-import type { ElementRef, EventEmitter } from '@angular/core';
-import type { BehaviorSubject } from 'rxjs';
+import type { ElementRef, EventEmitter, WritableSignal } from '@angular/core';
 import * as THREE from 'three';
-import type { NgtRxStore } from './stores/rx-store';
+import type { NgtSignalStore } from './stores/signal.store';
 export type NgtAnyRecord = Record<string, any>;
 export type NgtProperties<T> = Pick<T, {
     [K in keyof T]: T[K] extends (_: any) => any ? never : K;
@@ -53,11 +52,11 @@ export type NgtCamera = THREE.OrthographicCamera | THREE.PerspectiveCamera;
 export type NgtCameraManual = NgtCamera & {
     manual?: boolean;
 };
-export interface NgtIntersection extends THREE.Intersection {
+export type NgtIntersection = THREE.Intersection & {
     /** The event source (the object which registered the handler) */
     eventObject: THREE.Object3D;
-}
-export interface NgtIntersectionEvent<TSourceEvent> extends NgtIntersection {
+};
+export type NgtIntersectionEvent<TSourceEvent> = NgtIntersection & {
     /** The event source (the object which registered the handler) */
     eventObject: THREE.Object3D;
     /** An array of intersections */
@@ -78,7 +77,7 @@ export interface NgtIntersectionEvent<TSourceEvent> extends NgtIntersection {
     nativeEvent: TSourceEvent;
     /** If the event was stopped by calling stopPropagation */
     stopped: boolean;
-}
+};
 export type NgtThreeEvent<TEvent> = NgtIntersectionEvent<TEvent> & NgtProperties<TEvent>;
 export type NgtDomEvent = PointerEvent | MouseEvent | WheelEvent;
 export type NgtEventHandlers = {
@@ -99,8 +98,8 @@ export type NgtEventHandlers = {
 export type NgtEvents = {
     [TEvent in keyof NgtEventHandlers]-?: EventListener;
 };
-export type NgtFilterFunction = (items: THREE.Intersection[], store: NgtRxStore<NgtState>) => THREE.Intersection[];
-export type NgtComputeFunction = (event: NgtDomEvent, root: NgtRxStore<NgtState>, previous?: NgtRxStore<NgtState>) => void;
+export type NgtFilterFunction = (items: THREE.Intersection[], store: NgtSignalStore<NgtState>) => THREE.Intersection[];
+export type NgtComputeFunction = (event: NgtDomEvent, root: NgtSignalStore<NgtState>, previous?: NgtSignalStore<NgtState>) => void;
 export type NgtEventManager<TTarget> = {
     /** Determines if the event layer is active */
     enabled: boolean;
@@ -137,25 +136,25 @@ export type NgtBeforeRenderEvent<TObject extends NgtInstanceNode = NgtInstanceNo
 };
 export type NgtBeforeRenderRecord = {
     callback: (state: NgtRenderState) => void;
-    store: NgtRxStore<NgtState>;
+    store: NgtSignalStore<NgtState>;
     priority?: number;
 };
 export type NgtInternalState = {
     active: boolean;
     priority: number;
     frames: number;
-    lastEvent: NgtDomEvent | null;
+    lastEvent: ElementRef<NgtDomEvent | null>;
     interaction: THREE.Object3D[];
     hovered: Map<string, NgtThreeEvent<NgtDomEvent>>;
     subscribers: NgtBeforeRenderRecord[];
     capturedMap: Map<number, Map<THREE.Object3D, NgtPointerCaptureTarget>>;
     initialClick: [x: number, y: number];
     initialHits: THREE.Object3D[];
-    subscribe: (callback: NgtBeforeRenderRecord['callback'], priority?: number, store?: NgtRxStore<NgtState>) => () => void;
+    subscribe: (callback: NgtBeforeRenderRecord['callback'], priority?: number, store?: NgtSignalStore<NgtState>) => () => void;
 };
 export type NgtState = {
-    get: NgtRxStore<NgtState>['get'];
-    set: NgtRxStore<NgtState>['set'];
+    get: NgtSignalStore<NgtState>['get'];
+    set: NgtSignalStore<NgtState>['set'];
     /** when all building blocks are initialized */
     ready: boolean;
     /** The instance of the renderer */
@@ -211,25 +210,23 @@ export type NgtState = {
     /** When the canvas was clicked but nothing was hit */
     onPointerMissed?: (event: MouseEvent) => void;
     /** If this state model is layerd (via createPortal) then this contains the previous layer */
-    previousStore?: NgtRxStore<NgtState>;
+    previousStore?: NgtSignalStore<NgtState>;
     /** Internals */
     internal: NgtInternalState;
-    addInteraction: (instance: THREE.Object3D) => void;
-    removeInteraction: (uuid: string) => void;
 };
-export type NgtAttachFunction<TChild = any, TParent = any> = (parent: TParent, child: TChild, store: NgtRxStore<NgtState>) => void | (() => void);
+export type NgtAttachFunction<TChild = any, TParent = any> = (parent: TParent, child: TChild, store: NgtSignalStore<NgtState>) => void | (() => void);
 export type NgtAfterAttach<TParent extends NgtInstanceNode = NgtInstanceNode, TChild extends NgtInstanceNode = NgtInstanceNode> = {
     parent: TParent;
     node: TChild;
 };
 export type NgtInstanceLocalState = {
     /** the state getter of the canvas that the instance is being rendered to */
-    store: NgtRxStore<NgtState>;
-    nonObjects: BehaviorSubject<NgtInstanceNode[]>;
-    objects: BehaviorSubject<NgtInstanceNode[]>;
+    store: NgtSignalStore<NgtState>;
+    nonObjects: WritableSignal<NgtInstanceNode[]>;
+    objects: WritableSignal<NgtInstanceNode[]>;
     add: (instance: NgtInstanceNode, type: 'objects' | 'nonObjects') => void;
     remove: (instance: NgtInstanceNode, type: 'objects' | 'nonObjects') => void;
-    parent: NgtInstanceNode | null;
+    parent: WritableSignal<NgtInstanceNode | null>;
     primitive?: boolean;
     eventCount: number;
     handlers: Partial<NgtEventHandlers>;
@@ -248,7 +245,7 @@ export type NgtGLRenderer = {
     render: (scene: THREE.Scene, camera: THREE.Camera) => void;
 };
 export type NgtGLOptions = NgtGLRenderer | ((canvas: HTMLCanvasElement) => NgtGLRenderer) | Partial<NgtProperties<THREE.WebGLRenderer> | THREE.WebGLRendererParameters> | undefined;
-export interface NgtObjectMap {
+export type NgtObjectMap = {
     nodes: {
         [name: string]: THREE.Object3D;
     };
@@ -256,7 +253,7 @@ export interface NgtObjectMap {
         [name: string]: THREE.Material;
     };
     [key: string]: any;
-}
+};
 export type NgtCanvasInputs = {
     /** A threejs renderer instance or props that go into the default renderer */
     gl?: NgtGLOptions;
@@ -300,7 +297,7 @@ export type NgtCanvasInputs = {
         manual?: boolean;
     };
     /** An R3F event manager to manage elements' pointer events */
-    events?: (store: NgtRxStore<NgtState>) => NgtEventManager<HTMLElement>;
+    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" */

package/lib/utils/attach.d.ts

@@ -1,9 +1,9 @@
-import { NgtRxStore } from '../stores/rx-store';
+import { NgtSignalStore } from '../stores/signal.store';
 import type { NgtAnyRecord, NgtAttachFunction, NgtState } from '../types';
 export declare function attach(object: NgtAnyRecord, value: unknown, paths?: string[]): void;
 export declare function detach(parent: NgtAnyRecord, child: NgtAnyRecord, attachProp: string[] | NgtAttachFunction): void;
 export declare function createAttachFunction<TParent = any, TChild = any>(cb: (params: {
     parent: TParent;
     child: TChild;
-    store: NgtRxStore<NgtState>;
+    store: NgtSignalStore<NgtState>;
 }) => (() => void) | void): NgtAttachFunction<TChild, TParent>;

package/lib/utils/instance.d.ts

@@ -1,4 +1,4 @@
 import type { NgtAnyRecord, NgtInstanceLocalState, NgtInstanceNode } from '../types';
 export declare function getLocalState<TInstance extends object = NgtAnyRecord>(obj: TInstance | undefined): NgtInstanceLocalState;
 export declare function invalidateInstance<TInstance extends object>(instance: TInstance): void;
-export declare function prepare<TInstance extends object = NgtAnyRecord>(object: TInstance | (() => TInstance), localState?: Partial<NgtInstanceLocalState>): NgtInstanceNode<TInstance>;
+export declare function prepare<TInstance extends object = NgtAnyRecord>(object: TInstance, localState?: Partial<NgtInstanceLocalState>): NgtInstanceNode<TInstance>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-three",
-  "version": "1.10.3",
+  "version": "2.0.0-beta.0",
   "publishConfig": {
     "access": "public"
   },
@@ -21,15 +21,14 @@
   ],
   "license": "MIT",
   "peerDependencies": {
-    "@angular/common": "^15.1.0 || ^16.0.0",
-    "@angular/core": "^15.1.0 || 16.0.0",
+    "@angular/common": "^16.0.0",
+    "@angular/core": "^16.0.0",
     "three": "^0.148.0 || ^0.149.0 || ^0.150.0 || ^0.151.0 || ^0.152.0",
-    "rxjs": "7.8.0",
-    "@angular/router": "16.0.0"
+    "@angular/router": "16.0.0",
+    "rxjs": "7.8.0"
   },
   "dependencies": {
-    "ngx-resize": "^1.0.0",
-    "@rx-angular/state": "^14.0.0",
+    "ngx-resize": "^2.0.0",
     "tslib": "^2.3.0",
     "@nx/devkit": "^16.0.0",
     "nx": "^16.0.0"

package/plugin/package.json

@@ -5,5 +5,5 @@
   },
   "main": "./src/index.js",
   "types": "./src/index.d.ts",
-  "version": "1.10.3"
+  "version": "2.0.0-beta.0"
 }