feat(ref: no-ref): angular v20

angular.json

@@ -7,16 +7,34 @@
             "style": "scss",
             "standalone": true,
             "changeDetection": "OnPush",
-            "viewEncapsulation": "Emulated"
+            "viewEncapsulation": "Emulated",
+            "type": "component"
         },
         "@schematics/angular:directive": {
-            "standalone": true
+            "standalone": true,
+            "type": "directive"
         },
         "@schematics/angular:pipe": {
-            "standalone": true
+            "standalone": true,
+            "typeSeparator": "."
         },
         "@schematics/angular:application": {
             "strict": true
+        },
+        "@schematics/angular:service": {
+            "type": "service"
+        },
+        "@schematics/angular:guard": {
+            "typeSeparator": "."
+        },
+        "@schematics/angular:interceptor": {
+            "typeSeparator": "."
+        },
+        "@schematics/angular:module": {
+            "typeSeparator": "."
+        },
+        "@schematics/angular:resolver": {
+            "typeSeparator": "."
         }
     },
     "projects": {
@@ -85,17 +103,7 @@
                 "test": {
                     "builder": "@angular-devkit/build-angular:web-test-runner",
                     "options": {
-                        "tsConfig": "tsconfig.spec.json",
-                        "inlineStyleLanguage": "scss",
-                        "assets": [
-                            "src/favicon.ico",
-                            "src/assets",
-                            "src/robots.txt",
-                            "src/sitemap.xml"
-                        ],
-                        "polyfills": ["zone.js", "zone.js/testing"],
-                        "styles": ["src/styles.scss"],
-                        "scripts": []
+                        "tsConfig": "tsconfig.spec.json"
                     }
                 },
                 "lint": {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "ngx-loader-indicator",
-    "version": "19.0.1",
+    "version": "20.0.0",
     "description": "The best directive without wrapping your element to additional component",
     "license": "MIT",
     "keywords": [
@@ -19,8 +19,9 @@
         "build:lib": "ng build --configuration production ngx-loader-indicator-lib && bun run copy-libdocs",
         "copy-libdocs": "cp README.md LICENSE dist/ngx-loader-indicator-lib",
         "publish:lib": "cd dist/ngx-loader-indicator-lib && bun publish",
-        "test": "ng test",
-        "test:pre-commit": "ng test --watch=false",
+        "test": "npx vitest",
+        "test:pre-commit": "npx vitest run",
+        "test:coverage": "npx vitest run --coverage",
         "lint": "npx eslint . && bun run lint:scss",
         "lint:scss": "stylelint \"**/*.scss\"",
         "lint:scss:fix": "stylelint \"**/*.scss\" --fix",
@@ -36,65 +37,70 @@
         "url": "https://github.com/JsDaddy/ngx-loader-indicator.git"
     },
     "dependencies": {
-        "@angular/animations": "19.2.8",
-        "@angular/common": "19.2.8",
-        "@angular/compiler": "19.2.8",
-        "@angular/core": "19.2.8",
-        "@angular/forms": "19.2.8",
-        "@angular/platform-browser": "19.2.8",
-        "@angular/platform-browser-dynamic": "19.2.8",
-        "@angular/router": "^19.2.8",
-        "@tailwindcss/postcss": "^4.1.4",
-        "core-js": "3.42.0",
+        "@angular/animations": "20.1.4",
+        "@angular/common": "20.1.4",
+        "@angular/compiler": "20.1.4",
+        "@angular/core": "20.1.4",
+        "@angular/forms": "20.1.4",
+        "@angular/platform-browser": "20.1.4",
+        "@angular/platform-browser-dynamic": "20.1.4",
+        "@angular/router": "^20.1.4",
+        "@tailwindcss/postcss": "^4.1.11",
+        "core-js": "3.45.0",
         "highlight.js": "^11.11.1",
-        "ngx-highlightjs": "^14.0.0",
-        "ngxtension": "5.0.0",
-        "rxjs": "7.8.2"
+        "ngx-highlightjs": "^14.0.1",
+        "ngxtension": "5.1.0",
+        "rxjs": "7.8.2",
+        "zone.js": "^0.15.1"
     },
     "devDependencies": {
-        "@angular-devkit/build-angular": "19.2.9",
-        "@angular-eslint/builder": "19.3.0",
-        "@angular-eslint/eslint-plugin": "19.3.0",
-        "@angular-eslint/eslint-plugin-template": "19.3.0",
-        "@angular-eslint/schematics": "19.3.0",
-        "@angular-eslint/template-parser": "19.3.0",
-        "@angular/cli": "19.2.9",
-        "@angular/compiler-cli": "19.2.8",
-        "@angular/language-service": "19.2.8",
-        "@commitlint/cli": "19.8.0",
-        "@commitlint/config-conventional": "19.8.0",
-        "@types/jasmine": "5.1.7",
+        "@angular-devkit/build-angular": "20.1.4",
+        "@angular-eslint/builder": "20.1.1",
+        "@angular-eslint/eslint-plugin": "20.1.1",
+        "@angular-eslint/eslint-plugin-template": "20.1.1",
+        "@angular-eslint/schematics": "20.1.1",
+        "@angular-eslint/template-parser": "20.1.1",
+        "@angular/cli": "20.1.4",
+        "@angular/compiler-cli": "20.1.4",
+        "@angular/language-service": "20.1.4",
+        "@commitlint/cli": "19.8.1",
+        "@commitlint/config-conventional": "19.8.1",
+        "@types/jasmine": "5.1.8",
         "@types/jasminewd2": "2.0.13",
-        "@types/node": "22.15.3",
-        "@typescript-eslint/eslint-plugin": "8.31.1",
-        "@web/test-runner": "^0.20.1",
-        "angular-eslint": "^19.3.0",
-        "eslint": "9.25.1",
-        "eslint-config-prettier": "10.1.2",
-        "eslint-plugin-import": "2.31.0",
+        "@types/node": "24.2.0",
+        "@typescript-eslint/eslint-plugin": "8.39.0",
+        "@vitest/browser": "^3.2.4",
+        "@vitest/coverage-v8": "3.2.4",
+        "@web/test-runner": "^0.20.2",
+        "angular-eslint": "^20.1.1",
+        "bun-types": "^1.2.19",
+        "eslint": "9.32.0",
+        "eslint-config-prettier": "10.1.8",
+        "eslint-plugin-import": "2.32.0",
         "eslint-plugin-json": "4.0.1",
-        "eslint-plugin-prettier": "5.2.6",
-        "jasmine-core": "5.7.0",
+        "eslint-plugin-prettier": "5.5.3",
+        "jasmine-core": "5.9.0",
         "jasmine-spec-reporter": "7.0.0",
-        "lint-staged": "15.5.1",
-        "ng-packagr": "19.2.2",
-        "npm-check-updates": "^18.0.1",
-        "prettier": "3.5.3",
-        "puppeteer": "24.7.2",
-        "semantic-release": "24.2.3",
-        "semantic-release-export-data": "1.1.0",
-        "snyk": "^1.1296.2",
-        "stylelint": "16.19.1",
+        "jsdom": "^26.1.0",
+        "lint-staged": "16.1.4",
+        "ng-packagr": "20.1.0",
+        "npm-check-updates": "^18.0.2",
+        "postcss": "^8.5.6",
+        "prettier": "3.6.2",
+        "puppeteer": "24.15.0",
+        "semantic-release": "24.2.7",
+        "semantic-release-export-data": "1.1.1",
+        "snyk": "^1.1298.2",
+        "stylelint": "16.23.0",
         "stylelint-config-prettier": "9.0.5",
-        "stylelint-config-recommended-scss": "14.1.0",
+        "stylelint-config-recommended-scss": "15.0.1",
         "stylelint-prettier": "5.0.3",
+        "tailwindcss": "^4.1.11",
         "ts-node": "10.9.2",
         "type-coverage": "^2.29.7",
-        "typescript": "5.8.3",
-        "typescript-eslint": "^8.31.1",
-        "tailwindcss": "^4.1.4",
-        "bun-types": "^1.2.11",
-        "postcss": "^8.5.3"
+        "typescript": "5.8.2",
+        "typescript-eslint": "^8.39.0",
+        "vitest": "^3.2.4"
     },
     "typeCoverage": {
         "atLeast": 98,

projects/ngx-loader-indicator-lib/package.json

@@ -1,6 +1,6 @@
 {
     "name": "ngx-loader-indicator",
-    "version": "19.0.1",
+    "version": "20.0.0",
     "description": "The best directive without wrapping your element to additional component",
     "license": "MIT",
     "keywords": [

projects/ngx-loader-indicator-lib/src/test.ts

@@ -1,12 +1,10 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+// This file is required by vitest and loads recursively all the .spec and framework files
+import 'zone.js';
 import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
-import {
-    BrowserDynamicTestingModule,
-    platformBrowserDynamicTesting,
-} from '@angular/platform-browser-dynamic/testing';
+import { BrowserTestingModule, platformBrowserTesting } from '@angular/platform-browser/testing';
 
 // First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
+getTestBed().initTestEnvironment(BrowserTestingModule, platformBrowserTesting(), {
     teardown: { destroyAfterEach: false },
 });

src/main.ts

@@ -1,4 +1,4 @@
-import { provideExperimentalZonelessChangeDetection } from '@angular/core';
+import { provideZonelessChangeDetection } from '@angular/core';
 import { provideHttpClient } from '@angular/common/http';
 import { bootstrapApplication } from '@angular/platform-browser';
 import { provideAnimations } from '@angular/platform-browser/animations';
@@ -12,7 +12,7 @@ import { AppComponent } from './app/app.component';
 
 bootstrapApplication(AppComponent, {
     providers: [
-        provideExperimentalZonelessChangeDetection(),
+        provideZonelessChangeDetection(),
         provideAnimations(),
         provideRouter([]),
         GithubStarsService,

src/test.ts

@@ -0,0 +1 @@
+

vitest.config.ts

@@ -0,0 +1,43 @@
+import { defineConfig } from 'vitest/config';
+import { resolve } from 'path';
+
+export default defineConfig({
+    test: {
+        globals: true,
+        environment: 'jsdom',
+        setupFiles: ['./src/test.ts'],
+        include: ['**/*.spec.ts'],
+        exclude: [
+            'node_modules/**',
+            'dist/**',
+            '**/*.d.ts',
+            'src/test.ts',
+            'projects/ngx-loader-indicator-lib/src/test.ts',
+        ],
+        coverage: {
+            provider: 'v8',
+            reporter: ['text', 'json', 'html'],
+            exclude: [
+                'node_modules/**',
+                'dist/**',
+                '**/*.spec.ts',
+                'src/test.ts',
+                'src/main.ts',
+                'projects/ngx-loader-indicator-lib/src/test.ts',
+                '**/*.config.*',
+                '**/*.d.ts',
+                '**/index.ts',
+                '**/public-api.ts',
+            ],
+            include: ['src/**/*.ts', 'projects/ngx-loader-indicator-lib/src/**/*.ts'],
+        },
+    },
+    resolve: {
+        alias: {
+            'ngx-loader-indicator': resolve(
+                __dirname,
+                './projects/ngx-loader-indicator-lib/src/public-api'
+            ),
+        },
+    },
+});