From 2079ed650b2d020e172ff93c52c5f9f4e613d9ad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rapha=C3=ABl=20Balet?= <raphael@megaphone.info>
Date: Tue, 23 Apr 2024 08:13:24 +0200
Subject: [PATCH] docs(README): outputs

---
 README.md                                                 | 8 +++++++-
 .../ngx-mat-input-tel-tester/src/app/app.component.html   | 3 +--
 projects/ngx-mat-input-tel/README.md                      | 8 +++++++-
 .../src/lib/ngx-mat-input-tel.component.ts                | 6 +++---
 4 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 06f6ec0b0..40d3f1056 100644
--- a/README.md
+++ b/README.md
@@ -95,7 +95,7 @@ If you want to show the sample number for the country selected or errors , use m
 </form>
 ```
 
-## Options
+## Inputs
 
 | Options            | Type       | Default      | Description                                                                         |
 | ------------------ | ---------- | ------------ | ----------------------------------------------------------------------------------- |
@@ -108,6 +108,12 @@ If you want to show the sample number for the country selected or errors , use m
 | resetOnChange      | `boolean`  | `false`      | Reset input on country change                                                       |
 | searchPlaceholder  | `string`   | `Search ...` | Placeholder for the search input                                                    |
 
+
+## Outputs
+| Options        | Type                    | Default     | Description       |
+| -------------- | ----------------------- | ----------- | ----------------- |
+| countryChanged | `EventEmitter<Country>` | `undefined` | On country change |
+
 ## Css variable
 | Name                            | Default        | Explanation                                         |
 | ------------------------------- | -------------- | --------------------------------------------------- |
diff --git a/projects/ngx-mat-input-tel-tester/src/app/app.component.html b/projects/ngx-mat-input-tel-tester/src/app/app.component.html
index 78cbf4ac1..e1708bb06 100644
--- a/projects/ngx-mat-input-tel-tester/src/app/app.component.html
+++ b/projects/ngx-mat-input-tel-tester/src/app/app.component.html
@@ -9,10 +9,10 @@ <h3 id="phoneInput">Test International Telephone Input Form</h3>
         [preferredCountries]="['us', 'ca']"
         enablePlaceholder
         enableSearch
-        required
         [formControl]="phoneForm.controls.phone"
         placeholder="Enter Number"
         describedBy="phoneInput"
+        required
         #phone
       ></ngx-mat-input-tel>
       <mat-hint>e.g. {{ phone.selectedCountry.placeHolder }}</mat-hint>
@@ -67,7 +67,6 @@ <h2>Required & PlaceHolder</h2>
         placeholder="Enter Number"
         enablePlaceholder
         enableSearch
-        required
         #phone1
       ></ngx-mat-input-tel>
       <mat-label>Phone</mat-label>
diff --git a/projects/ngx-mat-input-tel/README.md b/projects/ngx-mat-input-tel/README.md
index 06f6ec0b0..40d3f1056 100644
--- a/projects/ngx-mat-input-tel/README.md
+++ b/projects/ngx-mat-input-tel/README.md
@@ -95,7 +95,7 @@ If you want to show the sample number for the country selected or errors , use m
 </form>
 ```
 
-## Options
+## Inputs
 
 | Options            | Type       | Default      | Description                                                                         |
 | ------------------ | ---------- | ------------ | ----------------------------------------------------------------------------------- |
@@ -108,6 +108,12 @@ If you want to show the sample number for the country selected or errors , use m
 | resetOnChange      | `boolean`  | `false`      | Reset input on country change                                                       |
 | searchPlaceholder  | `string`   | `Search ...` | Placeholder for the search input                                                    |
 
+
+## Outputs
+| Options        | Type                    | Default     | Description       |
+| -------------- | ----------------------- | ----------- | ----------------- |
+| countryChanged | `EventEmitter<Country>` | `undefined` | On country change |
+
 ## Css variable
 | Name                            | Default        | Explanation                                         |
 | ------------------------------- | -------------- | --------------------------------------------------- |
diff --git a/projects/ngx-mat-input-tel/src/lib/ngx-mat-input-tel.component.ts b/projects/ngx-mat-input-tel/src/lib/ngx-mat-input-tel.component.ts
index 30ee1b12c..2c614f1fc 100644
--- a/projects/ngx-mat-input-tel/src/lib/ngx-mat-input-tel.component.ts
+++ b/projects/ngx-mat-input-tel/src/lib/ngx-mat-input-tel.component.ts
@@ -136,6 +136,7 @@ export class NgxMatInputTelComponent
     return this._format
   }
 
+  private _placeholder?: string
   @Input()
   set placeholder(value: string) {
     this._placeholder = value
@@ -145,6 +146,7 @@ export class NgxMatInputTelComponent
     return this._placeholder || ''
   }
 
+  private _required = false
   @Input({ transform: booleanAttribute })
   set required(value: boolean) {
     this._required = coerceBooleanProperty(value)
@@ -154,6 +156,7 @@ export class NgxMatInputTelComponent
     return this._required
   }
 
+  private _disabled = false
   @Input({ alias: 'disabled', transform: booleanAttribute })
   set disabled(value: boolean) {
     this._disabled = coerceBooleanProperty(value)
@@ -170,9 +173,6 @@ export class NgxMatInputTelComponent
   @Output()
   countryChanged: EventEmitter<Country> = new EventEmitter<Country>()
 
-  private _placeholder?: string
-  private _required = false
-  private _disabled = false
   stateChanges = new Subject<void>()
   focused = false
   describedBy = ''