feat(soba): standalone api

nartc · Jul 21, 2022 · 5707f85 · 5707f85
1 parent 6c26dcd
commit 5707f85
Show file tree

Hide file tree

Showing 42 changed files with 406 additions and 430 deletions.
diff --git a/apps/sandbox/src/app/kinematic-cube/kinematic-cube.component.ts b/apps/sandbox/src/app/kinematic-cube/kinematic-cube.component.ts
@@ -1,12 +1,5 @@
 import { NgtPhysicBody, NgtPhysicsModule } from '@angular-three/cannon';
-import {
-  NgtCanvasModule,
-  NgtEuler,
-  NgtRenderState,
-  NgtTriple,
-  NgtVector3,
-  NgtVectorPipeModule,
-} from '@angular-three/core';
+import { NgtCanvasModule, NgtEuler, NgtRenderState, NgtTriple, NgtVector3 } from '@angular-three/core';
 import { NgtInstancedBufferAttributeModule, NgtVector2AttributeModule } from '@angular-three/core/attributes';
 import { NgtBoxGeometryModule, NgtPlaneGeometryModule, NgtSphereGeometryModule } from '@angular-three/core/geometries';
 import { NgtHemisphereLightModule, NgtPointLightModule, NgtSpotLightModule } from '@angular-three/core/lights';
