chore(core): clean up renderer

Author: Chau Tran

libs/angular-three/src/lib/renderer/renderer.ts

@@ -4,12 +4,12 @@ import {
     Injectable,
     Injector,
     NgZone,
-    Renderer2,
     RendererFactory2,
     effect,
     getDebugNode,
     inject,
     untracked,
+    type Renderer2,
     type RendererType2,
 } from '@angular/core';
 import { NGT_CATALOGUE } from '../di/catalogue';
@@ -115,6 +115,8 @@ export class NgtRenderer implements Renderer2 {
                 'three',
                 Object.assign(
                     { __ngt_renderer__: { rawValue: undefined } },
+                    // NOTE: we assign this manually to a raw value node
+                    // because we say it is a 'three' node but we're not using prepare()
                     { __ngt__: { isRaw: true, parent: createSignal(null) } }
                 )
             );
@@ -135,8 +137,8 @@ export class NgtRenderer implements Renderer2 {
             const object = injectedArgs[0];
             let localState = getLocalState(object);
             if (!Object.keys(localState).length) {
-                prepare(object, { store, args: injectedArgs, primitive: true });
-                localState = getLocalState(object);
+                // NOTE: if an object isn't already "prepared", we prepare it
+                localState = getLocalState(prepare(object, { store, args: injectedArgs, primitive: true }));
             }
             if (!localState.store) localState.store = store;
             const node = this.store.createNode('three', object);

libs/angular-three/src/lib/renderer/store.ts

@@ -78,7 +78,7 @@ export class NgtRendererStore {
         }
 
         if (state[NgtRendererClassId.type] === 'comment') {
-            // we attach an arrow function to the Comment node
+            // NOTE: we attach an arrow function to the Comment node
             // In our directives, we can call this function to then start tracking the RendererNode
             // this is done to limit the amount of Nodes we need to process for getCreationState
             rendererNode[SPECIAL_INTERNAL_ADD_COMMENT] = (node?: NgtRendererNode) => {
@@ -319,9 +319,9 @@ export class NgtRendererStore {
     }
 
     getCreationState() {
-        const injectedArgs = this.firstNonInjectedDirective(NgtArgs)?.args || [];
-        const injectedParent = this.firstNonInjectedDirective(NgtParent)?.parent || null;
-        const store = this.tryGetPortalStore();
+        const injectedArgs = this.#firstNonInjectedDirective(NgtArgs)?.args || [];
+        const injectedParent = this.#firstNonInjectedDirective(NgtParent)?.parent || null;
+        const store = this.#tryGetPortalStore();
         return { injectedArgs, injectedParent, store };
     }
 
@@ -407,7 +407,7 @@ export class NgtRendererStore {
         }
     }
 
-    private firstNonInjectedDirective<T extends NgtCommonDirective>(dir: Type<T>) {
+     #firstNonInjectedDirective<T extends NgtCommonDirective>(dir: Type<T>) {
         let directive: T | undefined;
 
         let i = this.#comments.length - 1;
@@ -434,7 +434,7 @@ export class NgtRendererStore {
         return directive;
     }
 
-    private tryGetPortalStore() {
+     #tryGetPortalStore() {
         let store: NgtStore | undefined;
         // we only care about the portal states because NgtStore only differs per Portal
         let i = this.portals.length - 1;

libs/angular-three/src/lib/renderer/utils.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, EventEmitter, NgZone, untracked } from '@angular/core';
+import { EventEmitter, untracked, type ChangeDetectorRef, type NgZone } from '@angular/core';
 import { supportedEvents } from '../dom/events';
 import { removeInteractivity } from '../events';
 import type { NgtEventHandlers, NgtInstanceNode } from '../types';