angular-three 1.2.1 → 1.2.3

package/fesm2015/angular-three.mjs

@@ -1,12 +1,11 @@
 import * as i0 from '@angular/core';
-import { ElementRef, Injectable, inject, InjectionToken, ViewContainerRef, TemplateRef, Directive, Input, EventEmitter, getDebugNode, ChangeDetectorRef, RendererFactory2, EnvironmentInjector, createEnvironmentInjector, Component, HostBinding, Output, ViewChild, Pipe, SkipSelf, ContentChild } from '@angular/core';
+import { ElementRef, Injectable, inject, InjectionToken, ViewContainerRef, TemplateRef, Directive, Input, EventEmitter, getDebugNode, RendererFactory2, ChangeDetectorRef, EnvironmentInjector, createEnvironmentInjector, Component, HostBinding, Output, ViewChild, Pipe, SkipSelf, ContentChild } from '@angular/core';
 import { provideNgxResizeOptions, NgxResize } from 'ngx-resize';
 import { isObservable, of, map, from, tap, retry, catchError, share, ReplaySubject, switchMap, forkJoin, take, BehaviorSubject, startWith, filter, distinctUntilChanged, takeUntil, merge } from 'rxjs';
 import * as THREE from 'three';
 import { __rest, __classPrivateFieldGet } from 'tslib';
 import { DOCUMENT, NgForOf, NgIf } from '@angular/common';
 import { RxState, selectSlice } from '@rx-angular/state';
