feat: migrate library to standalone (#1141)

.eslintrc.json

@@ -229,7 +229,8 @@
                 "@angular-eslint/no-input-rename": "off",
                 "@angular-eslint/no-inputs-metadata-property": "off",
                 "@angular-eslint/directive-class-suffix": "off",
-                "@angular-eslint/no-output-rename": "off"
+                "@angular-eslint/no-output-rename": "off",
+                "@angular-eslint/prefer-standalone": ["error"]
             }
         },
         {
@@ -243,7 +244,8 @@
                 "jasmine/prefer-toHaveBeenCalledWith": "off",
                 "@typescript-eslint/no-unused-vars": "off",
                 "@typescript-eslint/non-nullable-type-assertion-style": "off",
-                "@angular-eslint/no-empty-lifecycle-method": "off"
+                "@angular-eslint/no-empty-lifecycle-method": "off",
+                "@angular-eslint/prefer-standalone": ["error"]
             }
         },
         {

projects/ng-aquila/documentation/assets/stack-blitz/src/main.ts

@@ -1,4 +1,4 @@
-import { HttpClientJsonpModule, HttpClientModule } from '@angular/common/http';
+import { provideHttpClient, withInterceptorsFromDi, withJsonpSupport } from '@angular/common/http';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
@@ -16,18 +16,8 @@ import { AquilaDocsExample } from './app/aquila-docs-example';
 @NgModule({
     bootstrap: [AquilaDocsExample],
     declarations: [AquilaDocsExample],
-    imports: [
-        BrowserModule,
-        BrowserAnimationsModule,
-        FormsModule,
-        HttpClientJsonpModule,
-        HttpClientModule,
-        ReactiveFormsModule,
-        RouterModule.forRoot([]),
-        AquilaModule,
-        NgOptimizedImage,
-        AgGridModule,
-    ],
+    imports: [BrowserModule, BrowserAnimationsModule, FormsModule, ReactiveFormsModule, RouterModule.forRoot([]), AquilaModule, NgOptimizedImage, AgGridModule],
+    providers: [provideHttpClient(withInterceptorsFromDi(), withJsonpSupport())],
 })
 export class AppModule {}
 

projects/ng-aquila/documentation/examples/accessibility/accessibility-examples.module.ts

@@ -7,8 +7,7 @@ import { AccessibilityHighContrastSvgExampleComponent } from './accessibility-hi
 const EXAMPLES = [AccessibilityHighContrastSvgExampleComponent];
 
 @NgModule({
-    imports: [NxMessageModule, NxGridModule],
-    declarations: [EXAMPLES],
+    imports: [NxMessageModule, NxGridModule, EXAMPLES],
     exports: [EXAMPLES],
 })
 export class AccessibilityExamplesModule {

projects/ng-aquila/documentation/examples/accessibility/accessibility-high-contrast-svg/accessibility-high-contrast-svg-example.ts

@@ -1,4 +1,10 @@
 import { Component } from '@angular/core';
+import {
+    NxColComponent,
+    NxLayoutComponent,
+    NxRowComponent,
+} from '@aposin/ng-aquila/grid';
+import { NxMessageComponent } from '@aposin/ng-aquila/message';
 
 /**
  * @title High contrast svg example
@@ -7,5 +13,12 @@ import { Component } from '@angular/core';
     selector: 'accessibility-high-contrast-svg-example',
     templateUrl: './accessibility-high-contrast-svg-example.html',
     styleUrls: ['./accessibility-high-contrast-svg-example.css'],
+    standalone: true,
+    imports: [
+        NxMessageComponent,
+        NxLayoutComponent,
+        NxRowComponent,
+        NxColComponent,
+    ],
 })
 export class AccessibilityHighContrastSvgExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-error/accordion-error-example.ts

@@ -1,5 +1,30 @@
+import { NgIf } from '@angular/common';
 import { Component } from '@angular/core';
-import { FormBuilder, Validators } from '@angular/forms';
+import {
+    FormBuilder,
+    FormsModule,
+    ReactiveFormsModule,
+    Validators,
+} from '@angular/forms';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxErrorComponent } from '@aposin/ng-aquila/base';
+import {
+    NxFormfieldComponent,
+    NxFormfieldErrorDirective,
+} from '@aposin/ng-aquila/formfield';
+import {
+    NxColComponent,
+    NxLayoutComponent,
+    NxRowComponent,
+} from '@aposin/ng-aquila/grid';
+import { NxIconComponent } from '@aposin/ng-aquila/icon';
+import { NxInputDirective } from '@aposin/ng-aquila/input';
+import { NxMessageComponent } from '@aposin/ng-aquila/message';
 
 /**
  * @title Accordion Error Example
@@ -8,6 +33,25 @@ import { FormBuilder, Validators } from '@angular/forms';
     selector: 'accordion-error-example',
     templateUrl: './accordion-error-example.html',
     styleUrls: ['./accordion-error-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NgIf,
+        NxIconComponent,
+        FormsModule,
+        ReactiveFormsModule,
+        NxLayoutComponent,
+        NxRowComponent,
+        NxColComponent,
+        NxFormfieldComponent,
+        NxInputDirective,
+        NxErrorComponent,
+        NxFormfieldErrorDirective,
+        NxMessageComponent,
+    ],
 })
 export class AccordionErrorExampleComponent {
     readonly formGroupInfo = this.fb.group({

projects/ng-aquila/documentation/examples/accordion/accordion-examples.module.ts

@@ -38,8 +38,8 @@ const EXAMPLES = [
         NxIconModule,
         NxMessageModule,
         ExamplesSharedModule,
+        EXAMPLES,
     ],
-    declarations: [EXAMPLES],
     exports: [EXAMPLES],
 })
 export class AccordionExamplesModule {

projects/ng-aquila/documentation/examples/accordion/accordion-extra-light-negative/accordion-extra-light-negative-example.ts

@@ -1,4 +1,11 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Extra Light Negative Styling Example
@@ -7,5 +14,13 @@ import { Component } from '@angular/core';
     selector: 'accordion-extra-light-negative-example',
     templateUrl: './accordion-extra-light-negative-example.html',
     styleUrls: ['./accordion-extra-light-negative-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionExtraLightNegativeExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-extra-light/accordion-extra-light-example.ts

@@ -1,4 +1,11 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Accordion Extra Light Example
@@ -7,5 +14,13 @@ import { Component } from '@angular/core';
     selector: 'accordion-extra-light-example',
     templateUrl: './accordion-extra-light-example.html',
     styleUrls: ['./accordion-extra-light-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionExtraLightExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-lazy/accordion-lazy-example.ts

@@ -1,4 +1,12 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelBodyDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Lazy Loading Example
@@ -7,5 +15,14 @@ import { Component } from '@angular/core';
     selector: 'accordion-lazy-example',
     templateUrl: './accordion-lazy-example.html',
     styleUrls: ['./accordion-lazy-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxExpansionPanelBodyDirective,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionLazyExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-light-negative/accordion-light-negative-example.ts

@@ -1,4 +1,11 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Light Negative Styling Example
@@ -7,5 +14,13 @@ import { Component } from '@angular/core';
     selector: 'accordion-light-negative-example',
     templateUrl: './accordion-light-negative-example.html',
     styleUrls: ['./accordion-light-negative-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionLightNegativeExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-light/accordion-light-example.ts

@@ -1,4 +1,11 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Light Styling Example
@@ -7,5 +14,13 @@ import { Component } from '@angular/core';
     selector: 'accordion-light-example',
     templateUrl: './accordion-light-example.html',
     styleUrls: ['./accordion-light-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionLightExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-multi/accordion-multi-example.ts

@@ -1,4 +1,12 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxButtonComponent } from '@aposin/ng-aquila/button';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Multi Accordion Example
@@ -7,6 +15,15 @@ import { Component } from '@angular/core';
     selector: 'accordion-multi-example',
     templateUrl: './accordion-multi-example.html',
     styleUrls: ['./accordion-multi-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxCopytextComponent,
+        NxButtonComponent,
+    ],
 })
 export class AccordionMultiExampleComponent {
     multi = true;

projects/ng-aquila/documentation/examples/accordion/accordion-negative/accordion-negative-example.ts

@@ -1,4 +1,11 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
 
 /**
  * @title Negative Styling Example
@@ -7,5 +14,13 @@ import { Component } from '@angular/core';
     selector: 'accordion-negative-example',
     templateUrl: './accordion-negative-example.html',
     styleUrls: ['./accordion-negative-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionNegativeExampleComponent {}

projects/ng-aquila/documentation/examples/accordion/accordion-scroll-smooth/accordion-scroll-smooth-example.ts

@@ -1,4 +1,12 @@
 import { Component } from '@angular/core';
+import {
+    NxAccordionDirective,
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
+import { NxHeadlineComponent } from '@aposin/ng-aquila/headline';
 
 /**
  * @title Smooth Scrolling Example
@@ -7,6 +15,15 @@ import { Component } from '@angular/core';
     selector: 'accordion-scroll-smooth-example',
     templateUrl: './accordion-scroll-smooth-example.html',
     styleUrls: ['./accordion-scroll-smooth-example.css'],
+    standalone: true,
+    imports: [
+        NxAccordionDirective,
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxHeadlineComponent,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionScrollSmoothExampleComponent {
     scrollIntoViewActive = true;

projects/ng-aquila/documentation/examples/accordion/accordion-standalone/accordion-standalone-example.ts

@@ -1,4 +1,11 @@
 import { Component } from '@angular/core';
+import {
+    NxExpansionPanelComponent,
+    NxExpansionPanelHeaderComponent,
+    NxExpansionPanelTitleDirective,
+} from '@aposin/ng-aquila/accordion';
+import { NxCopytextComponent } from '@aposin/ng-aquila/copytext';
+import { NxHeadlineComponent } from '@aposin/ng-aquila/headline';
 
 /**
  * @title Standalone Expansion Panel Example
@@ -7,5 +14,13 @@ import { Component } from '@angular/core';
     selector: 'accordion-standalone-example',
     templateUrl: './accordion-standalone-example.html',
     styleUrls: ['./accordion-standalone-example.css'],
+    standalone: true,
+    imports: [
+        NxExpansionPanelComponent,
+        NxExpansionPanelHeaderComponent,
+        NxExpansionPanelTitleDirective,
+        NxHeadlineComponent,
+        NxCopytextComponent,
+    ],
 })
 export class AccordionStandaloneExampleComponent {}