npm - @onemrvapublic/design-system - Versions diffs - 19.2.0-develop.8 → 19.2.0-develop.9 - Mend

@onemrvapublic/design-system 19.2.0-develop.8 → 19.2.0-develop.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/assets/i18n/de.json CHANGED Viewed

@@ -100,7 +100,8 @@
     "deselect.all": "Deselect All",
     "search": {
       "filter": "Forschen",
-      "notFound": "Kein Ergebnis"
+      "notFound": "Kein Ergebnis",
+      "not.found": "Kein Ergebnis"
     }
   },
   "layout": {
@@ -135,6 +136,7 @@
       "required": "Feld erforderlich",
       "invalid": "Ungültiges Feld",
       "notFound": "Nicht gefunden",
+      "not.found": "Nicht gefunden",
       "search": "Suchen",
       "label": "Telefonnummer",
       "hint": "Beginnen Sie mit 0 für belgische Telefonnummern"

package/assets/i18n/en.json CHANGED Viewed

@@ -100,7 +100,8 @@
     "deselect.all": "Deselect All",
     "search": {
       "filter": "Search",
-      "notFound": "Not found"
+      "notFound": "Not found",
+      "not.found": "Not found"
     }
   },
   "layout": {
@@ -135,6 +136,7 @@
       "required": "Field required",
       "invalid": "Field invalid",
       "notFound": "Not found",
+      "not.found": "Not found",
       "search": "Search",
       "label": "Phone number",
       "hint": "Start with 0 for belgian phone numbers"

package/assets/i18n/fr.json CHANGED Viewed

@@ -100,7 +100,8 @@
     "deselect.all": "Tout désélectionner",
     "search": {
       "filter": "Rechercher",
-      "notFound": "Pas de résultat"
+      "notFound": "Pas de résultat",
+      "not.found": "Pas de résultat"
     }
   },
   "layout": {
@@ -135,6 +136,7 @@
       "required": "Champs requis",
       "invalid": "Champs invalide",
       "notFound": "Introuvable",
+      "not.found": "Introuvable",
       "search": "Rechercher",
       "label": "Téléphone",
       "hint": "Start with 0 for belgian phone numbers"

package/assets/i18n/nl.json CHANGED Viewed

@@ -100,7 +100,8 @@
     "deselect.all": "Deselect All",
     "search": {
       "filter": "Zoeken",
-      "notFound": "Geen resultaten"
+      "notFound": "Geen resultaten",
+      "not.found": "Geen resultaten"
     }
   },
   "layout": {
@@ -134,6 +135,7 @@
       "required": "Veld vereist",
       "invalid": "Ongeldig veld",
       "notFound": "Niet gevonden",
+      "not.found": "Niet gevonden",
       "search": "Zoeken",
       "label": "Telefoonnummer",
       "hint": "Begin met 0 voor Belgische telefoonnummers"

package/fesm2022/onemrvapublic-design-system-mat-input-address.mjs ADDED Viewed

@@ -0,0 +1,90 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Output, Input, ViewEncapsulation, Component } from '@angular/core';
+import * as i5 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import { startWith, debounceTime, switchMap, map } from 'rxjs';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i3 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i4 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import * as i6 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { MatAutocompleteTrigger, MatAutocomplete } from '@angular/material/autocomplete';
+import { MatIcon } from '@angular/material/icon';
+import { FlagIconComponent } from '@onemrvapublic/design-system/flag-icon';
+import * as i1 from '@onemrvapublic/design-system/shared';
+class OnemrvaMatInputAddressComponent {
+    constructor(osm) {
+        this.osm = osm;
+        this.placeholder = 'input.address.placeholder';
+        this.readonly = false;
+        this.label = 'Address';
+        this.noEntriesFoundLabel = 'Not found';
+        this.hint = '';
+        this.getAddress = new EventEmitter();
+        this.isLoading = false;
+    }
+    ngOnInit() {
+        this.results$ = this.address.valueChanges.pipe(startWith(''), debounceTime(300), switchMap((value) => {
+            if (!value || value.length <= 2) {
+                this.isLoading = false;
+                return [];
+            }
+            this.isLoading = true;
+            return this.osm.searchAddress(value).pipe(map(results => {
+                this.isLoading = false;
+                return results;
+            }));
+        }));
+    }
+    selectAddress(address) {
+        this.address.setValue(address.display_name);
+        this.getAddress.emit(address);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: OnemrvaMatInputAddressComponent, deps: [{ token: i1.OnemRvaOSMService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: OnemrvaMatInputAddressComponent, isStandalone: true, selector: "onemrva-mat-input-address", inputs: { placeholder: "placeholder", readonly: "readonly", address: "address", label: "label", noEntriesFoundLabel: "noEntriesFoundLabel", hint: "hint" }, outputs: { getAddress: "getAddress" }, ngImport: i0, template: "<mat-form-field appearance=\"outline\">\n  <mat-label>{{ label | translate }}</mat-label>\n  <mat-icon matSuffix [ngClass]=\"{ spin: isLoading }\">\n    {{ isLoading ? 'refresh' : 'search' }}\n  </mat-icon>\n\n  <input\n    type=\"text\"\n    matInput\n    [formControl]=\"address\"\n    [readonly]=\"readonly\"\n    [matAutocomplete]=\"auto\"\n    [placeholder]=\"placeholder | translate\"\n  />\n\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n\n  <mat-autocomplete\n    #auto=\"matAutocomplete\"\n    (optionSelected)=\"selectAddress($event.option.value)\"\n  >\n    <mat-option *ngFor=\"let result of results$ | async\" [value]=\"result\">\n      <span class=\"country\">\n        <flag-icon [countryCode]=\"result.address['country_code']\" />\n        {{ result.display_name }}\n      </span>\n    </mat-option>\n    <mat-option *ngIf=\"(results$ | async)?.length === 0\">\n      {{ noEntriesFoundLabel | translate }}\n    </mat-option>\n  </mat-autocomplete>\n</mat-form-field>\n", styles: ["onemrva-mat-input-address mat-form-field{width:100%}onemrva-mat-input-address .spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }, { kind: "directive", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: FlagIconComponent, selector: "flag-icon", inputs: ["countryCode", "mode", "width"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: OnemrvaMatInputAddressComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-mat-input-address', standalone: true, imports: [
+                        CommonModule,
+                        MatInputModule,
+                        MatFormFieldModule,
+                        MatSelectModule,
+                        ReactiveFormsModule,
+                        TranslateModule,
+                        MatAutocompleteTrigger,
+                        MatAutocomplete,
+                        MatIcon,
+                        FlagIconComponent,
+                    ], encapsulation: ViewEncapsulation.None, template: "<mat-form-field appearance=\"outline\">\n  <mat-label>{{ label | translate }}</mat-label>\n  <mat-icon matSuffix [ngClass]=\"{ spin: isLoading }\">\n    {{ isLoading ? 'refresh' : 'search' }}\n  </mat-icon>\n\n  <input\n    type=\"text\"\n    matInput\n    [formControl]=\"address\"\n    [readonly]=\"readonly\"\n    [matAutocomplete]=\"auto\"\n    [placeholder]=\"placeholder | translate\"\n  />\n\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n\n  <mat-autocomplete\n    #auto=\"matAutocomplete\"\n    (optionSelected)=\"selectAddress($event.option.value)\"\n  >\n    <mat-option *ngFor=\"let result of results$ | async\" [value]=\"result\">\n      <span class=\"country\">\n        <flag-icon [countryCode]=\"result.address['country_code']\" />\n        {{ result.display_name }}\n      </span>\n    </mat-option>\n    <mat-option *ngIf=\"(results$ | async)?.length === 0\">\n      {{ noEntriesFoundLabel | translate }}\n    </mat-option>\n  </mat-autocomplete>\n</mat-form-field>\n", styles: ["onemrva-mat-input-address mat-form-field{width:100%}onemrva-mat-input-address .spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
+        }], ctorParameters: () => [{ type: i1.OnemRvaOSMService }], propDecorators: { placeholder: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], address: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], noEntriesFoundLabel: [{
+                type: Input
+            }], hint: [{
+                type: Input
+            }], getAddress: [{
+                type: Output
+            }] } });
+/*
+ * Public API Surface of mat-bank-account-input
+ */
+/**
+ * Generated bundle index. Do not edit.
+ */
+export { OnemrvaMatInputAddressComponent };
+//# sourceMappingURL=onemrvapublic-design-system-mat-input-address.mjs.map