-import { ɵDomRendererFactory2 } from '@angular/platform-browser';
 
 const idCache = {};
 function makeId(event) {
@@ -1513,6 +1512,10 @@ class NgtRendererStore {
             undefined,
         ];
         const rendererNode = Object.assign(node, { __ngt_renderer__: state });
+        // assign ownerDocument to node so we can use HostListener in Component
+        if (!rendererNode['ownerDocument']) {
+            rendererNode['ownerDocument'] = this.root.document;
+        }
         if (state[0 /* NgtRendererClassId.type */] === 'comment') {
             state[13 /* NgtRendererClassId.injectorFactory */] = () => getDebugNode(rendererNode).injector;
             // we attach an arrow function to the Comment node
@@ -1671,6 +1674,9 @@ class NgtRendererStore {
     isCompound(name) {
         return this.root.compoundPrefixes.some((prefix) => name.startsWith(prefix));
     }
+    isDOM(node) {
+        return node instanceof Element || node instanceof Document;
+    }
     get rootScene() {
         return this.root.store.get('scene');
     }
@@ -1846,17 +1852,18 @@ class NgtRendererStore {
 
 class NgtRendererFactory {
     constructor() {
-        this.domRendererFactory = inject(ɵDomRendererFactory2);
+        this.delegateRendererFactory = inject(RendererFactory2, { skipSelf: true });
         this.cdr = inject(ChangeDetectorRef);
         this.store = inject(NgtStore);
         this.catalogue = inject(NGT_CATALOGUE);
         this.compoundPrefixes = inject(NGT_COMPOUND_PREFIXES);
+        this.document = inject(DOCUMENT);
         this.rendererMap = new Map();
     }
     createRenderer(hostElement, type) {
-        const domRenderer = this.domRendererFactory.createRenderer(hostElement, type);
+        const delegateRenderer = this.delegateRendererFactory.createRenderer(hostElement, type);
         if (!type)
-            return domRenderer;
+            return delegateRenderer;
         let renderer = this.rendererMap.get(type.id);
         if (renderer)
             return renderer;
@@ -1865,8 +1872,9 @@ class NgtRendererFactory {
                 store: this.store,
                 cdr: this.cdr,
                 compoundPrefixes: this.compoundPrefixes,
+                document: this.document,
             });
-            renderer = new NgtRenderer(domRenderer, store, this.catalogue, true);
+            renderer = new NgtRenderer(delegateRenderer, store, this.catalogue, true);
             this.rendererMap.set(type.id, renderer);
         }
         if (!renderer) {
@@ -1874,8 +1882,9 @@ class NgtRendererFactory {
                 store: this.store,
                 cdr: this.cdr,
                 compoundPrefixes: this.compoundPrefixes,
+                document: this.document,
             });
-            renderer = new NgtRenderer(domRenderer, store, this.catalogue);
+            renderer = new NgtRenderer(delegateRenderer, store, this.catalogue);
             this.rendererMap.set(type.id, renderer);
         }
         return renderer;
@@ -1887,26 +1896,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImpor
             type: Injectable
         }] });
 class NgtRenderer {
-    constructor(domRenderer, store, catalogue, root = false) {
-        this.domRenderer = domRenderer;
+    constructor(delegate, store, catalogue, root = false) {
+        this.delegate = delegate;
         this.store = store;
         this.catalogue = catalogue;
         this.root = root;
         this.first = false;
-        this.createText = this.domRenderer.createText.bind(this.domRenderer);
-        this.destroy = this.domRenderer.destroy.bind(this.domRenderer);
+        this.createText = this.delegate.createText.bind(this.delegate);
+        this.destroy = this.delegate.destroy.bind(this.delegate);
         this.destroyNode = null;
-        this.selectRootElement = this.domRenderer.selectRootElement.bind(this.domRenderer);
-        this.nextSibling = this.domRenderer.nextSibling.bind(this.domRenderer);
-        this.removeAttribute = this.domRenderer.removeAttribute.bind(this.domRenderer);
-        this.addClass = this.domRenderer.addClass.bind(this.domRenderer);
-        this.removeClass = this.domRenderer.removeClass.bind(this.domRenderer);
-        this.setStyle = this.domRenderer.setStyle.bind(this.domRenderer);
-        this.removeStyle = this.domRenderer.removeStyle.bind(this.domRenderer);
-        this.setValue = this.domRenderer.setValue.bind(this.domRenderer);
+        this.selectRootElement = this.delegate.selectRootElement.bind(this.delegate);
+        this.nextSibling = this.delegate.nextSibling.bind(this.delegate);
+        this.removeAttribute = this.delegate.removeAttribute.bind(this.delegate);
+        this.addClass = this.delegate.addClass.bind(this.delegate);
+        this.removeClass = this.delegate.removeClass.bind(this.delegate);
+        this.setStyle = this.delegate.setStyle.bind(this.delegate);
+        this.removeStyle = this.delegate.removeStyle.bind(this.delegate);
+        this.setValue = this.delegate.setValue.bind(this.delegate);
     }
     createElement(name, namespace) {
-        const element = this.domRenderer.createElement(name, namespace);
+        const element = this.delegate.createElement(name, namespace);
         // on first pass, we return the Root Scene as the root node
         if (this.root && !this.first) {
             this.first = true;
@@ -1957,7 +1966,7 @@ class NgtRenderer {
         return this.store.createNode('dom', element);
     }
     createComment(value) {
-        const comment = this.domRenderer.createComment(value);
+        const comment = this.delegate.createComment(value);
         return this.store.createNode('comment', comment);
     }
     appendChild(parent, newChild) {
@@ -2080,7 +2089,7 @@ class NgtRenderer {
         var _a;
         if ((_a = node.__ngt_renderer__) === null || _a === void 0 ? void 0 : _a[1 /* NgtRendererClassId.parent */])
             return node.__ngt_renderer__[1 /* NgtRendererClassId.parent */];
-        return this.domRenderer.parentNode(node);
+        return this.delegate.parentNode(node);
     }
     setAttribute(el, name, value, namespace) {
         if (el.__ngt_renderer__[0 /* NgtRendererClassId.type */] === 'compound') {
@@ -2118,6 +2127,10 @@ class NgtRenderer {
         }
     }
     listen(target, eventName, callback) {
+        // if target is DOM node, then we pass that to delegate Renderer
+        if (this.store.isDOM(target)) {
+            return this.delegate.listen(target, eventName, callback);
+        }
         if (target.__ngt_renderer__[0 /* NgtRendererClassId.type */] === 'three' ||
             (target.__ngt_renderer__[0 /* NgtRendererClassId.type */] === 'compound' &&
                 target.__ngt_renderer__[6 /* NgtRendererClassId.compounded */])) {
@@ -2135,7 +2148,7 @@ class NgtRenderer {
         return () => { };
     }
     get data() {
-        return this.domRenderer.data;
+        return this.delegate.data;
     }
 }
 
@@ -2822,5 +2835,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NGT_CATALOGUE, NgtArgs, NgtCanvas, NgtPortal, NgtPortalBeforeRender, NgtPortalContent, NgtPush, NgtRepeat, NgtRxStore, NgtStore, checkNeedsUpdate, checkUpdate, createAttachFunction, extend, getLocalState, injectBeforeRender, injectNgtDestroy, injectNgtLoader, injectNgtRef, invalidateInstance, is, makeDefaultCamera, makeDefaultRenderer, makeDpr, makeId, makeObjectGraph, prepare, rootStateMap, startWithUndefined, tapEffect, updateCamera };
+export { NGT_CATALOGUE, NgtArgs, NgtCanvas, NgtPortal, NgtPortalBeforeRender, NgtPortalContent, NgtPush, NgtRepeat, NgtRxStore, NgtStore, applyProps, checkNeedsUpdate, checkUpdate, createAttachFunction, extend, getLocalState, injectBeforeRender, injectNgtDestroy, injectNgtLoader, injectNgtRef, invalidateInstance, is, makeDefaultCamera, makeDefaultRenderer, makeDpr, makeId, makeObjectGraph, prepare, rootStateMap, startWithUndefined, tapEffect, updateCamera };
 //# sourceMappingURL=angular-three.mjs.map