angular-three 2.0.0-beta.21 → 2.0.0-beta.223

package/index.d.ts

@@ -1,10 +1,5 @@
-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 * from './lib/directives/repeat';
-export { type NgtCamera, type NgtThreeEvent } from './lib/events';
 export * from './lib/instance';
 export * from './lib/loader';
 export { addAfterEffect, addEffect, addTail } from './lib/loop';
@@ -13,14 +8,15 @@ export * from './lib/ref';
 export * from './lib/renderer';
 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 * from './lib/utils/assert-injection-context';
 export { createAttachFunction } from './lib/utils/attach';
-export * from './lib/utils/create-injection-token';
+export * from './lib/utils/before-render';
+export * from './lib/utils/cd-aware-signal';
+export * from './lib/utils/create-api-token';
 export * from './lib/utils/is';
 export * from './lib/utils/make';
-export * from './lib/utils/safe-detect-changes';
 export * from './lib/utils/signal-store';
 export * from './lib/utils/update';
+export type { NgtCamera, NgtThreeEvent } from './lib/events';
+export type * from './lib/three-types';
+export type * from './lib/types';

package/lib/canvas.d.ts

@@ -1,16 +1,18 @@
-import { ElementRef, EventEmitter, type OnChanges, type OnInit, type SimpleChanges, type Type } from '@angular/core';
-import { type NgxResizeResult } from 'ngx-resize';
+import { ElementRef, EventEmitter, 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 NgtCanvasElement } from './roots';
+import { type NgtDpr, type NgtPerformance, type NgtRendererLike, 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 * as i0 from "@angular/core";
-export type NgtGLOptions = NgtRenderer | ((canvas: HTMLCanvasElement) => NgtRenderer) | Partial<NgtProperties<THREE.WebGLRenderer> | THREE.WebGLRendererParameters> | undefined;
+export type NgtGLOptions = NgtRendererLike | ((canvas: NgtCanvasElement) => NgtRendererLike) | Partial<NgtProperties<THREE.WebGLRenderer> | THREE.WebGLRendererParameters> | undefined;
 export type NgtCanvasInputs = {
     /** A threejs renderer instance or props that go into the default renderer */
     gl?: NgtGLOptions;
+    /** Dimensions to fit the renderer to. Will measure canvas dimensions if omitted */
     size?: NgtSize;
     /**
      * Enables shadows (by default PCFsoft). Can accept `gl.shadowMap` options for fine-tuning,
@@ -23,7 +25,7 @@ export type NgtCanvasInputs = {
      * @see https://threejs.org/docs/#manual/en/introduction/Color-management
      */
     legacy?: boolean;
-    /** Switch off automatic sRGB encoding and gamma correction */
+    /** Switch off automatic sRGB color space and gamma correction */
     linear?: boolean;
     /** Use `THREE.NoToneMapping` instead of `THREE.ACESFilmicToneMapping` */
     flat?: boolean;
@@ -59,49 +61,34 @@ export type NgtCanvasInputs = {
     /** 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;
+    private environmentInjector;
+    private injector;
+    sceneGraph: Type<any>;
     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']);
+    private sceneGraphInputs;
+    set _sceneGraphInputs(value: NgtAnyRecord);
+    private canvasInputs;
+    set _canvasInputs(value: Partial<NgtCanvasInputs>);
     created: EventEmitter<NgtState>;
-    private inputsEventSource;
-    protected hbPointerEvents: import("@angular/core").Signal<"none" | "auto">;
     glCanvas: ElementRef<HTMLCanvasElement>;
-    private resizeEffectRef?;
+    protected resizeResult: import("@angular/core").WritableSignal<ResizeResult>;
+    private eventSource;
+    protected hbPointerEvents: import("@angular/core").Signal<"none" | "auto">;
     private configurator?;
     private glEnvironmentInjector?;
     private glRef?;
-    ngOnChanges(changes: SimpleChanges): void;
-    ngOnInit(): void;
-    onResize(result: NgxResizeResult): void;
-    private render;
-    private overrideChangeDetectorRef;
+    constructor();
+    private noZoneResizeEffect;
+    private noZoneRender;
+    private noZoneSceneGraphInputsEffect;
     private setSceneGraphInputs;
     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; }; "compoundPrefixes": { "alias": "compoundPrefixes"; "required": false; }; "_sceneGraphInputs": { "alias": "sceneGraphInputs"; "required": false; }; "_canvasInputs": { "alias": "options"; "required": false; }; }, { "created": "created"; }, never, never, true, never>;
 }

package/lib/directives/common.d.ts

@@ -1,9 +1,20 @@
 import * as i0 from "@angular/core";
+export declare const injectNodeType: {
+    (): "" | "parent" | "args";
+    (injectOptions: import("@angular/core").InjectOptions & {
+        optional?: false | undefined;
+    } & {
+        injector?: import("@angular/core").Injector | undefined;
+    }): "" | "parent" | "args";
+    (injectOptions: import("@angular/core").InjectOptions & {
+        injector?: import("@angular/core").Injector | undefined;
+    }): "" | "parent" | "args" | null;
+}, provideNodeType: (() => import("@angular/core").Provider) & (((value: "" | (() => "")) => import("@angular/core").Provider) | ((value: "parent" | (() => "parent")) => import("@angular/core").Provider) | ((value: "args" | (() => "args")) => import("@angular/core").Provider));
 export declare abstract class NgtCommonDirective {
-    protected static processComment: boolean;
     private vcr;
     private zone;
     private template;
+    private nodeType;
     protected injected: boolean;
     protected shouldCreateView: boolean;
     private view?;

package/lib/events.d.ts

@@ -51,7 +51,7 @@ export type NgtEvents = {
 };
 export type NgtFilterFunction = (items: THREE.Intersection[], store: NgtSignalStore<NgtState>) => THREE.Intersection[];
 export type NgtComputeFunction = (event: NgtDomEvent, root: NgtSignalStore<NgtState>, previous: NgtSignalStore<NgtState> | null) => void;
-export interface NgtEventManager<TTarget> {
+export type NgtEventManager<TTarget> = {
     /** Determines if the event layer is active */
     enabled: boolean;
     /** Event layer priority, higher prioritized layers come first and may stop(-propagate) lower layer  */
@@ -72,7 +72,7 @@ export interface NgtEventManager<TTarget> {
      *  explicit user interaction, for instance when the camera moves a hoverable object underneath the cursor.
      */
     update?: () => void;
-}
+};
 export interface NgtPointerCaptureTarget {
     intersection: NgtIntersection;
     target: Element;

package/lib/instance.d.ts

@@ -1,4 +1,4 @@
-import { EventEmitter, type WritableSignal } from '@angular/core';
+import type { EventEmitter, Signal } from '@angular/core';
 import type { NgtEventHandlers } from './events';
 import type { NgtState } from './store';
 import type { NgtAnyRecord } from './types';
@@ -8,15 +8,24 @@ export type NgtAfterAttach<TChild extends NgtInstanceNode = NgtInstanceNode, TPa
     parent: TParent;
     node: TChild;
 };
-export type NgtInstanceLocalState = {
-    /** the state getter of the canvas that the instance is being rendered to */
+export type NgtLocalInstanceState = {
+    objects: NgtInstanceNode[];
+    nonObjects: NgtInstanceNode[];
+    parent: NgtInstanceNode | null;
+    nativeProps: NgtAnyRecord;
+};
+export type NgtLocalState = {
+    /** the store of the canvas that the instance is being rendered to */
     store: NgtSignalStore<NgtState>;
-    nonObjects: WritableSignal<NgtInstanceNode[]>;
-    objects: WritableSignal<NgtInstanceNode[]>;
+    instanceStore: NgtSignalStore<NgtLocalInstanceState>;
+    parent: Signal<NgtLocalInstanceState['parent']>;
+    objects: Signal<NgtLocalInstanceState['objects']>;
+    nonObjects: Signal<NgtLocalInstanceState['nonObjects']>;
+    nativeProps: Signal<NgtLocalInstanceState['nativeProps']>;
     add: (instance: NgtInstanceNode, type: 'objects' | 'nonObjects') => void;
     remove: (instance: NgtInstanceNode, type: 'objects' | 'nonObjects') => void;
-    nativeProps: NgtSignalStore<NgtAnyRecord>;
-    parent: WritableSignal<NgtInstanceNode | null>;
+    setNativeProps: (key: string, value: any) => void;
+    setParent: (parent: NgtInstanceNode | null) => void;
     primitive?: boolean;
     eventCount: number;
     handlers: Partial<NgtEventHandlers>;
@@ -29,8 +38,8 @@ export type NgtInstanceLocalState = {
     afterAttach?: EventEmitter<NgtAfterAttach>;
 };
 export type NgtInstanceNode<TNode = any> = {
-    __ngt__: NgtInstanceLocalState;
+    __ngt__: NgtLocalState;
 } & NgtAnyRecord & TNode;
-export declare function getLocalState<TInstance extends object = NgtAnyRecord>(obj: TInstance | undefined): NgtInstanceLocalState;
+export declare function getLocalState<TInstance extends object>(obj: TInstance | undefined): NgtLocalState | undefined;
 export declare function invalidateInstance<TInstance extends object>(instance: TInstance): void;
-export declare function prepare<TInstance extends object = NgtAnyRecord>(object: TInstance, localState?: Partial<NgtInstanceLocalState>): NgtInstanceNode<TInstance>;
+export declare function prepare<TInstance extends object = NgtAnyRecord>(object: TInstance, localState?: Partial<NgtLocalState>): NgtInstanceNode<TInstance>;

package/lib/loader.d.ts

@@ -1,8 +1,10 @@
 import { Injector, type Signal } from '@angular/core';
-import type { GLTF } from 'three/examples/jsm/loaders/GLTFLoader';
 import { type NgtObjectMap } from './utils/make';
+export type NgtGLTFLike = {
+    scene: THREE.Object3D;
+};
 export interface NgtLoader<T> extends THREE.Loader {
-    load(url: string, onLoad?: (result: T) => void, onProgress?: (event: ProgressEvent) => void, onError?: (event: ErrorEvent) => void): unknown;
+    load(url: string, onLoad?: (result: T) => void, onProgress?: (event: ProgressEvent) => void, onError?: (event: unknown) => void): unknown;
     loadAsync(url: string, onProgress?: (event: ProgressEvent) => void): Promise<T>;
 }
 export type NgtLoaderProto<T> = new (...args: any) => NgtLoader<T extends unknown ? any : T>;
@@ -15,8 +17,15 @@ export type NgtBranchingReturn<T, Parent, Coerced> = NgtConditionalType<T, Paren
 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: string[]) => TLoaderConstructor, inputs: () => TUrl, { extensions, onProgress, injector, }?: {
+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;
-}): Signal<NgtLoaderResults<TUrl, NgtBranchingReturn<TReturn, GLTF, GLTF & NgtObjectMap>> | null>;
+}): Signal<NgtLoaderResults<TUrl, NgtBranchingReturn<TReturn, NgtGLTFLike, NgtGLTFLike & NgtObjectMap>> | null>;
+declare namespace _injectNgtLoader {
+    var preload: <TData, TUrl extends string | string[] | Record<string, string>, TLoaderConstructor extends NgtLoaderProto<TData>>(loaderConstructorFactory: (inputs: string[]) => TLoaderConstructor, inputs: () => TUrl, extensions?: NgtLoaderExtensions<TLoaderConstructor> | undefined) => void;
+    var destroy: () => void;
+}
+export type NgtInjectedLoader = typeof _injectNgtLoader;
+export declare const injectNgtLoader: NgtInjectedLoader;
+export {};

