chore: migrate to standalone components API

mpalourdio · Sep 11, 2024 · cf694c6 · cf694c6
1 parent f67b023
commit cf694c6
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 67 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,8 @@
 # Changelog
 
+## v0.13.0
+- Embrace standalone components and get rig of `NgModule`.
+
 ## v0.12.0
 
 - `angular 18` migration.

diff --git a/README.md b/README.md
@@ -15,7 +15,7 @@ Use the fork, Luke. PR without tests will likely not be merged.
 
 ## What is it ?
 
-It's an angular component to easily integrate [intl-tel-input](https://github.com/jackocnr/intl-tel-input).
+It's an angular standalone component to easily integrate [intl-tel-input](https://github.com/jackocnr/intl-tel-input).
 
 ## Installation
 

diff --git a/src/lib/components/intl-tel-input.component.html b/src/lib/components/intl-tel-input.component.html
@@ -1,4 +1,6 @@
-<label [attr.for]="name" [ngClass]="labelCssClass" *ngIf="label && name" >{{label}}</label>
+@if (label && name) {
+    <label [attr.for]="name" [ngClass]="labelCssClass" >{{ label }}</label>
+}
 <input
     type="text"
     [ngClass]="cssClass"

diff --git a/src/lib/components/intl-tel-input.component.spec.ts b/src/lib/components/intl-tel-input.component.spec.ts
@@ -18,10 +18,8 @@ describe('IntlTelInputComponent', () => {
 
     beforeEach(async () => {
         await TestBed.configureTestingModule({
-            declarations: [
-                IntlTelInputComponent,
-            ],
             imports: [
+                IntlTelInputComponent,
                 FormsModule,
             ],
             providers: [

diff --git a/src/lib/components/intl-tel-input.component.ts b/src/lib/components/intl-tel-input.component.ts
@@ -8,15 +8,18 @@
  */
 
 import { AfterViewInit, Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core';
-import { ControlContainer, NgForm } from '@angular/forms';
+import { ControlContainer, FormsModule, NgForm } from '@angular/forms';
 import intlTelInput from 'intl-tel-input';
 import { IntlTelInputOptions } from '../model/intl-tel-input-options';
 import { IntlTelInput } from "../model/intl-tel-input";
+import { NgClass } from "@angular/common";
 
 @Component({
     selector: 'intl-tel-input',
+    standalone: true,
     templateUrl: './intl-tel-input.component.html',
     styleUrls: ['./intl-tel-input.component.scss'],
+    imports: [NgClass, FormsModule],
     viewProviders: [{ provide: ControlContainer, useExisting: NgForm }]
 })
 export class IntlTelInputComponent implements AfterViewInit {

diff --git a/src/lib/intl-tel-input-ng.module.spec.ts b/src/lib/intl-tel-input-ng.module.spec.ts
diff --git a/src/lib/intl-tel-input-ng.module.ts b/src/lib/intl-tel-input-ng.module.ts