update angular version and add standalone components (#55)

Author: vicmans

CHANGELOG.md

@@ -1,6 +1,11 @@
 # Changelog
 All notable changes to this project will be documented in this file.
 
+## [1.6.0] - 2025-05-08
+### Change
+- Update to Angular 14
+- Introduce standole component
+
 ## [1.5.3] - 2024-07-20
 ### Added
 - Add `textAlign` input property ([#53](https://github.com/vicmans/ng-toggle-button/issues/53))

README.md

@@ -14,6 +14,7 @@ This is a toggle switch button component, you can see the demo [here][demo-url]
 
 | Angular  | ng-toggle-button|
 | -------- |:------:| 
+| >=16.0.0 | v1.6.x |
 | >=15.0.0 | v1.5.x |
 | >=14.0.0 | v1.4.x |
 | >=13.0.0 | v1.3.x |
@@ -37,15 +38,30 @@ yarn add ng-toggle-button
 
 ## Usage
 
-Import the module
+### Standalone: Import the component.
+
+```typescript
+import { NgToggleComponent } from 'ng-toggle-button';
+@Component({
+  selector: 'your-component',
+  standalone: true,
+  imports: [
+    ...,
+    NgToggleComponent,
+  ],
+  ...
+})
+```
+
+### NgModule: Import the module
 
 ```typescript
 import { NgToggleModule } from 'ng-toggle-button';
 @NgModule({
   ...
   imports: [
     ...,
-    NgToggleModule.forRoot() //or NgToggleModule
+    NgToggleModule
   ],
 })
 ```
@@ -63,9 +79,19 @@ import { NgToggleModule } from 'ng-toggle-button';
 })
 ```
 
-The `config` object is described in the table bellow
+You can edit the configuration globally by injecting `NgToggleConfig` service usually in the root component.
 
-Use
+```ts
+constructor(private config: NgToggleConfig) {
+  this.config.labels: {
+    unchecked: 'off',
+    checked: 'on',
+  };
+  this.config.color = 'crimson';
+}
+```
+
+Usage in template
 
 ```html
 <ng-toggle
@@ -77,6 +103,8 @@ Use
 ></ng-toggle>
 ```
 
+The `config` object is described in the table bellow
+
 ### Properties
 
 | Name | Type | Default | Description |

angular.json

@@ -19,9 +19,11 @@
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
-            "main": "projects/ng-toggle/src/test.ts",
             "tsConfig": "projects/ng-toggle/tsconfig.spec.json",
-            "karmaConfig": "projects/ng-toggle/karma.conf.js"
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ]
           }
         }
       }
@@ -39,7 +41,9 @@
             "outputPath": "dist/demo",
             "index": "projects/demo/src/index.html",
             "main": "projects/demo/src/main.ts",
-            "polyfills": "projects/demo/src/polyfills.ts",
+            "polyfills": [
+              "zone.js"
+            ],
             "tsConfig": "projects/demo/tsconfig.app.json",
             "aot": false,
             "assets": [
@@ -105,9 +109,11 @@
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
             "main": "projects/demo/src/test.ts",
-            "polyfills": "projects/demo/src/polyfills.ts",
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ],
             "tsConfig": "projects/demo/tsconfig.spec.json",
-            "karmaConfig": "projects/demo/karma.conf.js",
             "assets": [
               "projects/demo/src/favicon.ico",
               "projects/demo/src/assets"
@@ -117,18 +123,6 @@
             ],
             "scripts": []
           }
-        },
-        "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
-          "options": {
-            "protractorConfig": "projects/demo/e2e/protractor.conf.js",
-            "devServerTarget": "demo:serve"
-          },
-          "configurations": {
-            "production": {
-              "devServerTarget": "demo:serve:production"
-            }
-          }
         }
       }
     }