package/lib/loop.d.ts

@@ -19,19 +19,6 @@ export declare const addAfterEffect: (callback: NgtGlobalRenderCallback) => () =
 export declare const addTail: (callback: NgtGlobalRenderCallback) => () => void;
 export type NgtGlobalEffectType = 'before' | 'after' | 'tail';
 export declare function flushGlobalEffects(type: NgtGlobalEffectType, timestamp: number): void;
-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?: 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?: NgtSignalStore<NgtState>, frame?: XRFrame) => void;
-};
 export declare const injectNgtLoop: {
     (): {
         loop: (timestamp: number) => void;
@@ -48,6 +35,8 @@ export declare const injectNgtLoop: {
     };
     (injectOptions: import("@angular/core").InjectOptions & {
         optional?: false | undefined;
+    } & {
+        injector?: import("@angular/core").Injector | undefined;
     }): {
         loop: (timestamp: number) => void;
         /**
@@ -61,7 +50,9 @@ export declare const injectNgtLoop: {
          */
         advance: (timestamp: number, runGlobalEffects?: boolean, store?: NgtSignalStore<NgtState>, frame?: XRFrame) => void;
     };
-    (injectOptions: import("@angular/core").InjectOptions): {
+    (injectOptions: import("@angular/core").InjectOptions & {
+        injector?: import("@angular/core").Injector | undefined;
+    }): {
         loop: (timestamp: number) => void;
         /**
          * Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
@@ -74,18 +65,4 @@ export declare const injectNgtLoop: {
          */
         advance: (timestamp: number, runGlobalEffects?: boolean, store?: NgtSignalStore<NgtState>, frame?: XRFrame) => void;
     } | null;
-}, NGT_LOOP: import("@angular/core").InjectionToken<{
-    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?: 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?: NgtSignalStore<NgtState>, frame?: XRFrame) => void;
-}>;
-export type NgtLoop = ReturnType<typeof createLoop>;
-export {};
+};