@@ -167,7 +160,6 @@ export class InstancedSpheres implements OnInit {
     NgtStatsModule,
     NgtHemisphereLightModule,
     NgtSpotLightModule,
-    NgtVectorPipeModule,
     NgtPointLightModule,
     NgtPlaneGeometryModule,
     NgtMeshPhongMaterialModule,

diff --git a/libs/soba/abstractions/src/lib/billboard/billboard.ts b/libs/soba/abstractions/src/lib/billboard/billboard.ts
@@ -2,13 +2,13 @@ import {
   BooleanInput,
   coerceBooleanProperty,
   NgtObjectInputs,
-  NgtObjectPassThroughModule,
+  NgtObjectPassThrough,
   NgtRenderState,
   provideObjectHostRef,
   Ref,
 } from '@angular-three/core';
 import { NgtGroupModule } from '@angular-three/core/group';
-import { CommonModule } from '@angular/common';
+import { NgIf, NgTemplateOutlet } from '@angular/common';
 import {
   ChangeDetectionStrategy,
   Component,
@@ -24,6 +24,7 @@ import * as THREE from 'three/src/Three';
 
 @Directive({
   selector: 'ng-template[ngt-soba-billboard-content]',
+  standalone: true,
 })
 export class NgtSobaBillboardContent {
   constructor(public templateRef: TemplateRef<{ billboard: Ref<THREE.Group> }>) {}
@@ -35,6 +36,7 @@ export class NgtSobaBillboardContent {
 
 @Component({
   selector: 'ngt-soba-billboard',
+  standalone: true,
   template: `
     <ngt-group
       (beforeRender)="onBeforeRender($event); beforeRender.emit($event)"
@@ -48,6 +50,7 @@ export class NgtSobaBillboardContent {
       ></ng-container>
     </ngt-group>
   `,
+  imports: [NgtGroupModule, NgtObjectPassThrough, NgIf, NgTemplateOutlet],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [provideObjectHostRef(NgtSobaBillboard)],
 })
@@ -105,8 +108,7 @@ export class NgtSobaBillboard extends NgtObjectInputs<THREE.Group> {
 }
 
 @NgModule({
-  declarations: [NgtSobaBillboard, NgtSobaBillboardContent],
+  imports: [NgtSobaBillboard, NgtSobaBillboardContent],
   exports: [NgtSobaBillboard, NgtSobaBillboardContent],
-  imports: [NgtGroupModule, CommonModule, NgtObjectPassThroughModule],
 })
 export class NgtSobaBillboardModule {}
diff --git a/libs/soba/abstractions/src/lib/cubic-bezier-line/cubic-bezier-line.ts b/libs/soba/abstractions/src/lib/cubic-bezier-line/cubic-bezier-line.ts
@@ -2,18 +2,19 @@ import {
   coerceNumberProperty,
   is,
   makeVector3,
-  NgtObjectPassThroughModule,
+  NgtObjectPassThrough,
   NgtTriple,
   NumberInput,
   provideObjectHostRef,
 } from '@angular-three/core';
-import { CommonModule } from '@angular/common';
+import { AsyncPipe, NgIf, NgTemplateOutlet } from '@angular/common';
 import { ChangeDetectionStrategy, Component, Input, NgModule } from '@angular/core';
 import * as THREE from 'three/src/Three';
-import { NgtSobaLine, NgtSobaLineModule } from '../line/line';
+import { NgtSobaLine, NgtSobaLineContent } from '../line/line';
 
 @Component({
   selector: 'ngt-soba-cubic-bezier-line[start][end][midA][midB]',
+  standalone: true,
   template: `
     <ngt-soba-line
       *ngIf="cubicLineViewModel$ | async as cubicLineViewModel"
@@ -34,6 +35,7 @@ import { NgtSobaLine, NgtSobaLineModule } from '../line/line';
       </ng-container>
     </ngt-soba-line>
   `,
+  imports: [NgtSobaLine, NgtObjectPassThrough, NgtSobaLineContent, NgTemplateOutlet, NgIf, AsyncPipe],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [provideObjectHostRef(NgtSobaCubicBezierLine)],
 })
@@ -104,8 +106,7 @@ export class NgtSobaCubicBezierLine extends NgtSobaLine {
 }
 
 @NgModule({
-  declarations: [NgtSobaCubicBezierLine],
+  imports: [NgtSobaCubicBezierLine],
   exports: [NgtSobaCubicBezierLine],
-  imports: [NgtSobaLineModule, NgtObjectPassThroughModule, CommonModule],
 })
 export class NgtSobaCubicBezierLineModule {}
diff --git a/libs/soba/abstractions/src/lib/gizmo-helper/gizmo-helper.ts b/libs/soba/abstractions/src/lib/gizmo-helper/gizmo-helper.ts
@@ -5,17 +5,18 @@ import {
   makeVector3,
   NgtObjectInputs,
   NgtObjectInputsState,
-  NgtObjectPassThroughModule,
-  NgtPortalModule,
+  NgtObjectPassThrough,
+  NgtPortal,
+  NgtPortalContent,
   NgtRenderState,
   prepare,
   provideObjectHostRef,
   Ref,
   tapEffect,
 } from '@angular-three/core';
-import { NgtGroupModule } from '@angular-three/core/group';
-import { NgtSobaOrthographicCameraModule } from '@angular-three/soba/cameras';
-import { CommonModule } from '@angular/common';
+import { NgtGroup } from '@angular-three/core/group';
+import { NgtSobaOrthographicCamera } from '@angular-three/soba/cameras';
+import { AsyncPipe, NgIf, NgTemplateOutlet } from '@angular/common';
 import {
   ChangeDetectionStrategy,
   Component,
@@ -43,6 +44,7 @@ export interface NgtSobaGizmoHelperState extends NgtObjectInputsState<THREE.Grou
 
 @Directive({
   selector: 'ng-template[ngt-soba-gizmo-helper-content]',
+  standalone: true,
 })
 export class NgtSobaGizmoHelperContent {
   constructor(public templateRef: TemplateRef<{ gizmo: THREE.Group }>) {}
@@ -63,6 +65,7 @@ const targetPosition = makeVector3();
 
 @Component({
   selector: 'ngt-soba-gizmo-helper',
+  standalone: true,
   template: `
     <ngt-portal *ngIf="ready$ | async" [ref]="virtualScene">
       <ng-template ngt-portal-content>
@@ -83,6 +86,16 @@ const targetPosition = makeVector3();
       </ng-template>
     </ngt-portal>
   `,
+  imports: [
+    NgtPortal,
+    NgtPortalContent,
+    NgtGroup,
+    NgtObjectPassThrough,
+    NgtSobaOrthographicCamera,
+    NgIf,
+    NgTemplateOutlet,
+    AsyncPipe,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [provideObjectHostRef(NgtSobaGizmoHelper)],
 })
@@ -276,8 +289,7 @@ export class NgtSobaGizmoHelper extends NgtObjectInputs<THREE.Group, NgtSobaGizm
 }
 
 @NgModule({
-  declarations: [NgtSobaGizmoHelper, NgtSobaGizmoHelperContent],
+  imports: [NgtSobaGizmoHelper, NgtSobaGizmoHelperContent],
   exports: [NgtSobaGizmoHelper, NgtSobaGizmoHelperContent],
-  imports: [NgtPortalModule, NgtGroupModule, NgtObjectPassThroughModule, CommonModule, NgtSobaOrthographicCameraModule],
 })
 export class NgtSobaGizmoHelperModule {}
diff --git a/libs/soba/abstractions/src/lib/gizmo-helper/gizmo-viewcube.ts b/libs/soba/abstractions/src/lib/gizmo-helper/gizmo-viewcube.ts
@@ -9,20 +9,20 @@ import {
   NgtEvent,
   NgtInstance,
   NgtInstanceState,
-  NgtRepeatModule,
+  NgtRepeat,
   NgtStore,
   NgtTriple,
   NgtVector3,
   NumberInput,
   Ref,
   startWithUndefined,
 } from '@angular-three/core';
-import { NgtBoxGeometryModule } from '@angular-three/core/geometries';
-import { NgtGroupModule } from '@angular-three/core/group';
-import { NgtAmbientLightModule, NgtPointLightModule } from '@angular-three/core/lights';
-import { NgtMeshBasicMaterialModule, NgtMeshLambertMaterialModule } from '@angular-three/core/materials';
-import { NgtMeshModule } from '@angular-three/core/meshes';
-import { CommonModule } from '@angular/common';
+import { NgtBoxGeometry } from '@angular-three/core/geometries';
+import { NgtGroup } from '@angular-three/core/group';
+import { NgtAmbientLight, NgtPointLight } from '@angular-three/core/lights';
+import { NgtMeshBasicMaterial, NgtMeshLambertMaterial } from '@angular-three/core/materials';
+import { NgtMesh } from '@angular-three/core/meshes';
+import { AsyncPipe, NgForOf } from '@angular/common';
 import {
   ChangeDetectionStrategy,
   Component,
@@ -183,6 +183,7 @@ export abstract class NgtSobaGizmoViewCubeGeneric<TPart extends object> extends
 
 @Directive({
   selector: '[ngtSobaGizmoViewCubeGenericPassThrough]',
+  standalone: true,
 })
 export class NgtSobaGizmoViewCubePassThrough {
   @Input() set ngtSobaGizmoViewCubeGenericPassThrough(wrapper: unknown) {
@@ -227,6 +228,7 @@ export class NgtSobaGizmoViewCubePassThrough {
 
 @Component({
   selector: 'ngt-soba-gizmo-face-material[hover][index]',
+  standalone: true,
   template: `
     <ngt-mesh-lambert-material
       [ref]="instance"
@@ -237,6 +239,7 @@ export class NgtSobaGizmoViewCubePassThrough {
       [opacity]="opacity"
     ></ngt-mesh-lambert-material>
   `,
+  imports: [NgtMeshLambertMaterial, AsyncPipe],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [
     {
@@ -294,6 +297,7 @@ export class NgtSobaGizmoFaceMaterial extends NgtSobaGizmoViewCubeGeneric<THREE.
 
 @Component({
   selector: 'ngt-soba-gizmo-face-cube',
+  standalone: true,
   template: `
     <ngt-mesh
       [raycast]="raycast"
@@ -310,6 +314,7 @@ export class NgtSobaGizmoFaceMaterial extends NgtSobaGizmoViewCubeGeneric<THREE.
       ></ngt-soba-gizmo-face-material>
     </ngt-mesh>
   `,
+  imports: [NgtMesh, NgtBoxGeometry, NgtSobaGizmoFaceMaterial, NgtSobaGizmoViewCubePassThrough, NgtRepeat, NgForOf],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [
     {
@@ -343,6 +348,7 @@ export class NgtSobaGizmoFaceCube extends NgtSobaGizmoViewCubeGeneric<THREE.Mesh
 
 @Component({
   selector: 'ngt-soba-gizmo-edge-cube[dimensions][position]',
+  standalone: true,
   template: `
     <ngt-mesh
       [scale]="1.01"
@@ -361,6 +367,7 @@ export class NgtSobaGizmoFaceCube extends NgtSobaGizmoViewCubeGeneric<THREE.Mesh
       ></ngt-mesh-basic-material>
     </ngt-mesh>
   `,
+  imports: [NgtMesh, NgtBoxGeometry, NgtMeshBasicMaterial],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [
     {
@@ -408,6 +415,7 @@ export class NgtSobaGizmoEdgeCube extends NgtSobaGizmoViewCubeGeneric<THREE.Mesh
 
 @Component({
   selector: 'ngt-soba-gizmo-viewcube',
+  standalone: true,
   template: `
     <ngt-group [scale]="60">
       <ngt-soba-gizmo-face-cube [ngtSobaGizmoViewCubeGenericPassThrough]="this"></ngt-soba-gizmo-face-cube>
@@ -430,6 +438,15 @@ export class NgtSobaGizmoEdgeCube extends NgtSobaGizmoViewCubeGeneric<THREE.Mesh
       <ngt-point-light [position]="10" intensity="0.5"></ngt-point-light>
     </ngt-group>
   `,
+  imports: [
+    NgtGroup,
+    NgtSobaGizmoFaceCube,
+    NgtSobaGizmoEdgeCube,
+    NgtAmbientLight,
+    NgtPointLight,
+    NgtSobaGizmoViewCubePassThrough,
+    NgForOf,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [
     {
@@ -447,24 +464,7 @@ export class NgtSobaGizmoViewcube extends NgtSobaGizmoViewCubeGeneric<THREE.Grou
 }
 
 @NgModule({
-  declarations: [
-    NgtSobaGizmoViewcube,
-    NgtSobaGizmoViewCubePassThrough,
-    NgtSobaGizmoFaceMaterial,
-    NgtSobaGizmoFaceCube,
-    NgtSobaGizmoEdgeCube,
-  ],
+  imports: [NgtSobaGizmoViewcube],
   exports: [NgtSobaGizmoViewcube],
-  imports: [
-    CommonModule,
-    NgtMeshLambertMaterialModule,
-    NgtMeshBasicMaterialModule,
-    NgtMeshModule,
-    NgtBoxGeometryModule,
-    NgtGroupModule,
-    NgtAmbientLightModule,
-    NgtPointLightModule,
-    NgtRepeatModule,
-  ],
 })
 export class NgtSobaGizmoViewcubeModule {}