ion-intl-tel-v2
Version:
This is a continuation of the original project from azzamasghar1 (https://github.com/azzamasghar1/ion-intl-tel-input) which includes new features and some much requested features
732 lines • 95.1 kB
JavaScript
import { Component, Input, forwardRef, Output, EventEmitter, ViewChild, ElementRef, HostBinding, } from '@angular/core';
import { NG_VALUE_ACCESSOR, } from '@angular/forms';
import { IonInput, Platform } from '@ionic/angular';
import { PhoneNumberFormat, PhoneNumberUtil, } from 'google-libphonenumber';
import { IonIntlTelInputService } from '../ion-intl-tel-input.service';
// import { ionIntlTelInputValidator } from '../ion-intl-tel-input.directive';
import { raf } from '../util/util';
import { translationPrefix } from '../data';
import { TranslateService } from '@ngx-translate/core';
import * as i0 from "@angular/core";
import * as i1 from "@ionic/angular";
import * as i2 from "../ion-intl-tel-input.service";
import * as i3 from "@ngx-translate/core";
import * as i4 from "ionic-selectable";
import * as i5 from "@angular/forms";
import * as i6 from "@angular/common";
import * as i7 from "../pipes/country-placeholder";
/**
* @ignore
*/
/**
* @author Azzam Asghar <azzam.asghar@interstellus.com>
*/
export class IonIntlTelInputComponent {
constructor(el, platform, ionIntlTelInputService, translate) {
this.el = el;
this.platform = platform;
this.ionIntlTelInputService = ionIntlTelInputService;
this.translate = translate;
this.cssClass = true;
/**
* Iso Code of default selected Country.
* See more on.
*
* @default ''
* @memberof IonIntlTelInputComponent
*/
this.defaultCountryiso = '';
/**
* Determines whether to use `00` or `+` as dial code prefix.
* Available attributes are '+' | '00'.
* See more on.
*
* @default +
* @memberof IonIntlTelInputComponent
*/
this.dialCodePrefix = '+';
/**
* Determines whether to select automatic country based on user input.
* See more on.
*
* @default false
* @memberof IonIntlTelInputComponent
*/
this.enableAutoCountrySelect = false;
/**
* Determines whether an example number will be shown as a placeholder in input.
* See more on.
*
* @default true
* @memberof IonIntlTelInputComponent
*/
this.enablePlaceholder = true;
/**
* A fallaback placeholder to be used if no example number is found for a country.
* See more on.
*
* @default ''
* @memberof IonIntlTelInputComponent
*/
this.fallbackPlaceholder = '';
/**
* If a custom placeholder is needed for input.
* If this property is set it will override `enablePlaceholder` and only this placeholder will be shown.
* See more on.
*
* @default ''
* @memberof IonIntlTelInputComponent
*/
this.inputPlaceholder = '';
/**
* Maximum Length for input.
* See more on.
*
* @default '15'
* @memberof IonIntlTelInputComponent
*/
this.maxLength = '15';
/**
* Title of modal opened to select country dial code.
* See more on.
*
* @default 'Select Country'
* @memberof IonIntlTelInputComponent
*/
this.modalTitle = 'Select Country';
/**
* Placeholder for the select dropdown
* See more on.
*
* @default 'Country'
* @memberof IonIntlTelInputComponent
*/
this.dropdownPlaceholder = 'Country';
/**
* CSS class to attach to dial code selectionmodal.
* See more on.
*
* @default ''
* @memberof IonIntlTelInputComponent
*/
this.modalCssClass = '';
/**
* Placeholder for input in dial code selection modal.
* See more on.
*
* @default 'Enter country name'
* @memberof IonIntlTelInputComponent
*/
this.modalSearchPlaceholder = 'Enter country name';
/**
* Text for close button in dial code selection modal.
* See more on.
*
* @default 'Close'
* @memberof IonIntlTelInputComponent
*/
this.modalCloseText = 'Close';
/**
* Slot for close button in dial code selection modal. [Ionic slots](https://ionicframework.com/docs/api/item) are supported
* See more on.
*
* @default 'end'
* @memberof IonIntlTelInputComponent
*/
this.modalCloseButtonSlot = 'end';
/**
* Determines whether dial code selection modal should be searchable or not.
* See more on.
*
* @default 'true'
* @memberof IonIntlTelInputComponent
*/
this.modalCanSearch = true;
/**
* Determines whether dial code selection modal is closed on backdrop click.
* See more on.
*
* @default 'true'
* @memberof IonIntlTelInputComponent
*/
this.modalShouldBackdropClose = true;
/**
* Determines whether input should be focused when dial code selection modal is opened.
* See more on.
*
* @default 'true'
* @memberof IonIntlTelInputComponent
*/
this.modalShouldFocusSearchbar = true;
/**
* Message to show when no countries are found for search in dial code selection modal.
* See more on.
*
* @default 'true'
* @memberof IonIntlTelInputComponent
*/
this.modalSearchFailText = 'No countries found';
/**
* Item icon slot.
* See more on.
*
* @default 'start'
* @memberof IonIntlTelInputComponent
*/
this.modalItemIconSlot = 'start';
/**
* List of iso codes of manually selected countries as string, which will appear in the dropdown.
* **Note**: `onlyCountries` should be a string array of country iso codes.
* See more on.
*
* @default null
* @memberof IonIntlTelInputComponent
*/
this.onlyCountries = [];
/**
* List of iso codes as string of countries, which will appear at the top in dial code selection modal.
* **Note**: `preferredCountries` should be a string array of country iso codes.
* See more on.
*
* @default null
* @memberof IonIntlTelInputComponent
*/
this.preferredCountries = [];
/**
* Determines whether first country should be selected in dial code select or not.
* See more on.
*
* @default true
* @memberof IonIntlTelInputComponent
*/
this.selectFirstCountry = true;
/**
* Determines whether to visually separate dialcode into the drop down element.
* See more on.
*
* @default true
* @memberof IonIntlTelInputComponent
*/
this.separateDialCode = true;
/**
* Fires when the Phone number Input is changed.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.numberChange = new EventEmitter();
/**
* Fires when the Phone number Input is blurred.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.numberBlur = new EventEmitter();
/**
* Fires when the Phone number Input is focused.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.numberFocus = new EventEmitter();
/**
* Fires when the user is typing in Phone number Input.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.numberInput = new EventEmitter();
/**
* Fires when the dial code selection is changed.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.codeChange = new EventEmitter();
/**
* Fires when the dial code selection modal is opened.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.codeOpen = new EventEmitter();
/**
* Fires when the dial code selection modal is closed.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.codeClose = new EventEmitter();
/**
* Fires when a dial code is selected in dial code selection modal.
* See more on.
*
* @memberof IonIntlTelInputComponent
*/
this.codeSelect = new EventEmitter();
// tslint:disable-next-line: variable-name
this._value = null;
this.phoneNumber = '';
this.countries = [];
this.disabled = false;
this.phoneUtil = PhoneNumberUtil.getInstance();
this.translationPrefix = `${translationPrefix}.`;
this.onTouched = () => { };
this.propagateChange = (_) => { };
this.startsWith = (input, search) => {
return input.substr(0, search.length) === search;
};
this.getClasses = (element) => {
const classList = element.classList;
const classes = [];
for (let i = 0; i < classList.length; i++) {
const item = classList.item(i);
if (item !== null && this.startsWith(item, 'ng-')) {
classes.push(`ion-${item.substr(3)}`);
}
}
return classes;
};
this.setClasses = (element, classes) => {
const classList = element.classList;
[
'ion-valid',
'ion-invalid',
'ion-touched',
'ion-untouched',
'ion-dirty',
'ion-pristine',
].forEach((c) => classList.remove(c));
classes.forEach((c) => classList.add(c));
};
this.setIonicClasses = (element) => {
raf(() => {
const input = element.nativeElement;
const classes = this.getClasses(input);
this.setClasses(input, classes);
const item = input.closest('ion-item');
if (item) {
this.setClasses(item, classes);
}
});
};
this.setItemClass = (element, className, addClass) => {
const input = element.nativeElement;
const item = input.closest('ion-item');
if (item) {
const classList = item.classList;
if (addClass) {
classList.add(className);
}
else {
classList.remove(className);
}
}
};
}
get hasValueCssClass() {
return this.hasValue();
}
get isEnabled() {
return !this.disabled;
}
get value() {
return this._value;
}
set value(value) {
this._value = value;
this.setIonicClasses(this.el);
}
emitValueChange(change) {
this.propagateChange(change);
}
ngOnInit() {
this.isIos = this.platform.is('ios');
this.isMD = !this.isIos;
this.setItemClass(this.el, 'item-interactive', true);
this.fetchAllCountries();
this.setPreferredCountries();
if (this.onlyCountries.length) {
this.countries = this.countries.filter((country) => this.onlyCountries.includes(country.isoCode));
}
if (this.selectFirstCountry) {
if (this.defaultCountryiso) {
this.setCountry(this.getCountryByIsoCode(this.defaultCountryiso));
}
else {
if (this.preferredCountries.length &&
this.preferredCountries.includes(this.defaultCountryiso)) {
this.setCountry(this.getCountryByIsoCode(this.preferredCountries[0]));
}
else {
this.setCountry(this.countries[0]);
}
}
}
}
ngOnChanges(changes) {
if (this.countries &&
changes.defaulyCountryisoCode &&
changes.defaulyCountryisoCode.currentValue !==
changes.defaulyCountryisoCode.previousValue) {
this.setCountry(changes.defaulyCountryisoCode.currentValue);
}
}
registerOnChange(fn) {
this.propagateChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
writeValue(obj) {
this.fillValues(obj);
}
setDisabledState(isDisabled) {
this.disabled = isDisabled;
}
fillValues(value) {
if (value &&
value !== null &&
typeof value === 'object' &&
!this.isNullOrWhiteSpace(value)) {
this.phoneNumber = value.nationalNumber;
this.setCountry(this.getCountryByIsoCode(value.isoCode));
this.value = value;
}
else if (this.value &&
this.value !== null &&
typeof this.value === 'object' &&
!this.isNullOrWhiteSpace(this.value)) {
this.phoneNumber = this.value.nationalNumber;
this.setCountry(this.getCountryByIsoCode(this.value.isoCode));
}
setTimeout(() => {
this.onNumberChange();
}, 1);
}
hasValue() {
return !this.isNullOrWhiteSpace(this.value);
}
onCodeOpen() {
this.codeOpen.emit();
}
onCodeChange(event) {
if (this.isNullOrWhiteSpace(this.phoneNumber)) {
this.emitValueChange(null);
}
else {
let googleNumber;
try {
googleNumber = this.phoneUtil.parse(this.phoneNumber, this.country.isoCode.toUpperCase());
}
catch (e) { }
const internationallNo = googleNumber
? this.phoneUtil.format(googleNumber, PhoneNumberFormat.INTERNATIONAL)
: '';
const nationalNo = googleNumber
? this.phoneUtil.format(googleNumber, PhoneNumberFormat.NATIONAL)
: '';
const e164Number = googleNumber
? this.phoneUtil.format(googleNumber, PhoneNumberFormat.E164)
: '';
if (this.separateDialCode && internationallNo) {
this.phoneNumber = this.removeDialCode(internationallNo);
}
this.emitValueChange({
e164Number: e164Number,
internationalNumber: internationallNo,
nationalNumber: nationalNo,
isoCode: this.country.isoCode,
dialCode: this.dialCodePrefix + this.country.dialCode,
});
this.codeChange.emit();
}
setTimeout(() => {
this.numberInputEl.setFocus();
}, 400);
}
onCodeClose() {
this.onTouched();
this.setIonicClasses(this.el);
this.hasFocus = false;
this.setItemClass(this.el, 'item-has-focus', false);
this.codeClose.emit();
}
onCodeSearchCountries(event) {
const text = event.text.trim().toLowerCase();
event.component.startSearch();
event.component.items = this.filterCountries(text);
event.component.endSearch();
}
onCodeSelect() {
this.codeSelect.emit();
}
onIonNumberChange(event) {
this.setIonicClasses(this.el);
this.numberChange.emit(event);
}
onIonNumberBlur() {
this.onTouched();
this.setIonicClasses(this.el);
this.hasFocus = false;
this.setItemClass(this.el, 'item-has-focus', false);
this.numberBlur.emit();
}
onIonNumberFocus() {
this.hasFocus = true;
this.setItemClass(this.el, 'item-has-focus', true);
this.numberFocus.emit();
}
onIonNumberInput(event) {
this.numberInput.emit(event);
}
onNumberChange() {
if (!this.phoneNumber) {
this.value = null;
this.emitValueChange(null);
return;
}
if (this.country) {
this.emitValueChange({
e164Number: this.dialCodePrefix + this.country.dialCode + this.phoneNumber,
internationalNumber: this.dialCodePrefix + this.country.dialCode + ' ' + this.phoneNumber,
nationalNumber: this.phoneNumber,
isoCode: this.country.isoCode,
dialCode: this.dialCodePrefix + this.country.dialCode,
});
}
let googleNumber;
try {
googleNumber = this.phoneUtil.parse(this.phoneNumber, this.country.isoCode.toUpperCase());
}
catch (e) {
return;
}
let isoCode = this.country ? this.country.isoCode : null;
// auto select country based on the extension (and areaCode if needed) (e.g select Canada if number starts with +1 416)
if (this.enableAutoCountrySelect) {
isoCode =
googleNumber && googleNumber.getCountryCode()
? this.getCountryIsoCode(googleNumber.getCountryCode(), googleNumber)
: this.country.isoCode;
if (isoCode && isoCode !== this.country.isoCode) {
const newCountry = this.countries.find((country) => country.isoCode === isoCode);
if (newCountry) {
this.country = newCountry;
}
}
}
isoCode = isoCode ? isoCode : this.country ? this.country.isoCode : null;
if (!this.phoneNumber || !isoCode) {
this.emitValueChange(null);
}
else {
const internationallNo = googleNumber
? this.phoneUtil.format(googleNumber, PhoneNumberFormat.INTERNATIONAL)
: '';
const nationalNo = googleNumber
? this.phoneUtil.format(googleNumber, PhoneNumberFormat.NATIONAL)
: '';
const e164Number = googleNumber
? this.phoneUtil.format(googleNumber, PhoneNumberFormat.E164)
: '';
if (this.separateDialCode && internationallNo) {
this.phoneNumber = this.removeDialCode(internationallNo);
}
this.emitValueChange({
e164Number: e164Number,
internationalNumber: internationallNo,
nationalNumber: nationalNo,
isoCode: this.country.isoCode,
dialCode: this.dialCodePrefix + this.country.dialCode,
});
}
}
onNumberKeyDown(event) {
const allowedChars = /^[0-9\+\-\(\)\.\ ]/;
const allowedCtrlChars = /[axcv]/;
const allowedOtherKeys = [
'ArrowLeft',
'ArrowUp',
'ArrowRight',
'ArrowDown',
'Home',
'End',
'Insert',
'Delete',
'Backspace',
'Tab',
];
const isCtrlKey = event.ctrlKey || event.metaKey;
if (!allowedChars.test(event.key) &&
!(isCtrlKey && allowedCtrlChars.test(event.key)) &&
!allowedOtherKeys.includes(event.key)) {
event.preventDefault();
}
}
filterCountries(text) {
return this.countries.filter((country) => {
return (country.name.toLowerCase().indexOf(text) !== -1 ||
country.name.toLowerCase().indexOf(text) !== -1 ||
country.dialCode.toString().toLowerCase().indexOf(text) !== -1);
});
}
getCountryIsoCode(countryCode, googleNumber) {
const rawNumber = googleNumber.values_[2].toString();
const countries = this.countries.filter((country) => country.dialCode === countryCode.toString());
const mainCountry = countries.find((country) => country.areaCodes === undefined);
const secondaryCountries = countries.filter((country) => country.areaCodes !== undefined);
let matchedCountry = mainCountry ? mainCountry.isoCode : undefined;
secondaryCountries.forEach((country) => {
country.areaCodes.forEach((areaCode) => {
if (rawNumber.startsWith(areaCode)) {
matchedCountry = country.isoCode;
}
});
});
return matchedCountry;
}
async fetchAllCountries() {
this.countries = this.ionIntlTelInputService.getListOfCountries();
}
getCountryByIsoCode(isoCode) {
for (const country of this.countries) {
if (country.isoCode === isoCode) {
return country;
}
}
return;
}
isNullOrWhiteSpace(value) {
if (value === null || value === undefined) {
return true;
}
if (typeof value === 'string' && value === '') {
return true;
}
if (typeof value === 'object' && Object.keys(value).length === 0) {
return true;
}
return false;
}
removeDialCode(phoneNumber) {
if (this.separateDialCode && phoneNumber) {
phoneNumber = phoneNumber.substr(phoneNumber.indexOf(' ') + 1);
}
return phoneNumber;
}
setCountry(country) {
this.country = country;
this.codeChange.emit(this.country);
}
setPreferredCountries() {
for (const preferedCountryIsoCode of this.preferredCountries) {
const country = this.getCountryByIsoCode(preferedCountryIsoCode);
country.priority = country ? 1 : country.priority;
}
this.countries.sort((a, b) => a.priority > b.priority ? -1 : a.priority < b.priority ? 1 : 0);
}
}
/** @nocollapse */ /** @nocollapse */ IonIntlTelInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: IonIntlTelInputComponent, deps: [{ token: i0.ElementRef }, { token: i1.Platform }, { token: i2.IonIntlTelInputService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ /** @nocollapse */ IonIntlTelInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: IonIntlTelInputComponent, selector: "ion-intl-tel-input", inputs: { isEnabled: "isEnabled", defaultCountryiso: "defaultCountryiso", dialCodePrefix: "dialCodePrefix", enableAutoCountrySelect: "enableAutoCountrySelect", enablePlaceholder: "enablePlaceholder", fallbackPlaceholder: "fallbackPlaceholder", inputPlaceholder: "inputPlaceholder", maxLength: "maxLength", modalTitle: "modalTitle", dropdownPlaceholder: "dropdownPlaceholder", modalCssClass: "modalCssClass", modalSearchPlaceholder: "modalSearchPlaceholder", modalCloseText: "modalCloseText", modalCloseButtonSlot: "modalCloseButtonSlot", modalCanSearch: "modalCanSearch", modalShouldBackdropClose: "modalShouldBackdropClose", modalShouldFocusSearchbar: "modalShouldFocusSearchbar", modalSearchFailText: "modalSearchFailText", modalItemIconSlot: "modalItemIconSlot", onlyCountries: "onlyCountries", preferredCountries: "preferredCountries", selectFirstCountry: "selectFirstCountry", separateDialCode: "separateDialCode" }, outputs: { numberChange: "numberChange", numberBlur: "numberBlur", numberFocus: "numberFocus", numberInput: "numberInput", codeChange: "codeChange", codeOpen: "codeOpen", codeClose: "codeClose", codeSelect: "codeSelect" }, host: { properties: { "class.ion-intl-tel-input": "this.cssClass", "class.ion-intl-tel-input-ios": "this.isIos", "class.ion-intl-tel-input-md": "this.isMD", "class.has-focus": "this.hasFocus", "class.ion-intl-tel-input-has-value": "this.hasValueCssClass", "class.ion-intl-tel-input-is-enabled": "this.isEnabled" } }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef((() => IonIntlTelInputComponent)),
multi: true,
},
], viewQueries: [{ propertyName: "numberInputEl", first: true, predicate: ["numberInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"ion-intl-tel-input-code\">\r\n <ionic-selectable\r\n #codeSelect\r\n [(ngModel)]=\"country\"\r\n [canSearch]=\"modalCanSearch\"\r\n closeButtonText=\"{{ modalCloseText }}\"\r\n closeButtonSlot=\"{{ modalCloseButtonSlot }}\"\r\n [disabled]=\"disabled\"\r\n [hasVirtualScroll]=\"true\"\r\n itemTextField=\"name\"\r\n [items]=\"countries\"\r\n [itemIconSlot]=\"modalItemIconSlot\"\r\n itemValueField=\"isoCode\"\r\n modalCssClass=\"ionic-tel-input-modal {{ modalCssClass }}\"\r\n placeholder=\"{{ dropdownPlaceholder }}\"\r\n searchFailText=\"{{ modalSearchFailText }}\"\r\n searchPlaceholder=\"{{ modalSearchPlaceholder }}\"\r\n [shouldBackdropClose]=\"modalShouldBackdropClose\"\r\n [shouldFocusSearchbar]=\"modalShouldFocusSearchbar\"\r\n (onChange)=\"onCodeChange($event)\"\r\n (onClose)=\"onCodeClose()\"\r\n (onOpen)=\"onCodeOpen()\"\r\n (onSearch)=\"onCodeSearchCountries($event)\"\r\n (onSelect)=\"onCodeSelect()\"\r\n >\r\n <ng-template ionicSelectableTitleTemplate>\r\n {{ modalTitle }}\r\n </ng-template>\r\n <ng-template ionicSelectableValueTemplate let-country=\"value\">\r\n <span class=\"fi fi-{{ country.flagClass }}\" style=\"border-radius: 3px;\"></span>\r\n <span *ngIf=\"separateDialCode\">{{ dialCodePrefix }}{{ country.dialCode }}</span>\r\n </ng-template>\r\n <ng-template ionicSelectableItemTemplate let-country=\"item\">\r\n <span\r\n class=\"ion-margin-end\"\r\n style=\"background-color: lightgray; padding: 5px; border-radius: 5px\">\r\n <span class=\"fi fi-{{ country.flagClass }}\" style=\"border-radius: 3px;\"></span>\r\n </span>\r\n <span class=\"ion-margin-end\">{{ country.name }}</span>\r\n <span *ngIf=\"separateDialCode\">{{ dialCodePrefix }}{{ country.dialCode }}</span>\r\n </ng-template>\r\n <ng-template ionicSelectableCloseButtonTemplate>\r\n <ion-icon name=\"close-outline\"></ion-icon>\r\n </ng-template>\r\n <!-- <ng-template ionicSelectableItemEndTemplate let-country=\"item\">\r\n <span class=\"fi fi-{{country.flagClass}}\"></span>\r\n </ng-template> -->\r\n </ionic-selectable>\r\n</div>\r\n\r\n<div class=\"ion-intl-tel-input-number\">\r\n <ion-input\r\n #numberInput\r\n [(ngModel)]=\"phoneNumber\"\r\n autocomplete=\"off\"\r\n [disabled]=\"disabled\"\r\n [attr.maxLength]=\"maxLength\"\r\n type=\"tel\"\r\n (ionBlur)=\"onIonNumberBlur()\"\r\n (ionChange)=\"onIonNumberChange($event)\"\r\n (ionFocus)=\"onIonNumberFocus()\"\r\n (ionInput)=\"onIonNumberInput($event)\"\r\n (keydown)=\"onNumberKeyDown($event)\"\r\n (ngModelChange)=\"onNumberChange()\"\r\n placeholder=\"{{\r\n country\r\n | countryPlaceholder\r\n : enablePlaceholder\r\n : inputPlaceholder\r\n : separateDialCode\r\n : fallbackPlaceholder\r\n }}\"\r\n >\r\n </ion-input>\r\n</div>\r\n", styles: [":host{width:100%;display:flex;align-items:flex-end}:host .ion-intl-tel-input-code{position:relative}:host .ion-intl-tel-input-number{flex:1}:host .ionic-selectable-label-default,:host .ionic-selectable-label-fixed{max-width:100%}:host .ionic-selectable:not(:host .ionic-selectable-label-stacked):not(:host .ionic-selectable-label-floating) ::ng-deep .ionic-selectable-inner .ionic-selectable-value{padding-top:10px;padding-bottom:10px}:host .ionic-selectable:not(:host .ionic-selectable-label-stacked):not(:host .ionic-selectable-label-floating) ::ng-deep .ionic-selectable-icon-inner{top:17px}:host .fi{margin-right:5px;border-radius:3px}\n"], components: [{ type: i4.IonicSelectableComponent, selector: "ionic-selectable", inputs: ["items", "modalCssClass", "modalEnterAnimation", "modalLeaveAnimation", "isConfirmButtonEnabled", "itemValueField", "itemTextField", "groupValueField", "groupTextField", "canSearch", "hasInfiniteScroll", "hasVirtualScroll", "virtualScrollApproxItemHeight", "searchPlaceholder", "placeholder", "searchFailText", "clearButtonText", "addButtonText", "confirmButtonText", "closeButtonText", "shouldFocusSearchbar", "headerColor", "groupColor", "closeButtonSlot", "itemIconSlot", "searchDebounce", "disabledItems", "shouldStoreItemValue", "canSaveItem", "canDeleteItem", "virtualScrollHeaderFn", "isEnabled", "shouldBackdropClose", "hasConfirmButton", "isOnSearchEnabled", "canClear", "isMultiple", "canAddItem"], outputs: ["itemsChange", "onChange", "onSearch", "onSearchFail", "onSearchSuccess", "onInfiniteScroll", "onOpen", "onClose", "onSelect", "onClear", "onSaveItem", "onDeleteItem", "onAddItem"] }, { type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { type: i1.IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "size", "spellcheck", "step", "type", "value"] }], directives: [{ type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i4.IonicSelectableTitleTemplateDirective, selector: "[ionicSelectableTitleTemplate]" }, { type: i4.IonicSelectableValueTemplateDirective, selector: "[ionicSelectableValueTemplate]" }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.IonicSelectableItemTemplateDirective, selector: "[ionicSelectableItemTemplate]" }, { type: i4.IonicSelectableCloseButtonTemplateDirective, selector: "[ionicSelectableCloseButtonTemplate]" }, { type: i1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }], pipes: { "countryPlaceholder": i7.CountryPlaceholder } });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: IonIntlTelInputComponent, decorators: [{
type: Component,
args: [{ selector: 'ion-intl-tel-input', providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef((() => IonIntlTelInputComponent)),
multi: true,
},
], template: "<div class=\"ion-intl-tel-input-code\">\r\n <ionic-selectable\r\n #codeSelect\r\n [(ngModel)]=\"country\"\r\n [canSearch]=\"modalCanSearch\"\r\n closeButtonText=\"{{ modalCloseText }}\"\r\n closeButtonSlot=\"{{ modalCloseButtonSlot }}\"\r\n [disabled]=\"disabled\"\r\n [hasVirtualScroll]=\"true\"\r\n itemTextField=\"name\"\r\n [items]=\"countries\"\r\n [itemIconSlot]=\"modalItemIconSlot\"\r\n itemValueField=\"isoCode\"\r\n modalCssClass=\"ionic-tel-input-modal {{ modalCssClass }}\"\r\n placeholder=\"{{ dropdownPlaceholder }}\"\r\n searchFailText=\"{{ modalSearchFailText }}\"\r\n searchPlaceholder=\"{{ modalSearchPlaceholder }}\"\r\n [shouldBackdropClose]=\"modalShouldBackdropClose\"\r\n [shouldFocusSearchbar]=\"modalShouldFocusSearchbar\"\r\n (onChange)=\"onCodeChange($event)\"\r\n (onClose)=\"onCodeClose()\"\r\n (onOpen)=\"onCodeOpen()\"\r\n (onSearch)=\"onCodeSearchCountries($event)\"\r\n (onSelect)=\"onCodeSelect()\"\r\n >\r\n <ng-template ionicSelectableTitleTemplate>\r\n {{ modalTitle }}\r\n </ng-template>\r\n <ng-template ionicSelectableValueTemplate let-country=\"value\">\r\n <span class=\"fi fi-{{ country.flagClass }}\" style=\"border-radius: 3px;\"></span>\r\n <span *ngIf=\"separateDialCode\">{{ dialCodePrefix }}{{ country.dialCode }}</span>\r\n </ng-template>\r\n <ng-template ionicSelectableItemTemplate let-country=\"item\">\r\n <span\r\n class=\"ion-margin-end\"\r\n style=\"background-color: lightgray; padding: 5px; border-radius: 5px\">\r\n <span class=\"fi fi-{{ country.flagClass }}\" style=\"border-radius: 3px;\"></span>\r\n </span>\r\n <span class=\"ion-margin-end\">{{ country.name }}</span>\r\n <span *ngIf=\"separateDialCode\">{{ dialCodePrefix }}{{ country.dialCode }}</span>\r\n </ng-template>\r\n <ng-template ionicSelectableCloseButtonTemplate>\r\n <ion-icon name=\"close-outline\"></ion-icon>\r\n </ng-template>\r\n <!-- <ng-template ionicSelectableItemEndTemplate let-country=\"item\">\r\n <span class=\"fi fi-{{country.flagClass}}\"></span>\r\n </ng-template> -->\r\n </ionic-selectable>\r\n</div>\r\n\r\n<div class=\"ion-intl-tel-input-number\">\r\n <ion-input\r\n #numberInput\r\n [(ngModel)]=\"phoneNumber\"\r\n autocomplete=\"off\"\r\n [disabled]=\"disabled\"\r\n [attr.maxLength]=\"maxLength\"\r\n type=\"tel\"\r\n (ionBlur)=\"onIonNumberBlur()\"\r\n (ionChange)=\"onIonNumberChange($event)\"\r\n (ionFocus)=\"onIonNumberFocus()\"\r\n (ionInput)=\"onIonNumberInput($event)\"\r\n (keydown)=\"onNumberKeyDown($event)\"\r\n (ngModelChange)=\"onNumberChange()\"\r\n placeholder=\"{{\r\n country\r\n | countryPlaceholder\r\n : enablePlaceholder\r\n : inputPlaceholder\r\n : separateDialCode\r\n : fallbackPlaceholder\r\n }}\"\r\n >\r\n </ion-input>\r\n</div>\r\n", styles: [":host{width:100%;display:flex;align-items:flex-end}:host .ion-intl-tel-input-code{position:relative}:host .ion-intl-tel-input-number{flex:1}:host .ionic-selectable-label-default,:host .ionic-selectable-label-fixed{max-width:100%}:host .ionic-selectable:not(:host .ionic-selectable-label-stacked):not(:host .ionic-selectable-label-floating) ::ng-deep .ionic-selectable-inner .ionic-selectable-value{padding-top:10px;padding-bottom:10px}:host .ionic-selectable:not(:host .ionic-selectable-label-stacked):not(:host .ionic-selectable-label-floating) ::ng-deep .ionic-selectable-icon-inner{top:17px}:host .fi{margin-right:5px;border-radius:3px}\n"] }]
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.Platform }, { type: i2.IonIntlTelInputService }, { type: i3.TranslateService }]; }, propDecorators: { cssClass: [{
type: HostBinding,
args: ['class.ion-intl-tel-input']
}], isIos: [{
type: HostBinding,
args: ['class.ion-intl-tel-input-ios']
}], isMD: [{
type: HostBinding,
args: ['class.ion-intl-tel-input-md']
}], hasFocus: [{
type: HostBinding,
args: ['class.has-focus']
}], hasValueCssClass: [{
type: HostBinding,
args: ['class.ion-intl-tel-input-has-value']
}], isEnabled: [{
type: HostBinding,
args: ['class.ion-intl-tel-input-is-enabled']
}, {
type: Input,
args: ['isEnabled']
}], defaultCountryiso: [{
type: Input
}], dialCodePrefix: [{
type: Input
}], enableAutoCountrySelect: [{
type: Input
}], enablePlaceholder: [{
type: Input
}], fallbackPlaceholder: [{
type: Input
}], inputPlaceholder: [{
type: Input
}], maxLength: [{
type: Input
}], modalTitle: [{
type: Input
}], dropdownPlaceholder: [{
type: Input
}], modalCssClass: [{
type: Input
}], modalSearchPlaceholder: [{
type: Input
}], modalCloseText: [{
type: Input
}], modalCloseButtonSlot: [{
type: Input
}], modalCanSearch: [{
type: Input
}], modalShouldBackdropClose: [{
type: Input
}], modalShouldFocusSearchbar: [{
type: Input
}], modalSearchFailText: [{
type: Input
}], modalItemIconSlot: [{
type: Input
}], onlyCountries: [{
type: Input
}], preferredCountries: [{
type: Input
}], selectFirstCountry: [{
type: Input
}], separateDialCode: [{
type: Input
}], numberChange: [{
type: Output
}], numberBlur: [{
type: Output
}], numberFocus: [{
type: Output
}], numberInput: [{
type: Output
}], codeChange: [{
type: Output
}], codeOpen: [{
type: Output
}], codeClose: [{
type: Output
}], codeSelect: [{
type: Output
}], numberInputEl: [{
type: ViewChild,
args: ['numberInput', { static: false }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW9uLWludGwtdGVsLWlucHV0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2lvbi1pbnRsLXRlbC1pbnB1dC9zcmMvbGliL2lvbi1pbnRsLXRlbC1pbnB1dC9pb24taW50bC10ZWwtaW5wdXQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaW9uLWludGwtdGVsLWlucHV0L3NyYy9saWIvaW9uLWludGwtdGVsLWlucHV0L2lvbi1pbnRsLXRlbC1pbnB1dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUVULEtBQUssRUFDTCxVQUFVLEVBQ1YsTUFBTSxFQUNOLFlBQVksRUFHWixTQUFTLEVBQ1QsVUFBVSxFQUNWLFdBQVcsR0FDWixNQUFNLGVBQWUsQ0FBQztBQUV2QixPQUFPLEVBQ0wsaUJBQWlCLEdBR2xCLE1BQU0sZ0JBQWdCLENBQUM7QUFFeEIsT0FBTyxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUdwRCxPQUFPLEVBRUwsaUJBQWlCLEVBQ2pCLGVBQWUsR0FDaEIsTUFBTSx1QkFBdUIsQ0FBQztBQUkvQixPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUN2RSw4RUFBOEU7QUFDOUUsT0FBTyxFQUFFLEdBQUcsRUFBRSxNQUFNLGNBQWMsQ0FBQztBQUNuQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxTQUFTLENBQUM7QUFDNUMsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0scUJBQXFCLENBQUM7Ozs7Ozs7OztBQUV2RDs7R0FFRztBQWVIOztHQUVHO0FBQ0gsTUFBTSxPQUFPLHdCQUF3QjtJQTRVbkMsWUFDVSxFQUFjLEVBQ2QsUUFBa0IsRUFDbEIsc0JBQThDLEVBQzlDLFNBQTJCO1FBSDNCLE9BQUUsR0FBRixFQUFFLENBQVk7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