package/lib/portal.d.ts

@@ -1,7 +1,7 @@
-import { EventEmitter, TemplateRef, ViewContainerRef, type ElementRef, type OnInit } from '@angular/core';
+import { ElementRef, TemplateRef, ViewContainerRef } from '@angular/core';
 import * as THREE from 'three';
 import type { NgtEventManager } from './events';
-import { type NgtRenderState, type NgtSize, type NgtState } from './store';
+import { type NgtSize, type NgtState } from './store';
 import * as i0 from "@angular/core";
 declare const privateKeys: readonly ["get", "set", "select", "setSize", "setDpr", "setFrameloop", "events", "invalidate", "advance", "size", "viewport"];
 type PrivateKeys = (typeof privateKeys)[number];
@@ -13,49 +13,41 @@ export interface NgtPortalInputs {
         size: NgtSize;
     }>;
 }
-export declare class NgtPortalBeforeRender implements OnInit {
+export declare class NgtPortalBeforeRender {
     private portalStore;
     private injector;
     renderPriority: number;
     parentScene: THREE.Scene;
     parentCamera: THREE.Camera;
-    beforeRender: EventEmitter<NgtRenderState>;
-    ngOnInit(): void;
+    constructor();
+    onPointerOver(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtPortalBeforeRender, 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>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgtPortalBeforeRender, "ngt-portal-before-render", never, { "renderPriority": { "alias": "renderPriority"; "required": false; }; "parentScene": { "alias": "parentScene"; "required": true; }; "parentCamera": { "alias": "parentCamera"; "required": true; }; }, {}, 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 implements OnInit {
-    private inputs;
-    set container(container: NgtPortalInputs['container']);
-    set portalState(state: NgtPortalInputs['state']);
-    autoRender: boolean;
+export declare class NgtPortal {
+    private portalInputs;
+    set _portalInputs(value: Partial<NgtPortalInputs>);
+    private autoRender;
+    set _autoRender(value: boolean);
     autoRenderPriority: number;
-    beforeRender: EventEmitter<{
-        root: NgtRenderState;
-        portal: NgtRenderState;
-    }>;
     portalContentTemplate: TemplateRef<unknown>;
     portalContentAnchor: ViewContainerRef;
+    private destroyRef;
+    private autoEffect;
     private parentStore;
-    parentScene: THREE.Scene;
-    parentCamera: import("./store").NgtCameraManual;
     private portalStore;
-    private injector;
-    private zone;
-    private raycaster;
-    private pointer;
-    portalContentRendered: boolean;
-    private portalContentView?;
+    private portalRendered;
+    protected renderAutoBeforeRender: import("@angular/core").Signal<boolean>;
+    protected parentScene: THREE.Scene;
+    protected parentCamera: import("./store").NgtCameraManual;
     constructor();
-    ngOnInit(): void;
-    onBeforeRender(portal: NgtRenderState): void;
     private inject;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtPortal, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgtPortal, "ngt-portal", never, { "container": { "alias": "container"; "required": false; }; "portalState": { "alias": "state"; "required": false; }; "autoRender": { "alias": "autoRender"; "required": false; }; "autoRenderPriority": { "alias": "autoRenderPriority"; "required": false; }; }, { "beforeRender": "beforeRender"; }, ["portalContentTemplate"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgtPortal, "ngt-portal", never, { "_portalInputs": { "alias": "options"; "required": false; }; "_autoRender": { "alias": "autoRender"; "required": false; }; "autoRenderPriority": { "alias": "autoRenderPriority"; "required": false; }; }, {}, ["portalContentTemplate"], never, true, never>;
 }
 export {};

package/lib/ref.d.ts

@@ -2,7 +2,6 @@ import { ElementRef, type Injector, type Signal } from '@angular/core';
 import { type NgtInstanceNode } from './instance';
 export type NgtInjectedRef<TElement> = ElementRef<TElement> & {
     children: (type?: 'objects' | 'nonObjects' | 'both') => Signal<NgtInstanceNode[]>;
-    untracked: TElement;
 };
 export type NgtRef<TElement> = TElement | NgtInjectedRef<TElement>;
 export declare function injectNgtRef<TElement>(initial?: ElementRef<TElement> | TElement, injector?: Injector): NgtInjectedRef<TElement>;

package/lib/renderer/catalogue.d.ts

@@ -4,6 +4,10 @@ export declare const injectNgtCatalogue: {
     (): Record<string, NgtAnyConstructor>;
     (injectOptions: import("@angular/core").InjectOptions & {
         optional?: false | undefined;
+    } & {
+        injector?: import("@angular/core").Injector | undefined;
     }): Record<string, NgtAnyConstructor>;
-    (injectOptions: import("@angular/core").InjectOptions): Record<string, NgtAnyConstructor> | null;
+    (injectOptions: import("@angular/core").InjectOptions & {
+        injector?: import("@angular/core").Injector | undefined;
+    }): Record<string, NgtAnyConstructor> | null;
 };

package/lib/renderer/constants.d.ts

@@ -10,7 +10,7 @@ export declare const SPECIAL_PROPERTIES: {
     readonly COMPOUND: "ngtCompound";
     readonly RENDER_PRIORITY: "priority";
     readonly ATTACH: "attach";
-    readonly VALUE: "rawValue";
+    readonly RAW_VALUE: "rawValue";
     readonly REF: "ref";
 };
 export declare const SPECIAL_EVENTS: {

package/lib/renderer/index.d.ts

@@ -1,5 +1,56 @@
-import { ChangeDetectorRef } from '@angular/core';
-import { type NgtStore } from '../store';
-export declare function provideNgtRenderer(store: NgtStore, compoundPrefixes: string[], cdr: ChangeDetectorRef): import("@angular/core").EnvironmentProviders;
+import { RendererFactory2, type Renderer2, type RendererType2 } from '@angular/core';
+import { type NgtState } from '../store';
+import type { NgtAnyRecord } from '../types';
+import type { NgtSignalStore } from '../utils/signal-store';
+import { type NgtAnyConstructor } from './catalogue';
+import { NgtRendererStore, type NgtRendererNode, type NgtRendererState } from './store';
+import * as i0 from "@angular/core";
+export declare class NgtRendererFactory implements RendererFactory2 {
+    private delegateRendererFactory;
+    private catalogue;
+    private rendererMap;
+    private routedSet;
+    private rendererStore;
+    createRenderer(hostElement: any, type: RendererType2 | null): Renderer2;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtRendererFactory, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NgtRendererFactory>;
+}
+export declare class NgtRenderer implements Renderer2 {
+    private delegate;
+    private store;
+    private catalogue;
+    private isRoot;
+    constructor(delegate: Renderer2, store: NgtRendererStore, catalogue: Record<string, NgtAnyConstructor>, isRoot?: boolean);
+    createElement(name: string, namespace?: string | null | undefined): NgtAnyRecord & {
+        __ngt_renderer__: NgtRendererState;
+    };
+    createComment(value: string): NgtAnyRecord & {
+        __ngt_renderer__: NgtRendererState;
+    };
+    appendChild(parent: NgtRendererNode, newChild: NgtRendererNode): void;
+    insertBefore(parent: NgtRendererNode, newChild: NgtRendererNode): void;
+    removeChild(parent: NgtRendererNode, oldChild: NgtRendererNode, isHostElement?: boolean | undefined): void;
+    parentNode(node: NgtRendererNode): any;
+    private setAttributeInternal;
+    setAttribute(el: NgtRendererNode, name: string, value: string, namespace?: string | null | undefined): void;
+    removeAttribute(el: NgtRendererNode, name: string, namespace?: string | null | undefined): void;
+    setProperty(el: NgtRendererNode, name: string, value: any): void;
+    listen(target: NgtRendererNode, eventName: string, callback: (event: any) => boolean | void): () => void;
+    private shouldFindGrandparentInstance;
+    createText: (value: string) => any;
+    destroy: () => void;
+    destroyNode: ((node: any) => void) | null;
+    selectRootElement: (selectorOrNode: any, preserveContent?: boolean | undefined) => any;
+    nextSibling: (node: any) => any;
+    addClass: (el: any, name: string) => void;
+    removeClass: (el: any, name: string) => void;
+    setStyle: (el: any, style: string, value: any, flags?: import("@angular/core").RendererStyleFlags2 | undefined) => void;
+    removeStyle: (el: any, style: string, flags?: import("@angular/core").RendererStyleFlags2 | undefined) => void;
+    setValue: (node: any, value: string) => void;
+    get data(): {
+        [key: string]: any;
+    };
+}
+export declare function provideNgtRenderer(store: NgtSignalStore<NgtState>, compoundPrefixes: string[]): import("@angular/core").EnvironmentProviders;
 export { extend } from './catalogue';
-export { HTML } from './constants';
+export { HTML, ROUTED_SCENE } from './constants';

package/lib/renderer/store.d.ts

@@ -5,12 +5,6 @@ import type { NgtAnyRecord } from '../types';
 import type { NgtSignalStore } from '../utils/signal-store';
 import { NgtRendererClassId } from './utils';
 export declare const NGT_COMPOUND_PREFIXES: InjectionToken<string[]>;
-type NgtRendererRootState = {
-    store: NgtSignalStore<NgtState>;
-    compoundPrefixes: string[];
-    document: Document;
-    portals: Array<NgtRendererNode>;
-};
 type NgtQueueOp = [type: 'op' | 'cleanUp', op: () => void, done?: true];
 export type NgtRendererState = [
     type: 'three' | 'compound' | 'portal' | 'comment' | 'dom',
@@ -27,39 +21,42 @@ export type NgtRendererState = [
     rawValue: any,
     ref: any,
     portalContainer: NgtRendererNode,
-    injectorFactory: () => Injector
+    injectorFactory: () => Injector | undefined
 ];
 export type NgtRendererNode = {
     __ngt_renderer__: NgtRendererState;
 };
+type NgtRendererRootState = {
+    store: NgtSignalStore<NgtState>;
+    compoundPrefixes: string[];
+    document: Document;
+};
 export declare class NgtRendererStore {
-    private root;
-    private comments;
-    constructor(root: NgtRendererRootState);
+    private rootState;
+    private argsCommentNodes;
+    private parentCommentNodes;
+    private portalCommentsNodes;
+    constructor(rootState: NgtRendererRootState);
     createNode(type: NgtRendererState[NgtRendererClassId.type], node: NgtAnyRecord): NgtAnyRecord & {
         __ngt_renderer__: NgtRendererState;
     };
+    isCompound(name: string): boolean;
+    isDOM(node: NgtAnyRecord): boolean;
+    getClosestParentWithInstance(node: NgtRendererNode): NgtRendererNode | null;
+    getClosestParentWithCompound(node: NgtRendererNode): NgtRendererNode | null;
+    processPortalContainer(portal: NgtRendererNode): void;
+    getCreationState(): readonly [any[], string | NgtRef<import("three").Object3D<import("three").Object3DEventMap>> | null, NgtSignalStore<NgtState>];
     setParent(node: NgtRendererNode, parent: NgtRendererNode): void;
     addChild(node: NgtRendererNode, child: NgtRendererNode): void;
     removeChild(node: NgtRendererNode, child: NgtRendererNode): void;
     setCompound(compound: NgtRendererNode, instance: NgtRendererNode): void;
     queueOperation(node: NgtRendererNode, op: NgtQueueOp): void;
     private executeOperation;
-    processPortalContainer(portal: NgtRendererNode): void;
     applyAttribute(node: NgtRendererNode, name: string, value: string): void;
     applyProperty(node: NgtRendererNode, name: string, value: any): void;
-    isCompound(name: string): boolean;
-    isDOM(node: NgtAnyRecord): boolean;
     get rootScene(): import("three").Scene;
-    get portals(): NgtRendererNode[];
-    getClosestParentWithInstance(node: NgtRendererNode): NgtRendererNode | null;
-    getClosestParentWithCompound(node: NgtRendererNode): NgtRendererNode | null | undefined;
-    getCreationState(): {
-        injectedArgs: any[];
-        injectedParent: string | NgtRef<import("three").Object3D<import("three").Event>> | null;
-        store: NgtSignalStore<NgtState>;
-    };
     destroy(node: NgtRendererNode, parent?: NgtRendererNode): void;
+    private removeCommentNode;
     private updateNativeProps;
     private firstNonInjectedDirective;
     private tryGetPortalStore;

package/lib/renderer/utils.d.ts

@@ -1,4 +1,3 @@
-import { ChangeDetectorRef, NgZone } from '@angular/core';
 import { type NgtInstanceNode } from '../instance';
 export declare const enum NgtRendererClassId {
     type = 0,
@@ -26,7 +25,7 @@ export declare const enum NgtQueueOpClassId {
     op = 1,
     done = 2
 }
+export declare function kebabToPascal(str: string): string;
 export declare function attachThreeChild(parent: NgtInstanceNode, child: NgtInstanceNode): void;
 export declare function removeThreeChild(parent: NgtInstanceNode, child: NgtInstanceNode, dispose?: boolean): void;
-export declare function kebabToPascal(str: string): string;
-export declare function processThreeEvent(instance: NgtInstanceNode, priority: number, eventName: string, callback: (event: any) => void, zone: NgZone, rootCdr: ChangeDetectorRef, targetCdr?: ChangeDetectorRef | null): () => void;
+export declare function processThreeEvent(instance: NgtInstanceNode, priority: number, eventName: string, callback: (event: any) => void): () => void;

package/lib/roots.d.ts

@@ -1,9 +1,10 @@
-import { type Injector } from '@angular/core';
+import { Injector } from '@angular/core';
 import type { NgtCanvasInputs } from './canvas';
 import { type NgtState } from './store';
 import type { NgtSignalStore } from './utils/signal-store';
-export declare const roots: Map<HTMLCanvasElement, NgtSignalStore<NgtState>>;
-export declare function injectCanvasRootInitializer(injector?: Injector): (canvas: HTMLCanvasElement) => {
+export type NgtCanvasElement = HTMLCanvasElement | OffscreenCanvas;
+export declare const roots: Map<NgtCanvasElement, NgtSignalStore<NgtState>>;
+export declare function injectCanvasRootInitializer(injector?: Injector): (canvas: NgtCanvasElement) => {
     isConfigured: boolean;
     destroy: (timeout?: number) => void;
     configure: (inputs: NgtCanvasInputs) => void;