package/fesm2022/onemrvapublic-design-system-mat-input-address.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"onemrvapublic-design-system-mat-input-address.mjs","sources":["../../../../projects/onemrva/design-system/mat-input-address/src/onemrva-mat-input-address.component.ts","../../../../projects/onemrva/design-system/mat-input-address/src/onemrva-mat-input-address.component.html","../../../../projects/onemrva/design-system/mat-input-address/index.ts","../../../../projects/onemrva/design-system/mat-input-address/onemrvapublic-design-system-mat-input-address.ts"],"sourcesContent":["import {\n Component,\n EventEmitter,\n Input,\n Output,\n ViewEncapsulation,\n OnInit,\n} from '@angular/core';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\nimport { debounceTime, switchMap, Observable, startWith, map } from 'rxjs';\nimport { CommonModule } from '@angular/common';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatSelectModule } from '@angular/material/select';\nimport { TranslateModule } from '@ngx-translate/core';\nimport {\n MatAutocomplete,\n MatAutocompleteTrigger,\n} from '@angular/material/autocomplete';\nimport { MatIcon } from '@angular/material/icon';\nimport { FlagIconComponent } from '@onemrvapublic/design-system/flag-icon';\nimport {\n OnemRvaOSMService,\n OSMResult,\n} from '@onemrvapublic/design-system/shared';\n\n@Component({\n selector: 'onemrva-mat-input-address',\n styleUrls: ['onemrva-mat-input-address.component.scss'],\n templateUrl: 'onemrva-mat-input-address.component.html',\n standalone: true,\n imports: [\n CommonModule,\n MatInputModule,\n MatFormFieldModule,\n MatSelectModule,\n ReactiveFormsModule,\n TranslateModule,\n MatAutocompleteTrigger,\n MatAutocomplete,\n MatIcon,\n FlagIconComponent,\n ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class OnemrvaMatInputAddressComponent implements OnInit {\n @Input() placeholder = 'input.address.placeholder';\n @Input() readonly = false;\n @Input() address!: FormControl;\n @Input() label = 'Address';\n @Input() noEntriesFoundLabel = 'Not found';\n @Input() hint = '';\n @Output() getAddress = new EventEmitter<OSMResult>();\n\n results$!: Observable<OSMResult[]>;\n\n constructor(private osm: OnemRvaOSMService) {}\n\n isLoading = false;\n\n ngOnInit(): void {\n this.results$ = this.address.valueChanges.pipe(\n startWith(''),\n debounceTime(300),\n switchMap((value: string) => {\n if (!value || value.length <= 2) {\n this.isLoading = false;\n return [];\n }\n\n this.isLoading = true;\n return this.osm.searchAddress(value).pipe(\n map(results => {\n this.isLoading = false;\n return results;\n }),\n );\n }),\n );\n }\n\n selectAddress(address: OSMResult) {\n this.address.setValue(address.display_name);\n this.getAddress.emit(address);\n }\n}\n","<mat-form-field appearance=\"outline\">\n <mat-label>{{ label | translate }}</mat-label>\n <mat-icon matSuffix [ngClass]=\"{ spin: isLoading }\">\n {{ isLoading ? 'refresh' : 'search' }}\n </mat-icon>\n\n <input\n type=\"text\"\n matInput\n [formControl]=\"address\"\n [readonly]=\"readonly\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder | translate\"\n />\n\n <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"selectAddress($event.option.value)\"\n >\n <mat-option *ngFor=\"let result of results$ | async\" [value]=\"result\">\n <span class=\"country\">\n <flag-icon [countryCode]=\"result.address['country_code']\" />\n {{ result.display_name }}\n </span>\n </mat-option>\n <mat-option *ngIf=\"(results$ | async)?.length === 0\">\n {{ noEntriesFoundLabel | translate }}\n </mat-option>\n </mat-autocomplete>\n</mat-form-field>\n","/*\n * Public API Surface of mat-bank-account-input\n */\n\nexport * from './src/onemrva-mat-input-address.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/onemrvapublic-design-system-mat-input-phone.mjs CHANGED Viewed

@@ -73,6 +73,7 @@ class OnemrvaMatInputPhoneComponent {
         this.readonly = false;
         this.label = 'Phone number';
         this.noEntriesFoundLabel = 'Not found';
+        this.placeholder = '+32 475 12 34 56';
         this.placeholderLabel = 'Search';
         this.defaultPrefix = '+32';
         this.searchAriaLabel = '';
@@ -218,7 +219,7 @@ class OnemrvaMatInputPhoneComponent {
     }
     phoneNumberValidator(code) {
         return (_control) => {
-            let number = this.countryCode + _control.getRawValue();
+            let number = code + _control.getRawValue();
             if (number === '') {
                 return null;
             }
@@ -237,7 +238,7 @@ class OnemrvaMatInputPhoneComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: OnemrvaMatInputPhoneComponent, deps: [{ token: i1.OnemRvaCDNCountryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: OnemrvaMatInputPhoneComponent, isStandalone: true, selector: "onemrva-mat-input-phone", inputs: { readonly: "readonly", phoneNumber: "phoneNumber", label: "label", noEntriesFoundLabel: "noEntriesFoundLabel", placeholderLabel: "placeholderLabel", defaultPrefix: "defaultPrefix", searchAriaLabel: "searchAriaLabel", hint: "hint" }, outputs: { getCountry: "getCountry" }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: ["numberInput"], descendants: true }], ngImport: i0, template: "<ng-container>\n  <mat-form-field class=\"onemrva-input-phone-number\">\n    <mat-label>{{ label }}</mat-label>\n\n    <input\n      (click)=\"handleClick($event)\"\n      type=\"tel\"\n      matInput\n      phoneNumber\n      #numberInput\n      placeholder=\"+32 475 12 34 56\"\n      [formControl]=\"phoneNumber\"\n      class=\"onemrva-text-number\"\n      [readOnly]=\"readonly\"\n    />\n    <mat-select\n      matTextPrefix\n      class=\"onemrva-phone-number-select\"\n      [formControl]=\"countryCode\"\n    >\n      <mat-select-trigger>\n        <flag-icon [countryCode]=\"countryCode.getRawValue()\" />\n      </mat-select-trigger>\n      <mat-option>\n        <mat-select-search\n          [formControl]=\"filterCtrl\"\n          [ariaLabel]=\"searchAriaLabel\"\n          [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\n          [placeholderLabel]=\"placeholderLabel\"\n        ></mat-select-search>\n      </mat-option>\n      <mat-option\n        *ngFor=\"let country of filteredCountries$ | async\"\n        [value]=\"country.code\"\n      >\n        <flag-icon [countryCode]=\"country.code\" />\n        &nbsp;&nbsp;&nbsp;\n        {{ country.name }}\n        &nbsp;&nbsp;&nbsp;\n        <span class=\"dialcode\">\n          {{ country.dial_code }}\n        </span>\n      </mat-option>\n    </mat-select>\n    <mat-hint *ngIf=\"hint !== ''\">{{ hint }}</mat-hint>\n    <mat-error *ngIf=\"number.invalid\">{{ errors() | translate }}</mat-error>\n  </mat-form-field>\n</ng-container>\n", styles: [".onemrva-input-phone-number mat-select .mat-mdc-select-placeholder{width:1em!important;display:block!important}.onemrva-input-phone-number mat-select .mat-mdc-select-placeholder:before{width:1em!important;height:1em!important;background:#eee!important;visibility:visible!important;margin:10px 0!important}.onemrva-input-phone-number mat-select .mat-mdc-select-value{padding-right:8px}.onemrva-input-phone-number .onemrva-text-number{padding-left:12px!important;vertical-align:middle}.onemrva-input-phone-number .mat-mdc-form-field-text-prefix mat-select{line-height:14px!important}.onemrva-input-phone-number span.dialcode{color:#acaab2}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSelectSearchModule }, { kind: "component", type: i5.MatSelectSearchComponent, selector: "mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "directive", type: PhoneNumberDirective, selector: "[phoneNumber]" }, { kind: "component", type: FlagIconComponent, selector: "flag-icon", inputs: ["countryCode", "mode", "width"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: OnemrvaMatInputPhoneComponent, isStandalone: true, selector: "onemrva-mat-input-phone", inputs: { readonly: "readonly", phoneNumber: "phoneNumber", label: "label", noEntriesFoundLabel: "noEntriesFoundLabel", placeholder: "placeholder", placeholderLabel: "placeholderLabel", defaultPrefix: "defaultPrefix", searchAriaLabel: "searchAriaLabel", hint: "hint" }, outputs: { getCountry: "getCountry" }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: ["numberInput"], descendants: true }], ngImport: i0, template: "<ng-container>\n  <mat-form-field class=\"onemrva-input-phone-number\">\n    <mat-label>{{ label }}</mat-label>\n\n    <input\n      (click)=\"handleClick($event)\"\n      type=\"tel\"\n      matInput\n      phoneNumber\n      #numberInput\n      [placeholder]=\"placeholder\"\n      [formControl]=\"phoneNumber\"\n      class=\"onemrva-text-number\"\n      [readOnly]=\"readonly\"\n    />\n    <mat-select\n      matTextPrefix\n      class=\"onemrva-phone-number-select\"\n      [formControl]=\"countryCode\"\n    >\n      <mat-select-trigger>\n        <flag-icon [countryCode]=\"countryCode.getRawValue()\" />\n      </mat-select-trigger>\n      <mat-option>\n        <mat-select-search\n          [formControl]=\"filterCtrl\"\n          [ariaLabel]=\"searchAriaLabel\"\n          [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\n          [placeholderLabel]=\"placeholderLabel\"\n        ></mat-select-search>\n      </mat-option>\n      <mat-option\n        *ngFor=\"let country of filteredCountries$ | async\"\n        [value]=\"country.code\"\n      >\n        <flag-icon [countryCode]=\"country.code\" />\n        &nbsp;&nbsp;&nbsp;\n        {{ country.name }}\n        &nbsp;&nbsp;&nbsp;\n        <span class=\"dialcode\">\n          {{ country.dial_code }}\n        </span>\n      </mat-option>\n    </mat-select>\n    <mat-hint *ngIf=\"hint !== ''\">{{ hint }}</mat-hint>\n    <mat-error *ngIf=\"number.invalid\">{{ errors() | translate }}</mat-error>\n  </mat-form-field>\n</ng-container>\n", styles: [".onemrva-input-phone-number mat-select .mat-mdc-select-placeholder{width:1em!important;display:block!important}.onemrva-input-phone-number mat-select .mat-mdc-select-placeholder:before{width:1em!important;height:1em!important;background:#eee!important;visibility:visible!important;margin:10px 0!important}.onemrva-input-phone-number mat-select .mat-mdc-select-value{padding-right:8px}.onemrva-input-phone-number .onemrva-text-number{padding-left:12px!important;vertical-align:middle}.onemrva-input-phone-number .mat-mdc-form-field-text-prefix mat-select{line-height:14px!important}.onemrva-input-phone-number span.dialcode{color:#acaab2}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSelectSearchModule }, { kind: "component", type: i5.MatSelectSearchComponent, selector: "mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "directive", type: PhoneNumberDirective, selector: "[phoneNumber]" }, { kind: "component", type: FlagIconComponent, selector: "flag-icon", inputs: ["countryCode", "mode", "width"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: OnemrvaMatInputPhoneComponent, decorators: [{
             type: Component,
@@ -251,7 +252,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         TranslateModule,
                         PhoneNumberDirective,
                         FlagIconComponent,
-                    ], encapsulation: ViewEncapsulation.None, template: "<ng-container>\n  <mat-form-field class=\"onemrva-input-phone-number\">\n    <mat-label>{{ label }}</mat-label>\n\n    <input\n      (click)=\"handleClick($event)\"\n      type=\"tel\"\n      matInput\n      phoneNumber\n      #numberInput\n      placeholder=\"+32 475 12 34 56\"\n      [formControl]=\"phoneNumber\"\n      class=\"onemrva-text-number\"\n      [readOnly]=\"readonly\"\n    />\n    <mat-select\n      matTextPrefix\n      class=\"onemrva-phone-number-select\"\n      [formControl]=\"countryCode\"\n    >\n      <mat-select-trigger>\n        <flag-icon [countryCode]=\"countryCode.getRawValue()\" />\n      </mat-select-trigger>\n      <mat-option>\n        <mat-select-search\n          [formControl]=\"filterCtrl\"\n          [ariaLabel]=\"searchAriaLabel\"\n          [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\n          [placeholderLabel]=\"placeholderLabel\"\n        ></mat-select-search>\n      </mat-option>\n      <mat-option\n        *ngFor=\"let country of filteredCountries$ | async\"\n        [value]=\"country.code\"\n      >\n        <flag-icon [countryCode]=\"country.code\" />\n        &nbsp;&nbsp;&nbsp;\n        {{ country.name }}\n        &nbsp;&nbsp;&nbsp;\n        <span class=\"dialcode\">\n          {{ country.dial_code }}\n        </span>\n      </mat-option>\n    </mat-select>\n    <mat-hint *ngIf=\"hint !== ''\">{{ hint }}</mat-hint>\n    <mat-error *ngIf=\"number.invalid\">{{ errors() | translate }}</mat-error>\n  </mat-form-field>\n</ng-container>\n", styles: [".onemrva-input-phone-number mat-select .mat-mdc-select-placeholder{width:1em!important;display:block!important}.onemrva-input-phone-number mat-select .mat-mdc-select-placeholder:before{width:1em!important;height:1em!important;background:#eee!important;visibility:visible!important;margin:10px 0!important}.onemrva-input-phone-number mat-select .mat-mdc-select-value{padding-right:8px}.onemrva-input-phone-number .onemrva-text-number{padding-left:12px!important;vertical-align:middle}.onemrva-input-phone-number .mat-mdc-form-field-text-prefix mat-select{line-height:14px!important}.onemrva-input-phone-number span.dialcode{color:#acaab2}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, template: "<ng-container>\n  <mat-form-field class=\"onemrva-input-phone-number\">\n    <mat-label>{{ label }}</mat-label>\n\n    <input\n      (click)=\"handleClick($event)\"\n      type=\"tel\"\n      matInput\n      phoneNumber\n      #numberInput\n      [placeholder]=\"placeholder\"\n      [formControl]=\"phoneNumber\"\n      class=\"onemrva-text-number\"\n      [readOnly]=\"readonly\"\n    />\n    <mat-select\n      matTextPrefix\n      class=\"onemrva-phone-number-select\"\n      [formControl]=\"countryCode\"\n    >\n      <mat-select-trigger>\n        <flag-icon [countryCode]=\"countryCode.getRawValue()\" />\n      </mat-select-trigger>\n      <mat-option>\n        <mat-select-search\n          [formControl]=\"filterCtrl\"\n          [ariaLabel]=\"searchAriaLabel\"\n          [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\n          [placeholderLabel]=\"placeholderLabel\"\n        ></mat-select-search>\n      </mat-option>\n      <mat-option\n        *ngFor=\"let country of filteredCountries$ | async\"\n        [value]=\"country.code\"\n      >\n        <flag-icon [countryCode]=\"country.code\" />\n        &nbsp;&nbsp;&nbsp;\n        {{ country.name }}\n        &nbsp;&nbsp;&nbsp;\n        <span class=\"dialcode\">\n          {{ country.dial_code }}\n        </span>\n      </mat-option>\n    </mat-select>\n    <mat-hint *ngIf=\"hint !== ''\">{{ hint }}</mat-hint>\n    <mat-error *ngIf=\"number.invalid\">{{ errors() | translate }}</mat-error>\n  </mat-form-field>\n</ng-container>\n", styles: [".onemrva-input-phone-number mat-select .mat-mdc-select-placeholder{width:1em!important;display:block!important}.onemrva-input-phone-number mat-select .mat-mdc-select-placeholder:before{width:1em!important;height:1em!important;background:#eee!important;visibility:visible!important;margin:10px 0!important}.onemrva-input-phone-number mat-select .mat-mdc-select-value{padding-right:8px}.onemrva-input-phone-number .onemrva-text-number{padding-left:12px!important;vertical-align:middle}.onemrva-input-phone-number .mat-mdc-form-field-text-prefix mat-select{line-height:14px!important}.onemrva-input-phone-number span.dialcode{color:#acaab2}\n"] }]
         }], ctorParameters: () => [{ type: i1.OnemRvaCDNCountryService }], propDecorators: { readonly: [{
                 type: Input
             }], phoneNumber: [{
@@ -260,6 +261,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                 type: Input
             }], noEntriesFoundLabel: [{
                 type: Input
+            }], placeholder: [{
+                type: Input
             }], placeholderLabel: [{
                 type: Input
             }], defaultPrefix: [{

package/fesm2022/onemrvapublic-design-system-mat-input-phone.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"onemrvapublic-design-system-mat-input-phone.mjs","sources":["../../../../projects/onemrva/design-system/mat-input-phone/src/phone-number.directive.ts","../../../../projects/onemrva/design-system/mat-input-phone/src/onemrva-mat-input-phone.component.ts","../../../../projects/onemrva/design-system/mat-input-phone/src/onemrva-mat-input-phone.component.html","../../../../projects/onemrva/design-system/mat-input-phone/index.ts","../../../../projects/onemrva/design-system/mat-input-phone/onemrvapublic-design-system-mat-input-phone.ts"],"sourcesContent":["import { Directive, HostListener } from '@angular/core';\n\n@Directive({\n selector: '[phoneNumber]',\n standalone: true,\n})\nexport class PhoneNumberDirective {\n @HostListener('keydown', ['$event']) onKeyDown(event: any) {\n const e = event as KeyboardEvent;\n\n const allowedKey = [\n '0',\n '1',\n '2',\n '3',\n '4',\n '5',\n '6',\n '7',\n '8',\n '9',\n ' ',\n 'Backspace',\n 'Delete',\n 'Tab',\n '+',\n '-',\n 'Enter',\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowDown',\n 'Home',\n 'End',\n ];\n\n if (allowedKey.indexOf(e.key) >= 0) return;\n\n const allowedCtrlShortcuts = ['a', 'c', 'x', 'v'];\n if (e.ctrlKey && allowedCtrlShortcuts.indexOf(e.key) >= 0) return;\n\n e.preventDefault();\n }\n}\n","import { CommonModule } from '@angular/common';\nimport {\n Component,\n ElementRef,\n EventEmitter,\n Input,\n OnDestroy,\n OnInit,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport {\n AbstractControl,\n FormControl,\n ReactiveFormsModule,\n ValidationErrors,\n ValidatorFn,\n Validators,\n} from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatSelectModule } from '@angular/material/select';\nimport { TranslateModule } from '@ngx-translate/core';\nimport {\n Observable,\n Subject,\n map,\n startWith,\n debounceTime,\n takeUntil,\n combineLatestWith,\n zip,\n} from 'rxjs';\nimport { MatSelectSearchModule } from '@onemrvapublic/design-system/mat-select-search';\nimport { PhoneNumberDirective } from './phone-number.directive';\nimport parsePhoneNumber from 'libphonenumber-js';\nimport { FlagIconComponent } from '@onemrvapublic/design-system/flag-icon';\nimport {\n OnemRvaCDNCountryService,\n OnemrvaMaterialCountry,\n} from '@onemrvapublic/design-system/shared';\n\n@Component({\n selector: 'onemrva-mat-input-phone',\n styleUrls: ['onemrva-mat-input-phone.component.scss'],\n templateUrl: 'onemrva-mat-input-phone.component.html',\n standalone: true,\n imports: [\n CommonModule,\n MatInputModule,\n MatFormFieldModule,\n MatSelectModule,\n MatSelectSearchModule,\n ReactiveFormsModule,\n TranslateModule,\n PhoneNumberDirective,\n FlagIconComponent,\n ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class OnemrvaMatInputPhoneComponent implements OnInit, OnDestroy {\n @Input()\n readonly = false;\n\n @Input() phoneNumber!: FormControl;\n @Input() label = 'Phone number';\n @Input() noEntriesFoundLabel = 'Not found';\n @Input() placeholderLabel = 'Search';\n @Input() defaultPrefix = '+32';\n @Input() searchAriaLabel = '';\n @Input() hint = '';\n @Output() getCountry = new EventEmitter<any>();\n @ViewChild('numberInput') numberInput!: ElementRef;\n\n countryCode: FormControl = new FormControl('');\n\n public filterCtrl: FormControl<string \| null> = new FormControl<string>('');\n\n destroyNotifier$ = new Subject<void>();\n\n public countries$: Observable<OnemrvaMaterialCountry[]> =\n this.cdn.getCountries();\n public filteredCountries$: Observable<OnemrvaMaterialCountry[]>;\n\n constructor(private cdn: OnemRvaCDNCountryService) {\n this.filteredCountries$ = this.filterCtrl.valueChanges.pipe(\n debounceTime(400),\n startWith<string \| null>(''), // Explicitly define type\n combineLatestWith(this.countries$), // Ensure correct tuple structure\n map(([search, countries]: [string \| null, OnemrvaMaterialCountry[]]) => {\n // Define expected tuple\n return countries.filter((country: OnemrvaMaterialCountry) => {\n if (!search \|\| search.trim() === '') return true; // Return all when search is empty\n return country.name?.toLowerCase().includes(search.toLowerCase());\n });\n }),\n );\n }\n\n get number(): FormControl {\n return this.phoneNumber as FormControl;\n }\n\n ngOnInit(): void {\n this.number.valueChanges\n .pipe(\n startWith(this.number.getRawValue()),\n takeUntil(this.destroyNotifier$),\n )\n .subscribe(number => {\n if (number !== '') {\n if (number.substring(0, 1) !== '+')\n this.countryCode.setValue('', { emitEvent: false });\n if (number === '0') {\n this.cdn\n .findCountryFromPrefix(this.defaultPrefix)\n .pipe(takeUntil(this.destroyNotifier$))\n .subscribe(country => {\n if (country) {\n //this.getCountry.next(country);\n this.number.setValue(this.defaultPrefix, {\n emitEvent: false,\n });\n this.countryCode.setValue(country.code, { emitEvent: false });\n } else {\n this.countryCode.setValue('');\n }\n this.formatPhoneNumber();\n });\n } else {\n this.cdn\n .findCountryFromPrefix(number)\n .pipe(takeUntil(this.destroyNotifier$))\n .subscribe(country => {\n if (country) {\n //this.getCountry.next(country);\n this.countryCode.setValue(country.code);\n } else {\n this.countryCode.setValue('');\n }\n this.formatPhoneNumber();\n });\n }\n }\n });\n\n this.countryCode.valueChanges\n .pipe(takeUntil(this.destroyNotifier$))\n .subscribe(value => {\n let number = this.number.getRawValue();\n zip(\n this.cdn.findCountryFromPrefix(number),\n this.cdn.findCountryFromCode(value),\n ).subscribe(([countryFromVies, countryFromCode]) => {\n // Perform your action here using countryFromVies and countryFromCode\n if (countryFromVies) {\n number = number.replace(countryFromVies.dial_code, '');\n }\n if (countryFromCode) {\n this.getCountry.next(countryFromCode);\n if (number.substring(0, 1) === '+') {\n number = number.replace('+', '');\n }\n number = countryFromCode.dial_code + number;\n this.number.setValue(number, { emitEvent: false });\n this.formatPhoneNumber();\n }\n setTimeout(() => {\n this.numberInput.nativeElement.focus();\n }, 200);\n });\n });\n }\n\n handleClick(e: any) {\n e.stopPropagation();\n }\n\n private clearValidators() {\n let required = false;\n if (this.number.hasValidator(Validators.required)) {\n required = true;\n }\n this.number.clearValidators();\n if (required) {\n this.number.addValidators(Validators.required);\n }\n }\n\n private formatPhoneNumber() {\n this.clearValidators();\n if (this.countryCode.getRawValue() !== '') {\n this.number.addValidators([\n this.phoneNumberValidator(this.countryCode.getRawValue()),\n ]);\n }\n try {\n const parsedPhone = parsePhoneNumber(this.number.getRawValue());\n const code = parsedPhone?.country;\n if (code) {\n this.countryCode.setValue(code, { emitEvent: false });\n this.clearValidators();\n this.number.addValidators([this.phoneNumberValidator(code)]);\n this.number.setValue(parsedPhone?.format('INTERNATIONAL'), {\n emitEvent: false,\n });\n } else {\n this.number.addValidators([genericValidator('input.phone.invalid')]);\n }\n } catch (e: any) {\n this.number.addValidators([genericValidator(e.message)]);\n }\n }\n\n ngOnDestroy() {\n this.destroyNotifier$.next();\n this.destroyNotifier$.complete();\n }\n\n errors() {\n for (const k in this.number.errors) {\n if (k === 'required') {\n return 'input.phone.required';\n } else {\n return 'input.phone.invalid';\n }\n }\n return 'input.phone.unknown.error';\n }\n\n phoneNumberValidator(code: string): ValidatorFn {\n return (_control: AbstractControl): ValidationErrors \| null => {\n let number: string = this.countryCode + _control.getRawValue();\n\n if (number === '') {\n return null;\n }\n\n try {\n number = number.replace(code, '');\n const parsedNumber = parsePhoneNumber(number);\n\n if (parsedNumber?.isValid()) {\n return null;\n }\n } catch (e: any) {\n console.warn(e.message);\n return { phoneNumber: { value: 'input.phone.invalid' } };\n }\n return { phoneNumber: { value: 'input.phone.invalid' } };\n };\n }\n}\n\nfunction genericValidator(message: string): ValidatorFn {\n return (_control: AbstractControl): ValidationErrors \| null => {\n return { phoneNumber: { value: message } };\n };\n}\n","<ng-container>\n <mat-form-field class=\"onemrva-input-phone-number\">\n <mat-label>{{ label }}</mat-label>\n\n <input\n (click)=\"handleClick($event)\"\n type=\"tel\"\n matInput\n phoneNumber\n #numberInput\n placeholder=\"+32 475 12 34 56\"\n [formControl]=\"phoneNumber\"\n class=\"onemrva-text-number\"\n [readOnly]=\"readonly\"\n />\n <mat-select\n matTextPrefix\n class=\"onemrva-phone-number-select\"\n [formControl]=\"countryCode\"\n >\n <mat-select-trigger>\n <flag-icon [countryCode]=\"countryCode.getRawValue()\" />\n </mat-select-trigger>\n <mat-option>\n <mat-select-search\n [formControl]=\"filterCtrl\"\n [ariaLabel]=\"searchAriaLabel\"\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\n [placeholderLabel]=\"placeholderLabel\"\n ></mat-select-search>\n </mat-option>\n <mat-option\n ngFor=\"let country of filteredCountries$ \| async\"\n [value]=\"country.code\"\n >\n <flag-icon [countryCode]=\"country.code\" />\n    \n {{ country.name }}\n    \n <span class=\"dialcode\">\n {{ country.dial_code }}\n </span>\n </mat-option>\n </mat-select>\n <mat-hint ngIf=\"hint !== ''\">{{ hint }}</mat-hint>\n <mat-error ngIf=\"number.invalid\">{{ errors() \| translate }}</mat-error>\n </mat-form-field>\n</ng-container>\n","/\n * Public API Surface of mat-bank-account-input\n /\n\nexport from './src/onemrva-mat-input-phone.component';\nexport * from './src/phone-number.directive';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"onemrvapublic-design-system-mat-input-phone.mjs","sources":["../../../../projects/onemrva/design-system/mat-input-phone/src/phone-number.directive.ts","../../../../projects/onemrva/design-system/mat-input-phone/src/onemrva-mat-input-phone.component.ts","../../../../projects/onemrva/design-system/mat-input-phone/src/onemrva-mat-input-phone.component.html","../../../../projects/onemrva/design-system/mat-input-phone/index.ts","../../../../projects/onemrva/design-system/mat-input-phone/onemrvapublic-design-system-mat-input-phone.ts"],"sourcesContent":["import { Directive, HostListener } from '@angular/core';\n\n@Directive({\n selector: '[phoneNumber]',\n standalone: true,\n})\nexport class PhoneNumberDirective {\n @HostListener('keydown', ['$event']) onKeyDown(event: any) {\n const e = event as KeyboardEvent;\n\n const allowedKey = [\n '0',\n '1',\n '2',\n '3',\n '4',\n '5',\n '6',\n '7',\n '8',\n '9',\n ' ',\n 'Backspace',\n 'Delete',\n 'Tab',\n '+',\n '-',\n 'Enter',\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowDown',\n 'Home',\n 'End',\n ];\n\n if (allowedKey.indexOf(e.key) >= 0) return;\n\n const allowedCtrlShortcuts = ['a', 'c', 'x', 'v'];\n if (e.ctrlKey && allowedCtrlShortcuts.indexOf(e.key) >= 0) return;\n\n e.preventDefault();\n }\n}\n","import { CommonModule } from '@angular/common';\nimport {\n Component,\n ElementRef,\n EventEmitter,\n Input,\n OnDestroy,\n OnInit,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport {\n AbstractControl,\n FormControl,\n ReactiveFormsModule,\n ValidationErrors,\n ValidatorFn,\n Validators,\n} from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatSelectModule } from '@angular/material/select';\nimport { TranslateModule } from '@ngx-translate/core';\nimport {\n Observable,\n Subject,\n map,\n startWith,\n debounceTime,\n takeUntil,\n combineLatestWith,\n zip,\n} from 'rxjs';\nimport { MatSelectSearchModule } from '@onemrvapublic/design-system/mat-select-search';\nimport { PhoneNumberDirective } from './phone-number.directive';\nimport parsePhoneNumber from 'libphonenumber-js';\nimport { FlagIconComponent } from '@onemrvapublic/design-system/flag-icon';\nimport {\n OnemRvaCDNCountryService,\n OnemrvaMaterialCountry,\n} from '@onemrvapublic/design-system/shared';\n\n@Component({\n selector: 'onemrva-mat-input-phone',\n styleUrls: ['onemrva-mat-input-phone.component.scss'],\n templateUrl: 'onemrva-mat-input-phone.component.html',\n standalone: true,\n imports: [\n CommonModule,\n MatInputModule,\n MatFormFieldModule,\n MatSelectModule,\n MatSelectSearchModule,\n ReactiveFormsModule,\n TranslateModule,\n PhoneNumberDirective,\n FlagIconComponent,\n ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class OnemrvaMatInputPhoneComponent implements OnInit, OnDestroy {\n @Input()\n readonly = false;\n\n @Input() phoneNumber!: FormControl;\n @Input() label = 'Phone number';\n @Input() noEntriesFoundLabel = 'Not found';\n @Input() placeholder = '+32 475 12 34 56';\n @Input() placeholderLabel = 'Search';\n @Input() defaultPrefix = '+32';\n @Input() searchAriaLabel = '';\n @Input() hint = '';\n @Output() getCountry = new EventEmitter<any>();\n @ViewChild('numberInput') numberInput!: ElementRef;\n\n countryCode: FormControl = new FormControl('');\n\n public filterCtrl: FormControl<string \| null> = new FormControl<string>('');\n\n destroyNotifier$ = new Subject<void>();\n\n public countries$: Observable<OnemrvaMaterialCountry[]> =\n this.cdn.getCountries();\n public filteredCountries$: Observable<OnemrvaMaterialCountry[]>;\n\n constructor(private cdn: OnemRvaCDNCountryService) {\n this.filteredCountries$ = this.filterCtrl.valueChanges.pipe(\n debounceTime(400),\n startWith<string \| null>(''), // Explicitly define type\n combineLatestWith(this.countries$), // Ensure correct tuple structure\n map(([search, countries]: [string \| null, OnemrvaMaterialCountry[]]) => {\n // Define expected tuple\n return countries.filter((country: OnemrvaMaterialCountry) => {\n if (!search \|\| search.trim() === '') return true; // Return all when search is empty\n return country.name?.toLowerCase().includes(search.toLowerCase());\n });\n }),\n );\n }\n\n get number(): FormControl {\n return this.phoneNumber as FormControl;\n }\n\n ngOnInit(): void {\n this.number.valueChanges\n .pipe(\n startWith(this.number.getRawValue()),\n takeUntil(this.destroyNotifier$),\n )\n .subscribe(number => {\n if (number !== '') {\n if (number.substring(0, 1) !== '+')\n this.countryCode.setValue('', { emitEvent: false });\n if (number === '0') {\n this.cdn\n .findCountryFromPrefix(this.defaultPrefix)\n .pipe(takeUntil(this.destroyNotifier$))\n .subscribe(country => {\n if (country) {\n //this.getCountry.next(country);\n this.number.setValue(this.defaultPrefix, {\n emitEvent: false,\n });\n this.countryCode.setValue(country.code, { emitEvent: false });\n } else {\n this.countryCode.setValue('');\n }\n this.formatPhoneNumber();\n });\n } else {\n this.cdn\n .findCountryFromPrefix(number)\n .pipe(takeUntil(this.destroyNotifier$))\n .subscribe(country => {\n if (country) {\n //this.getCountry.next(country);\n this.countryCode.setValue(country.code);\n } else {\n this.countryCode.setValue('');\n }\n this.formatPhoneNumber();\n });\n }\n }\n });\n\n this.countryCode.valueChanges\n .pipe(takeUntil(this.destroyNotifier$))\n .subscribe(value => {\n let number = this.number.getRawValue();\n zip(\n this.cdn.findCountryFromPrefix(number),\n this.cdn.findCountryFromCode(value),\n ).subscribe(([countryFromVies, countryFromCode]) => {\n // Perform your action here using countryFromVies and countryFromCode\n if (countryFromVies) {\n number = number.replace(countryFromVies.dial_code, '');\n }\n if (countryFromCode) {\n this.getCountry.next(countryFromCode);\n if (number.substring(0, 1) === '+') {\n number = number.replace('+', '');\n }\n number = countryFromCode.dial_code + number;\n this.number.setValue(number, { emitEvent: false });\n this.formatPhoneNumber();\n }\n setTimeout(() => {\n this.numberInput.nativeElement.focus();\n }, 200);\n });\n });\n }\n\n handleClick(e: any) {\n e.stopPropagation();\n }\n\n private clearValidators() {\n let required = false;\n if (this.number.hasValidator(Validators.required)) {\n required = true;\n }\n this.number.clearValidators();\n if (required) {\n this.number.addValidators(Validators.required);\n }\n }\n\n private formatPhoneNumber() {\n this.clearValidators();\n if (this.countryCode.getRawValue() !== '') {\n this.number.addValidators([\n this.phoneNumberValidator(this.countryCode.getRawValue()),\n ]);\n }\n try {\n const parsedPhone = parsePhoneNumber(this.number.getRawValue());\n const code = parsedPhone?.country;\n if (code) {\n this.countryCode.setValue(code, { emitEvent: false });\n this.clearValidators();\n this.number.addValidators([this.phoneNumberValidator(code)]);\n this.number.setValue(parsedPhone?.format('INTERNATIONAL'), {\n emitEvent: false,\n });\n } else {\n this.number.addValidators([genericValidator('input.phone.invalid')]);\n }\n } catch (e: any) {\n this.number.addValidators([genericValidator(e.message)]);\n }\n }\n\n ngOnDestroy() {\n this.destroyNotifier$.next();\n this.destroyNotifier$.complete();\n }\n\n errors() {\n for (const k in this.number.errors) {\n if (k === 'required') {\n return 'input.phone.required';\n } else {\n return 'input.phone.invalid';\n }\n }\n return 'input.phone.unknown.error';\n }\n\n phoneNumberValidator(code: string): ValidatorFn {\n return (_control: AbstractControl): ValidationErrors \| null => {\n let number: string = code + _control.getRawValue();\n\n if (number === '') {\n return null;\n }\n\n try {\n number = number.replace(code, '');\n const parsedNumber = parsePhoneNumber(number);\n\n if (parsedNumber?.isValid()) {\n return null;\n }\n } catch (e: any) {\n console.warn(e.message);\n return { phoneNumber: { value: 'input.phone.invalid' } };\n }\n return { phoneNumber: { value: 'input.phone.invalid' } };\n };\n }\n}\n\nfunction genericValidator(message: string): ValidatorFn {\n return (_control: AbstractControl): ValidationErrors \| null => {\n return { phoneNumber: { value: message } };\n };\n}\n","<ng-container>\n <mat-form-field class=\"onemrva-input-phone-number\">\n <mat-label>{{ label }}</mat-label>\n\n <input\n (click)=\"handleClick($event)\"\n type=\"tel\"\n matInput\n phoneNumber\n #numberInput\n [placeholder]=\"placeholder\"\n [formControl]=\"phoneNumber\"\n class=\"onemrva-text-number\"\n [readOnly]=\"readonly\"\n />\n <mat-select\n matTextPrefix\n class=\"onemrva-phone-number-select\"\n [formControl]=\"countryCode\"\n >\n <mat-select-trigger>\n <flag-icon [countryCode]=\"countryCode.getRawValue()\" />\n </mat-select-trigger>\n <mat-option>\n <mat-select-search\n [formControl]=\"filterCtrl\"\n [ariaLabel]=\"searchAriaLabel\"\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\n [placeholderLabel]=\"placeholderLabel\"\n ></mat-select-search>\n </mat-option>\n <mat-option\n ngFor=\"let country of filteredCountries$ \| async\"\n [value]=\"country.code\"\n >\n <flag-icon [countryCode]=\"country.code\" />\n    \n {{ country.name }}\n    \n <span class=\"dialcode\">\n {{ country.dial_code }}\n </span>\n </mat-option>\n </mat-select>\n <mat-hint ngIf=\"hint !== ''\">{{ hint }}</mat-hint>\n <mat-error ngIf=\"number.invalid\">{{ errors() \| translate }}</mat-error>\n </mat-form-field>\n</ng-container>\n","/\n * Public API Surface of mat-bank-account-input\n /\n\nexport from './src/onemrva-mat-input-phone.component';\nexport * from './src/phone-number.directive';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/onemrvapublic-design-system-mat-select-search.mjs CHANGED Viewed

@@ -274,7 +274,6 @@ class MatSelectSearchComponent {
                 });
             }));
         }))
-            .pipe(takeUntil(this._onDestroy))
             .subscribe();
         // add or remove css class depending on whether to show the no entries found message
         // note: this is hacky
@@ -499,7 +498,7 @@ class MatSelectSearchComponent {
                 useExisting: forwardRef(() => MatSelectSearchComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "clearIcon", first: true, predicate: MatSelectSearchClearDirective, descendants: true }, { propertyName: "noEntriesFound", first: true, predicate: MatSelectNoEntriesFoundDirective, descendants: true }], viewQueries: [{ propertyName: "searchSelectInput", first: true, predicate: ["searchSelectInput"], descendants: true, read: ElementRef, static: true }, { propertyName: "innerSelectSearch", first: true, predicate: ["innerSelectSearch"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<!--\nCopyright (c) 2018 Bithost GmbH All Rights Reserved.\n\nUse of this source code is governed by an MIT-style license that can be\nfound in the LICENSE file at https://angular.io/license\n-->\n<!-- Placeholder to adjust vertical offset of the mat-option elements -->\n<input matInput class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: the  mat-datepicker-content mat-tab-header are needed to inherit the material theme colors, see PR #22 -->\n<div\n  #innerSelectSearch\n  class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\"\n  [ngClass]=\"{\n    'mat-select-search-inner-multiple': matSelect.multiple,\n    'mat-select-search-inner-toggle-all': _isToggleAllCheckboxVisible(),\n  }\"\n>\n  <mat-checkbox\n    *ngIf=\"_isToggleAllCheckboxVisible()\"\n    [color]=\"matFormField.color\"\n    class=\"mat-select-search-toggle-all-checkbox\"\n    [checked]=\"toggleAllCheckboxChecked\"\n    [indeterminate]=\"toggleAllCheckboxIndeterminate\"\n    [matTooltip]=\"toggleAllCheckboxTooltipMessage\"\n    matTooltipClass=\"ngx-mat-select-search-toggle-all-tooltip\"\n    [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\n    (change)=\"_emitSelectAllBooleanToParent($event.checked)\"\n  ></mat-checkbox>\n\n  <input\n    class=\"mat-select-search-input\"\n    autocomplete=\"off\"\n    [type]=\"type\"\n    [formControl]=\"_formControl\"\n    #searchSelectInput\n    (keydown)=\"_handleKeydown($event)\"\n    (keyup)=\"_handleKeyup($event)\"\n    (blur)=\"onBlur()\"\n    [placeholder]=\"placeholderLabel\"\n    [attr.aria-label]=\"ariaLabel\"\n  />\n  <mat-icon *ngIf=\"value === '' && !searching\" class=\"suffix\">search</mat-icon>\n  <mat-spinner\n    *ngIf=\"searching\"\n    class=\"mat-select-search-spinner\"\n    diameter=\"16\"\n  ></mat-spinner>\n\n  <button\n    *ngIf=\"!hideClearSearchButton && value && !searching\"\n    mat-icon-button\n    aria-label=\"Clear\"\n    (click)=\"_reset(true)\"\n    class=\"mat-select-search-clear\"\n  >\n    <ng-content\n      *ngIf=\"clearIcon; else defaultIcon\"\n      select=\"[matSelectSearchClear]\"\n    ></ng-content>\n    <ng-template #defaultIcon>\n      <mat-icon [svgIcon]=\"closeSvgIcon\">\n        {{ !closeSvgIcon ? closeIcon : null }}\n      </mat-icon>\n    </ng-template>\n  </button>\n\n  <ng-content select=\".mat-select-search-custom-header-content\"></ng-content>\n\n  <mat-divider></mat-divider>\n</div>\n\n<div\n  *ngIf=\"_showNoEntriesFound$ | async\"\n  class=\"mat-select-search-no-entries-found\"\n>\n  <ng-content\n    *ngIf=\"noEntriesFound; else defaultNoEntriesFound\"\n    select=\"[matSelectNoEntriesFound]\"\n  ></ng-content>\n  <ng-template #defaultNoEntriesFound>{{ noEntriesFoundLabel }}</ng-template>\n</div>\n", styles: [".mat-select-search-hidden{visibility:hidden}.mat-select-search-inner{position:absolute;top:0;left:0;width:100%;z-index:100;font-size:inherit;box-shadow:none}.mat-select-search-inner.mat-select-search-inner-multiple.mat-select-search-inner-toggle-all{display:flex;align-items:center}.suffix{position:absolute;top:12px;right:14px}.mat-select-search-input{box-sizing:border-box;width:100%;border:none;font-family:inherit;font-size:inherit;color:currentColor;outline:none;background:#fff;padding:0 44px 0 16px;height:calc(3em - 1px);line-height:calc(3em - 1px)}:host-context([dir=rtl]) .mat-select-search-input{padding-right:16px;padding-left:44px}.mat-select-search-inner-toggle-all .mat-select-search-input{padding-left:5px}.mat-select-search-no-entries-found{padding-top:8px}.mat-select-search-clear{position:absolute;right:4px;top:0}:host-context([dir=rtl]) .mat-select-search-clear{right:auto;left:4px}.mat-select-search-spinner{position:absolute;right:16px;top:calc(50% - 8px)}:host-context([dir=rtl]) .mat-select-search-spinner{right:auto;left:16px}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search{position:sticky;top:0;z-index:1;opacity:1;margin-top:-8px;pointer-events:all}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-icon{margin-right:0;margin-left:0}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search mat-pseudo-checkbox{display:none}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mdc-list-item__primary-text{opacity:1}.mat-select-search-toggle-all-checkbox{padding-left:5px}:host-context([dir=rtl]) .mat-select-search-toggle-all-checkbox{padding-left:0;padding-right:5px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "clearIcon", first: true, predicate: MatSelectSearchClearDirective, descendants: true }, { propertyName: "noEntriesFound", first: true, predicate: MatSelectNoEntriesFoundDirective, descendants: true }], viewQueries: [{ propertyName: "searchSelectInput", first: true, predicate: ["searchSelectInput"], descendants: true, read: ElementRef, static: true }, { propertyName: "innerSelectSearch", first: true, predicate: ["innerSelectSearch"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<!--\nCopyright (c) 2018 Bithost GmbH All Rights Reserved.\n\nUse of this source code is governed by an MIT-style license that can be\nfound in the LICENSE file at https://angular.io/license\n-->\n<!-- Placeholder to adjust vertical offset of the mat-option elements -->\n<input matInput class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: the  mat-datepicker-content mat-tab-header are needed to inherit the material theme colors, see PR #22 -->\n<div\n  #innerSelectSearch\n  class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\"\n  [ngClass]=\"{\n    'mat-select-search-inner-multiple': matSelect.multiple,\n    'mat-select-search-inner-toggle-all': _isToggleAllCheckboxVisible(),\n  }\"\n>\n  <mat-checkbox\n    *ngIf=\"_isToggleAllCheckboxVisible()\"\n    [color]=\"matFormField.color\"\n    class=\"mat-select-search-toggle-all-checkbox\"\n    [checked]=\"toggleAllCheckboxChecked\"\n    [indeterminate]=\"toggleAllCheckboxIndeterminate\"\n    [matTooltip]=\"toggleAllCheckboxTooltipMessage\"\n    matTooltipClass=\"ngx-mat-select-search-toggle-all-tooltip\"\n    [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\n    (change)=\"_emitSelectAllBooleanToParent($event.checked)\"\n  ></mat-checkbox>\n\n  <input\n    class=\"mat-select-search-input\"\n    autocomplete=\"off\"\n    [type]=\"type\"\n    [formControl]=\"_formControl\"\n    #searchSelectInput\n    (keydown)=\"_handleKeydown($event)\"\n    (keyup)=\"_handleKeyup($event)\"\n    (blur)=\"onBlur()\"\n    [placeholder]=\"placeholderLabel\"\n    [attr.aria-label]=\"ariaLabel\"\n  />\n  <mat-icon *ngIf=\"value === '' && !searching\" class=\"suffix\">search</mat-icon>\n  <mat-spinner\n    *ngIf=\"searching\"\n    class=\"mat-select-search-spinner\"\n    diameter=\"16\"\n  ></mat-spinner>\n\n  <button\n    *ngIf=\"!hideClearSearchButton && value && !searching\"\n    mat-icon-button\n    aria-label=\"Clear\"\n    (click)=\"_reset(true)\"\n    class=\"mat-select-search-clear\"\n  >\n    <ng-content\n      *ngIf=\"clearIcon; else defaultIcon\"\n      select=\"[matSelectSearchClear]\"\n    ></ng-content>\n    <ng-template #defaultIcon>\n      <mat-icon [svgIcon]=\"closeSvgIcon\">\n        {{ !closeSvgIcon ? closeIcon : null }}\n      </mat-icon>\n    </ng-template>\n  </button>\n\n  <ng-content select=\".mat-select-search-custom-header-content\"></ng-content>\n\n  <mat-divider></mat-divider>\n</div>\n\n<div\n  *ngIf=\"_showNoEntriesFound$ | async\"\n  class=\"mat-select-search-no-entries-found\"\n>\n  <ng-content\n    *ngIf=\"noEntriesFound; else defaultNoEntriesFound\"\n    select=\"[matSelectNoEntriesFound]\"\n  ></ng-content>\n  <ng-template #defaultNoEntriesFound>{{ noEntriesFoundLabel }}</ng-template>\n</div>\n", styles: [".mat-select-search-hidden{visibility:hidden}.mat-select-search-inner{position:absolute;top:0;left:0;width:100%;z-index:100;font-size:inherit;box-shadow:none}.mat-select-search-inner.mat-select-search-inner-multiple.mat-select-search-inner-toggle-all{display:flex;align-items:center}.suffix{position:absolute;top:12px;right:14px}.mat-select-search-input{box-sizing:border-box;width:100%;border:none;font-family:inherit;font-size:inherit;color:currentColor;outline:none;background:#fff;padding:0 44px 0 16px;height:calc(3em - 1px);line-height:calc(3em - 1px)}:host-context([dir=rtl]) .mat-select-search-input{padding-right:16px;padding-left:44px}.mat-select-search-inner-toggle-all .mat-select-search-input{padding-left:5px}.mat-select-search-no-entries-found{padding-top:8px;padding-bottom:8px}.mat-select-search-clear{position:absolute;right:4px;top:0}:host-context([dir=rtl]) .mat-select-search-clear{right:auto;left:4px}.mat-select-search-spinner{position:absolute;right:16px;top:calc(50% - 8px)}:host-context([dir=rtl]) .mat-select-search-spinner{right:auto;left:16px}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search{position:sticky;top:0;z-index:1;opacity:1;margin-top:-8px;pointer-events:all}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-icon{margin-right:0;margin-left:0}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search mat-pseudo-checkbox{display:none}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mdc-list-item__primary-text{opacity:1}.mat-select-search-toggle-all-checkbox{padding-left:5px}:host-context([dir=rtl]) .mat-select-search-toggle-all-checkbox{padding-left:0;padding-right:5px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MatSelectSearchComponent, decorators: [{
             type: Component,
@@ -521,7 +520,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         MatInput,
                         MatDivider,
                         AsyncPipe,
-                    ], template: "<!--\nCopyright (c) 2018 Bithost GmbH All Rights Reserved.\n\nUse of this source code is governed by an MIT-style license that can be\nfound in the LICENSE file at https://angular.io/license\n-->\n<!-- Placeholder to adjust vertical offset of the mat-option elements -->\n<input matInput class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: the  mat-datepicker-content mat-tab-header are needed to inherit the material theme colors, see PR #22 -->\n<div\n  #innerSelectSearch\n  class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\"\n  [ngClass]=\"{\n    'mat-select-search-inner-multiple': matSelect.multiple,\n    'mat-select-search-inner-toggle-all': _isToggleAllCheckboxVisible(),\n  }\"\n>\n  <mat-checkbox\n    *ngIf=\"_isToggleAllCheckboxVisible()\"\n    [color]=\"matFormField.color\"\n    class=\"mat-select-search-toggle-all-checkbox\"\n    [checked]=\"toggleAllCheckboxChecked\"\n    [indeterminate]=\"toggleAllCheckboxIndeterminate\"\n    [matTooltip]=\"toggleAllCheckboxTooltipMessage\"\n    matTooltipClass=\"ngx-mat-select-search-toggle-all-tooltip\"\n    [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\n    (change)=\"_emitSelectAllBooleanToParent($event.checked)\"\n  ></mat-checkbox>\n\n  <input\n    class=\"mat-select-search-input\"\n    autocomplete=\"off\"\n    [type]=\"type\"\n    [formControl]=\"_formControl\"\n    #searchSelectInput\n    (keydown)=\"_handleKeydown($event)\"\n    (keyup)=\"_handleKeyup($event)\"\n    (blur)=\"onBlur()\"\n    [placeholder]=\"placeholderLabel\"\n    [attr.aria-label]=\"ariaLabel\"\n  />\n  <mat-icon *ngIf=\"value === '' && !searching\" class=\"suffix\">search</mat-icon>\n  <mat-spinner\n    *ngIf=\"searching\"\n    class=\"mat-select-search-spinner\"\n    diameter=\"16\"\n  ></mat-spinner>\n\n  <button\n    *ngIf=\"!hideClearSearchButton && value && !searching\"\n    mat-icon-button\n    aria-label=\"Clear\"\n    (click)=\"_reset(true)\"\n    class=\"mat-select-search-clear\"\n  >\n    <ng-content\n      *ngIf=\"clearIcon; else defaultIcon\"\n      select=\"[matSelectSearchClear]\"\n    ></ng-content>\n    <ng-template #defaultIcon>\n      <mat-icon [svgIcon]=\"closeSvgIcon\">\n        {{ !closeSvgIcon ? closeIcon : null }}\n      </mat-icon>\n    </ng-template>\n  </button>\n\n  <ng-content select=\".mat-select-search-custom-header-content\"></ng-content>\n\n  <mat-divider></mat-divider>\n</div>\n\n<div\n  *ngIf=\"_showNoEntriesFound$ | async\"\n  class=\"mat-select-search-no-entries-found\"\n>\n  <ng-content\n    *ngIf=\"noEntriesFound; else defaultNoEntriesFound\"\n    select=\"[matSelectNoEntriesFound]\"\n  ></ng-content>\n  <ng-template #defaultNoEntriesFound>{{ noEntriesFoundLabel }}</ng-template>\n</div>\n", styles: [".mat-select-search-hidden{visibility:hidden}.mat-select-search-inner{position:absolute;top:0;left:0;width:100%;z-index:100;font-size:inherit;box-shadow:none}.mat-select-search-inner.mat-select-search-inner-multiple.mat-select-search-inner-toggle-all{display:flex;align-items:center}.suffix{position:absolute;top:12px;right:14px}.mat-select-search-input{box-sizing:border-box;width:100%;border:none;font-family:inherit;font-size:inherit;color:currentColor;outline:none;background:#fff;padding:0 44px 0 16px;height:calc(3em - 1px);line-height:calc(3em - 1px)}:host-context([dir=rtl]) .mat-select-search-input{padding-right:16px;padding-left:44px}.mat-select-search-inner-toggle-all .mat-select-search-input{padding-left:5px}.mat-select-search-no-entries-found{padding-top:8px}.mat-select-search-clear{position:absolute;right:4px;top:0}:host-context([dir=rtl]) .mat-select-search-clear{right:auto;left:4px}.mat-select-search-spinner{position:absolute;right:16px;top:calc(50% - 8px)}:host-context([dir=rtl]) .mat-select-search-spinner{right:auto;left:16px}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search{position:sticky;top:0;z-index:1;opacity:1;margin-top:-8px;pointer-events:all}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-icon{margin-right:0;margin-left:0}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search mat-pseudo-checkbox{display:none}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mdc-list-item__primary-text{opacity:1}.mat-select-search-toggle-all-checkbox{padding-left:5px}:host-context([dir=rtl]) .mat-select-search-toggle-all-checkbox{padding-left:0;padding-right:5px}\n"] }]
+                    ], template: "<!--\nCopyright (c) 2018 Bithost GmbH All Rights Reserved.\n\nUse of this source code is governed by an MIT-style license that can be\nfound in the LICENSE file at https://angular.io/license\n-->\n<!-- Placeholder to adjust vertical offset of the mat-option elements -->\n<input matInput class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: the  mat-datepicker-content mat-tab-header are needed to inherit the material theme colors, see PR #22 -->\n<div\n  #innerSelectSearch\n  class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\"\n  [ngClass]=\"{\n    'mat-select-search-inner-multiple': matSelect.multiple,\n    'mat-select-search-inner-toggle-all': _isToggleAllCheckboxVisible(),\n  }\"\n>\n  <mat-checkbox\n    *ngIf=\"_isToggleAllCheckboxVisible()\"\n    [color]=\"matFormField.color\"\n    class=\"mat-select-search-toggle-all-checkbox\"\n    [checked]=\"toggleAllCheckboxChecked\"\n    [indeterminate]=\"toggleAllCheckboxIndeterminate\"\n    [matTooltip]=\"toggleAllCheckboxTooltipMessage\"\n    matTooltipClass=\"ngx-mat-select-search-toggle-all-tooltip\"\n    [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\n    (change)=\"_emitSelectAllBooleanToParent($event.checked)\"\n  ></mat-checkbox>\n\n  <input\n    class=\"mat-select-search-input\"\n    autocomplete=\"off\"\n    [type]=\"type\"\n    [formControl]=\"_formControl\"\n    #searchSelectInput\n    (keydown)=\"_handleKeydown($event)\"\n    (keyup)=\"_handleKeyup($event)\"\n    (blur)=\"onBlur()\"\n    [placeholder]=\"placeholderLabel\"\n    [attr.aria-label]=\"ariaLabel\"\n  />\n  <mat-icon *ngIf=\"value === '' && !searching\" class=\"suffix\">search</mat-icon>\n  <mat-spinner\n    *ngIf=\"searching\"\n    class=\"mat-select-search-spinner\"\n    diameter=\"16\"\n  ></mat-spinner>\n\n  <button\n    *ngIf=\"!hideClearSearchButton && value && !searching\"\n    mat-icon-button\n    aria-label=\"Clear\"\n    (click)=\"_reset(true)\"\n    class=\"mat-select-search-clear\"\n  >\n    <ng-content\n      *ngIf=\"clearIcon; else defaultIcon\"\n      select=\"[matSelectSearchClear]\"\n    ></ng-content>\n    <ng-template #defaultIcon>\n      <mat-icon [svgIcon]=\"closeSvgIcon\">\n        {{ !closeSvgIcon ? closeIcon : null }}\n      </mat-icon>\n    </ng-template>\n  </button>\n\n  <ng-content select=\".mat-select-search-custom-header-content\"></ng-content>\n\n  <mat-divider></mat-divider>\n</div>\n\n<div\n  *ngIf=\"_showNoEntriesFound$ | async\"\n  class=\"mat-select-search-no-entries-found\"\n>\n  <ng-content\n    *ngIf=\"noEntriesFound; else defaultNoEntriesFound\"\n    select=\"[matSelectNoEntriesFound]\"\n  ></ng-content>\n  <ng-template #defaultNoEntriesFound>{{ noEntriesFoundLabel }}</ng-template>\n</div>\n", styles: [".mat-select-search-hidden{visibility:hidden}.mat-select-search-inner{position:absolute;top:0;left:0;width:100%;z-index:100;font-size:inherit;box-shadow:none}.mat-select-search-inner.mat-select-search-inner-multiple.mat-select-search-inner-toggle-all{display:flex;align-items:center}.suffix{position:absolute;top:12px;right:14px}.mat-select-search-input{box-sizing:border-box;width:100%;border:none;font-family:inherit;font-size:inherit;color:currentColor;outline:none;background:#fff;padding:0 44px 0 16px;height:calc(3em - 1px);line-height:calc(3em - 1px)}:host-context([dir=rtl]) .mat-select-search-input{padding-right:16px;padding-left:44px}.mat-select-search-inner-toggle-all .mat-select-search-input{padding-left:5px}.mat-select-search-no-entries-found{padding-top:8px;padding-bottom:8px}.mat-select-search-clear{position:absolute;right:4px;top:0}:host-context([dir=rtl]) .mat-select-search-clear{right:auto;left:4px}.mat-select-search-spinner{position:absolute;right:16px;top:calc(50% - 8px)}:host-context([dir=rtl]) .mat-select-search-spinner{right:auto;left:16px}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search{position:sticky;top:0;z-index:1;opacity:1;margin-top:-8px;pointer-events:all}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mat-icon{margin-right:0;margin-left:0}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search mat-pseudo-checkbox{display:none}::ng-deep .mat-mdc-option[aria-disabled=true].contains-mat-select-search .mdc-list-item__primary-text{opacity:1}.mat-select-search-toggle-all-checkbox{padding-left:5px}:host-context([dir=rtl]) .mat-select-search-toggle-all-checkbox{padding-left:0;padding-right:5px}\n"] }]
         }], ctorParameters: () => [{ type: i3.MatSelect, decorators: [{
                     type: Inject,
                     args: [MatSelect]