angular-three 0.0.7 → 1.0.0-beta.0

package/index.d.ts

@@ -1,38 +1,5 @@
-/**
- * main exports
- */
 export * from './lib/canvas';
 export * from './lib/types';
-export * from './lib/instance';
-/**
- * services
- */
-export * from './lib/services/loader';
-export * from './lib/services/resize';
-/**
- * stores
- */
-export * from './lib/stores/store';
-export * from './lib/stores/component-store';
-/**
- * directives
- */
+export * from './lib/di/catalogue';
 export * from './lib/directives/args';
-export * from './lib/directives/cursor';
 export * from './lib/directives/repeat';
-/**
- * pipes
- */
-export * from './lib/pipes/pi';
-export * from './lib/pipes/math';
-export * from './lib/pipes/radian';
-export * from './lib/pipes/side';
-/**
- * utilities
- */
-export * from './lib/utils/proxy';
-export * from './lib/utils/loop';
-/**
- * resize
- */
-export * from './lib/di/resize';

package/lib/canvas.d.ts

@@ -1,46 +1,47 @@
-import { ElementRef, EventEmitter, OnDestroy, OnInit, TemplateRef } from '@angular/core';
-import { Observable } from 'rxjs';
-import * as THREE from 'three';
-import { NgtResizeResult } from './services/resize';
-import { NgtComponentStore } from './stores/component-store';
-import type { NgtCanvasInputs, NgtDpr, NgtObservableInput, NgtState, NgtVector3 } from './types';
+import { ElementRef, EventEmitter, OnDestroy, OnInit, Type, ViewContainerRef } from '@angular/core';
+import { NgxResizeResult } from 'ngx-resize';
+import { NgtRxStore } from './stores/rx-store';
+import type { NgtCanvasInputs, NgtDpr, NgtState } from './types';
 import * as i0 from "@angular/core";
 export declare class NgtCanvasContainer {
-    resize: Observable<NgtResizeResult>;
+    canvasResize: import("rxjs").Observable<NgxResizeResult>;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtCanvasContainer, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvasContainer, "ngt-canvas-container", never, {}, { "resize": "resize"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvasContainer, "ngt-canvas-container", never, {}, { "canvasResize": "canvasResize"; }, never, ["*"], true, never>;
 }
-export declare class NgtCanvas extends NgtComponentStore<NgtCanvasInputs> implements OnInit, OnDestroy {
+export declare class NgtCanvas extends NgtRxStore<NgtCanvasInputs> implements OnInit, OnDestroy {
+    private readonly cdr;
+    private readonly envInjector;
+    private readonly host;
+    private readonly store;
+    initialize(): void;
     readonly hostClass = true;
-    get pointerEvents(): "auto" | "none";
-    set linear(linear: NgtObservableInput<boolean>);
-    set legacy(legacy: NgtObservableInput<boolean>);
-    set flat(flat: NgtObservableInput<boolean>);
-    set orthographic(orthographic: NgtObservableInput<boolean>);
-    set frameloop(frameloop: NgtObservableInput<'always' | 'demand' | 'never'>);
-    set dpr(dpr: NgtObservableInput<NgtDpr>);
+    get pointerEvents(): "none" | "auto";
+    scene: 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 gl(gl: NgtCanvasInputs['gl']);
     set eventSource(eventSource: NgtCanvasInputs['eventSource']);
     set eventPrefix(eventPrefix: NgtCanvasInputs['eventPrefix']);
-    set lookAt(lookAt: NgtObservableInput<NgtVector3>);
+    set lookAt(lookAt: NgtCanvasInputs['lookAt']);
     set performance(performance: NgtCanvasInputs['performance']);
     created: EventEmitter<NgtState>;
-    canvasPointerMissed: EventEmitter<any>;
+    pointerMissed: EventEmitter<MouseEvent>;
     glCanvas: ElementRef<HTMLCanvasElement>;
-    canvasContent: TemplateRef<unknown>;
-    private readonly zone;
-    private readonly loader;
-    private readonly store;
-    private readonly host;
-    get sceneRef(): import("./ref").NgtRef<THREE.Scene>;
-    get isConfigured(): boolean;
-    initialize(): void;
+    glAnchor: ViewContainerRef;
+    private glRef?;
+    private glEnvInjector?;
     ngOnInit(): void;
-    onResize(resizeResult: NgtResizeResult): void;
+    onResize({ width, height }: NgxResizeResult): void;
+    private storeReady;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtCanvas, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvas, "ngt-canvas", never, { "linear": "linear"; "legacy": "legacy"; "flat": "flat"; "orthographic": "orthographic"; "frameloop": "frameloop"; "dpr": "dpr"; "raycaster": "raycaster"; "shadows": "shadows"; "camera": "camera"; "gl": "gl"; "eventSource": "eventSource"; "eventPrefix": "eventPrefix"; "lookAt": "lookAt"; "performance": "performance"; }, { "created": "created"; "canvasPointerMissed": "canvasPointerMissed"; }, ["canvasContent"], ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgtCanvas, "ngt-canvas", never, { "scene": "scene"; "compoundPrefixes": "compoundPrefixes"; "linear": "linear"; "legacy": "legacy"; "flat": "flat"; "orthographic": "orthographic"; "frameloop": "frameloop"; "dpr": "dpr"; "raycaster": "raycaster"; "shadows": "shadows"; "camera": "camera"; "gl": "gl"; "eventSource": "eventSource"; "eventPrefix": "eventPrefix"; "lookAt": "lookAt"; "performance": "performance"; }, { "created": "created"; "pointerMissed": "pointerMissed"; }, never, never, true, never>;
 }

package/lib/di/catalogue.d.ts

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+export declare function extend(objects: object): void;
+export declare const NGT_CATALOGUE: InjectionToken<Record<string, new (...args: any[]) => any>>;

package/lib/directives/args.d.ts

@@ -1,19 +1,15 @@
-import { InjectionToken, InjectOptions } from '@angular/core';
-import { NgtAnyCtor } from '../types';
 import * as i0 from "@angular/core";
-export declare const NGT_ARGS: InjectionToken<unknown[]>;
-export declare function injectArgs<TCtor extends NgtAnyCtor = NgtAnyCtor>(): ConstructorParameters<TCtor>;
-export declare function injectArgs<TCtor extends NgtAnyCtor = NgtAnyCtor>(options: InjectOptions & {
-    optional?: false;
-}): ConstructorParameters<TCtor>;
-export declare function injectArgs<TCtor extends NgtAnyCtor = NgtAnyCtor>(options: InjectOptions & {
-    optional?: true;
-}): ConstructorParameters<TCtor> | null;
 export declare class NgtArgs {
-    private readonly templateRef;
     private readonly vcr;
+    private readonly template;
+    constructor();
+    private injectedArgs;
+    private injected;
     private view?;
-    set args(args: unknown[]);
+    set args(args: any[] | null);
+    get args(): any[] | null;
+    validate(): boolean;
+    private createView;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtArgs, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<NgtArgs, "[args]", never, { "args": "args"; }, {}, never, never, true, never>;
 }

package/lib/events.d.ts

@@ -1,2 +1,7 @@
-import type { NgtEventManager, NgtStateFactory } from './types';
-export declare function createPointerEvents(stateFactory: NgtStateFactory): NgtEventManager<HTMLElement>;
+import * as THREE from 'three';
+import type { NgtRxStore } from './stores/rx-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>): {
+    handlePointer: (name: string) => (event: NgtDomEvent) => void;
+};

package/lib/loader.d.ts

@@ -0,0 +1,15 @@
+import { Observable } from 'rxjs';
+import type { GLTF } from 'three-stdlib';
+import type { NgtBranchingReturn, NgtLoaderExtensions, NgtLoaderResult, NgtObjectMap } from './types';
+interface NgtLoader {
+    <TReturnType, TUrl extends string | string[] | Record<string, string>>(loaderConstructorFactory: (inputs: TUrl) => new (...args: any[]) => NgtLoaderResult<TReturnType>, input: TUrl | Observable<TUrl>, extensions?: NgtLoaderExtensions, onProgress?: (event: ProgressEvent) => void): Observable<TUrl extends string[] ? Array<NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap>> : TUrl extends object ? {
+        [key in keyof TUrl]: NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap>;
+    } : NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap>>;
+    destroy: () => void;
+    preLoad: <TReturnType, TUrl extends string | string[] | Record<string, string>>(loaderConstructorFactory: (inputs: TUrl) => new (...args: any[]) => NgtLoaderResult<TReturnType>, inputs: TUrl | Observable<TUrl>, extensions?: NgtLoaderExtensions) => void;
+}
+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 const injectNgtLoader: NgtLoader;
+export {};

package/lib/{utils/loop.d.ts → loop.d.ts}

@@ -1,5 +1,6 @@
-import type { NgtStateFactory } from '../types';
-export declare type NgtGlobalRenderCallback = (timeStamp: number) => void;
+import { NgtRxStore } from './stores/rx-store';
+import type { NgtState } from './types';
+export type NgtGlobalRenderCallback = (timestamp: number) => void;
 /**
  * Adds a global render callback which is called each frame.
  * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addEffect
@@ -15,18 +16,18 @@ export declare const addAfterEffect: (callback: NgtGlobalRenderCallback) => () =
  * @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addTail
  */
 export declare const addTail: (callback: NgtGlobalRenderCallback) => () => void;
-export declare type GlobalEffectType = 'before' | 'after' | 'tail';
+export type GlobalEffectType = 'before' | 'after' | 'tail';
 export declare function flushGlobalEffects(type: GlobalEffectType, timestamp: number): void;
-export declare function createLoop<TCanvas>(roots: Map<TCanvas, NgtStateFactory>): {
+export declare function createLoop<TCanvas>(roots: Map<TCanvas, NgtRxStore<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: (stateFactory?: NgtStateFactory, frames?: number) => void;
+    invalidate: (store?: NgtRxStore<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, stateFactory?: NgtStateFactory, frame?: XRFrame) => void;
+    advance: (timestamp: number, runGlobalEffects?: boolean, store?: NgtRxStore<NgtState>, frame?: XRFrame) => void;
 };

package/lib/renderer/di.d.ts

@@ -0,0 +1,2 @@
+import { InjectionToken } from '@angular/core';
+export declare const NGT_COMPOUND_PREFIXES: InjectionToken<string[]>;

package/lib/renderer/enums.d.ts

@@ -0,0 +1,25 @@
+export declare const enum NgtRendererClassId {
+    type = 0,
+    parent = 1,
+    children = 2,
+    destroyed = 3,
+    compound = 4,
+    compoundParent = 5,
+    compounded = 6,
+    queueOps = 7,
+    attributes = 8,
+    properties = 9,
+    rawValue = 10,
+    ref = 11,
+    portalContainer = 12,
+    injectorFactory = 13
+}
+export declare const enum NgtCompoundClassId {
+    applyFirst = 0,
+    props = 1
+}
+export declare const enum NgtQueueOpClassId {
+    type = 0,
+    op = 1,
+    done = 2
+}

package/lib/renderer/provider.d.ts

@@ -0,0 +1,25 @@
+import { ChangeDetectorRef, RendererFactory2 } from '@angular/core';
+import { NgtStore } from '../stores/store';
+import { NgtRendererFactory } from './renderer';
+export type NgtRendererProviderOptions = {
+    store: NgtStore;
+    changeDetectorRef: ChangeDetectorRef;
+    compoundPrefixes?: string[];
+};
+export declare function provideNgtRenderer({ store, changeDetectorRef, compoundPrefixes }: NgtRendererProviderOptions): ({
+    provide: typeof RendererFactory2;
+    useClass: typeof NgtRendererFactory;
+    useValue?: undefined;
+} | {
+    provide: typeof NgtStore;
+    useValue: NgtStore;
+    useClass?: undefined;
+} | {
+    provide: typeof ChangeDetectorRef;
+    useValue: ChangeDetectorRef;
+    useClass?: undefined;
+} | {
+    provide: import("@angular/core").InjectionToken<string[]>;
+    useValue: string[];
+    useClass?: undefined;
+})[];

package/lib/renderer/renderer.d.ts

@@ -0,0 +1,49 @@
+import { Renderer2, RendererFactory2, RendererType2 } from '@angular/core';
+import { NgtRendererNode, NgtRendererStore } from './state';
+import * as i0 from "@angular/core";
+export declare class NgtRendererFactory implements RendererFactory2 {
+    private readonly domRendererFactory;
+    private readonly cdr;
+    private readonly store;
+    private readonly catalogue;
+    private readonly compoundPrefixes;
+    private readonly rendererStore;
+    private renderer?;
+    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 readonly domRenderer;
+    private readonly store;
+    private readonly catalogue;
+    private first;
+    constructor(domRenderer: Renderer2, store: NgtRendererStore, catalogue: Record<string, new (...args: any[]) => any>);
+    createElement(name: string, namespace?: string | null | undefined): import("angular-three").NgtAnyRecord & {
+        __ngt_renderer__: import("./state").NgtRendererState;
+    };
+    createComment(value: string): import("angular-three").NgtAnyRecord & {
+        __ngt_renderer__: import("./state").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;
+    setAttribute(el: NgtRendererNode, name: string, value: 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;
+    get data(): {
+        [key: string]: any;
+    };
+    createText: (value: string) => any;
+    destroy: () => void;
+    destroyNode: ((node: any) => void) | null;
+    selectRootElement: (selectorOrNode: any, preserveContent?: boolean | undefined) => any;
+    nextSibling: (node: any) => any;
+    removeAttribute: (el: any, name: string, namespace?: string | null | undefined) => void;
+    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;
+}

package/lib/renderer/state.d.ts

@@ -0,0 +1,59 @@
+import { ChangeDetectorRef, Injector } from '@angular/core';
+import { NgtStore } from '../stores/store';
+import type { NgtAnyRecord } from '../types';
+import { NgtQueueOpClassId, NgtRendererClassId } from './enums';
+export type NgtRendererRootState = {
+    store: NgtStore;
+    cdr: ChangeDetectorRef;
+    compoundPrefixes: string[];
+};
+export type NgtQueueOp = [type: 'op' | 'cleanUp', op: () => void, done?: true];
+export type NgtRendererState = [
+    type: 'three' | 'compound' | 'portal' | 'comment' | 'dom',
+    parent: NgtRendererNode | null,
+    children: NgtRendererNode[],
+    destroyed: boolean,
+    compound: [applyFirst: boolean, props: Record<string, any>],
+    compoundParent: NgtRendererNode,
+    compounded: NgtRendererNode,
+    queueOps: Set<NgtQueueOp>,
+    attributes: Record<string, any>,
+    properties: Record<string, any>,
+    rawValue: any,
+    ref: any,
+    portalContainer: NgtRendererNode,
+    injectorFactory: () => Injector
+];
+export type NgtRendererNode = {
+    __ngt_renderer__: NgtRendererState;
+};
+export declare class NgtRendererStore {
+    private readonly root;
+    private readonly comments;
+    private readonly portals;
+    constructor(root: NgtRendererRootState);
+    createNode(type: NgtRendererState[NgtRendererClassId.type], node: NgtAnyRecord): NgtAnyRecord & {
+        __ngt_renderer__: NgtRendererState;
+    };
+    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;
+    executeOperation(node: NgtRendererNode, type?: NgtQueueOp[NgtQueueOpClassId.type]): void;
+    processPortalContainer(portal: NgtRendererNode): void;
+    applyAttribute(node: NgtRendererNode, name: string, value: string): void;
+    applyProperty(node: NgtRendererNode, name: string, value: any): void;
+    isCompound(name: string): boolean;
+    get rootScene(): import("three").Scene;
+    get rootCdr(): ChangeDetectorRef;
+    getClosestParentWithInstance(node: NgtRendererNode): NgtRendererNode | null;
+    getClosestParentWithCompound(node: NgtRendererNode): NgtRendererNode | null | undefined;
+    getCreationState(): {
+        injectedArgs: any[];
+        store: NgtStore;
+    };
+    destroy(node: NgtRendererNode, parent?: NgtRendererNode): void;
+    private firstNonInjectedDirective;
+    tryGetPortalStore(): NgtStore;
+}

package/lib/renderer/utils.d.ts

@@ -0,0 +1,20 @@
+import { ChangeDetectorRef } from '@angular/core';
+import type { NgtEventHandlers, NgtInstanceNode } from '../types';
+import { supportedEvents } from '../web/events';
+export declare const SPECIAL_DOM_TAG: {
+    readonly NGT_PORTAL: "ngt-portal";
+    readonly NGT_PRIMITIVE: "ngt-primitive";
+    readonly NGT_VALUE: "ngt-value";
+};
+export declare const SPECIAL_PROPERTIES: {
+    readonly COMPOUND: "ngtCompound";
+    readonly RENDER_PRIORITY: "priority";
+    readonly ATTACH: "attach";
+    readonly VALUE: "rawValue";
+    readonly REF: "ref";
+};
+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): () => void;
+export declare function eventToHandler(callback: (event: any) => void, cdr: ChangeDetectorRef): (event: Parameters<Exclude<NgtEventHandlers[(typeof supportedEvents)[number]], undefined>>[0]) => void;
+export declare function kebabToPascal(str: string): string;

package/lib/stores/rx-store.d.ts

@@ -0,0 +1,17 @@
+import { RxState } from '@rx-angular/state';
+import { MonoTypeOperatorFunction, Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare const startWithUndefined: <T>() => MonoTypeOperatorFunction<T>;
+type EffectFn<TValue> = (value: TValue) => void | undefined | ((cleanUpParams: {
+    prev: TValue | undefined;
+    complete: boolean;
+    error: boolean;
+}) => void);
+export declare class NgtRxStore<TState extends object = any, TRxState extends object = TState & Record<string, any>> extends RxState<TRxState> {
+    constructor();
+    protected initialize(): void;
+    effect<S>(obs: Observable<S>, sideEffectFn: EffectFn<S>): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgtRxStore<any, any>, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NgtRxStore<any, any>>;
+}
+export {};

package/lib/stores/store.d.ts

@@ -1,32 +1,15 @@
-import { Subscription } from 'rxjs';
-import type { NgtCanvasInputs, NgtState, NgtStateFactory } from '../types';
-import { NgtComponentStore, tapEffect } from './component-store';
+import type { NgtCanvasInputs, NgtState } from '../types';
+import { NgtRxStore } from './rx-store';
 import * as i0 from "@angular/core";
-export declare const rootStateMap: Map<Element, NgtStateFactory>;
-export declare class NgtStore extends NgtComponentStore<NgtState> {
+export declare const rootStateMap: Map<Element, NgtRxStore<NgtState, NgtState & Record<string, any>>>;
+export declare class NgtStore extends NgtRxStore<NgtState> {
     private readonly parentStore;
-    private readonly zone;
     private readonly window;
-    private readonly position;
-    private readonly defaultTarget;
-    private readonly tempTarget;
-    get rootStateFactory(): NgtStateFactory;
-    private readonly resize;
-    private readonly invalidate;
     isInit: boolean;
-    isConfigured: boolean;
     init(): void;
-    private readonly addInteraction;
-    private readonly removeInteraction;
-    private readonly setPerformanceCurrent;
-    private readonly setEvents;
-    private readonly setSize;
-    private readonly setCamera;
-    private readonly setDpr;
-    private readonly setFrameloop;
-    private readonly getCurrentViewport;
     configure(inputs: NgtCanvasInputs, canvasElement: HTMLCanvasElement): void;
-    onReady(cb: Parameters<typeof tapEffect>[0]): Subscription;
+    private resize;
+    private invalidate;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgtStore, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<NgtStore>;
 }