@crodriguezdominguez/ion-intl-tel-input 2.4.3 → 3.1.0

package/index.d.ts

@@ -1,5 +1,361 @@
+import { Validator, AbstractControl, ValidationErrors, ControlValueAccessor } from '@angular/forms';
+import * as _angular_core from '@angular/core';
+import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { IonSearchbar } from '@ionic/angular/standalone';
+
+declare class IonIntlTelInputValidators {
+    static phone(control: AbstractControl): ValidationErrors | null;
+}
+declare class IonIntlTelInputValidatorDirective implements Validator {
+    validate(control: AbstractControl): ValidationErrors | null;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonIntlTelInputValidatorDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<IonIntlTelInputValidatorDirective, "[ionIntlTelInputValid]", never, {}, {}, never, never, true, never>;
+}
+
+interface CountryI {
+    name: string;
+    isoCode: string;
+    dialCode: string;
+    flagClass: string;
+    priority: number;
+    placeholder: string;
+    areaCodes?: Array<string>;
+    displayDialCode: string;
+}
+
 /**
- * Generated bundle index. Do not edit.
+ * @ignore
  */
-/// <amd-module name="@crodriguezdominguez/ion-intl-tel-input" />
-export * from './public-api';
+declare class IonIntlTelInputComponent implements ControlValueAccessor, OnInit, OnChanges {
+    private readonly el;
+    private readonly platform;
+    private readonly ionIntlTelInputService;
+    private readonly modalCtrl;
+    cssClass: boolean;
+    isIos: boolean;
+    isMD: boolean;
+    hasFocus: any;
+    get hasValueCssClass(): boolean;
+    get isEnabled(): boolean;
+    /**
+     * autocomplete, set to 'tel' if needed
+     *
+     * @default 'off'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly autocomplete: _angular_core.InputSignal<"off" | "tel">;
+    /**
+     * required, passed onto ion-input so we can be accessiblity compliant
+     *
+     * @default false
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly required: _angular_core.InputSignal<boolean>;
+    /**
+     * Iso Code of default selected Country.
+     * See more on.
+     *
+     * @default ''
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly defaultCountryiso: _angular_core.InputSignal<string>;
+    /**
+     * Determines whether to use `00` or `+` as dial code prefix.
+     * Available attributes are '+' | '00'.
+     * See more on.
+     *
+     * @default +
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly dialCodePrefix: _angular_core.InputSignal<"+" | "00">;
+    /**
+     * Determines whether to select automatic country based on user input.
+     * See more on.
+     *
+     * @default true
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly enableAutoCountrySelect: _angular_core.InputSignal<boolean>;
+    /**
+     * Determines whether an example number will be shown as a placeholder in input.
+     * See more on.
+     *
+     * @default true
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly enablePlaceholder: _angular_core.InputSignal<boolean>;
+    /**
+     * A fallaback placeholder to be used if no example number is found for a country.
+     * See more on.
+     *
+     * @default ''
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly fallbackPlaceholder: _angular_core.InputSignal<string>;
+    /**
+     * 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
+     */
+    readonly inputPlaceholder: _angular_core.InputSignal<string>;
+    readonly inputLabel: _angular_core.InputSignal<string>;
+    readonly inputLabelColor: _angular_core.InputSignal<any>;
+    readonly inputLabelPlacement: _angular_core.InputSignal<"end" | "start" | "floating" | "stacked" | "fixed">;
+    /**
+     * Instead of an example phone number, use a x pattern. Such as xxx-xxx-xxxx, this will be obtained
+     * based on the example number from the google phone lib.
+     *
+     * @default true
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly usePatternPlaceholder: _angular_core.InputSignal<boolean>;
+    /**
+     * Maximum Length for input.
+     * See more on.
+     *
+     * @default '15'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly maxLength: _angular_core.InputSignal<string>;
+    /**
+     * Title of modal opened to select country dial code.
+     * See more on.
+     *
+     * @default 'Select Country'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalTitle: _angular_core.InputSignal<string>;
+    /**
+     * CSS class to attach to dial code selectionmodal.
+     * See more on.
+     *
+     * @default 'ion-intl-tel-modal'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalCssClass: _angular_core.InputSignal<string>;
+    /**
+     * Placeholder for input in dial code selection modal.
+     * See more on.
+     *
+     * @default 'Enter country name'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalSearchPlaceholder: _angular_core.InputSignal<string>;
+    /**
+     * Text for close button in dial code selection modal.
+     * See more on.
+     *
+     * @default 'Close'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalCloseText: _angular_core.InputSignal<string>;
+    /**
+     * 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
+     */
+    readonly modalCloseButtonSlot: _angular_core.InputSignal<"end" | "start" | "primary" | "secondary">;
+    /**
+     * Determines whether dial code selection modal should be searchable or not.
+     * See more on.
+     *
+     * @default 'true'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalCanSearch: _angular_core.InputSignal<boolean>;
+    /**
+     * Determines whether dial code selection modal is closed on backdrop click.
+     * See more on.
+     *
+     * @default 'true'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalShouldBackdropClose: _angular_core.InputSignal<boolean>;
+    /**
+     * Determines whether input should be focused when dial code selection modal is opened.
+     * See more on.
+     *
+     * @default 'true'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalShouldFocusSearchbar: _angular_core.InputSignal<boolean>;
+    /**
+     * Message to show when no countries are found for search in dial code selection modal.
+     * See more on.
+     *
+     * @default 'true'
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly modalSearchFailText: _angular_core.InputSignal<string>;
+    /**
+     * 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
+     */
+    readonly onlyCountries: _angular_core.InputSignal<string[]>;
+    /**
+     * List of iso codesn 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
+     */
+    readonly preferredCountries: _angular_core.InputSignal<string[]>;
+    /**
+     * Determines whether first country should be selected in dial code select or not.
+     * See more on.
+     *
+     * @default true
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly selectFirstCountry: _angular_core.InputSignal<boolean>;
+    /**
+     * Determines whether to visually separate dialcode into the drop down element.
+     * See more on.
+     *
+     * @default true
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly separateDialCode: _angular_core.InputSignal<boolean>;
+    /**
+     * Fires when the Phone number Input is changed.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly numberChange: _angular_core.OutputEmitterRef<Event>;
+    /**
+     * Fires when the Phone number Input is blurred.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly numberBlur: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Fires when the Phone number Input is focused.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly numberFocus: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Fires when the user is typing in Phone number Input.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly numberInput: _angular_core.OutputEmitterRef<KeyboardEvent>;
+    /**
+     * Fires when the dial code selection is changed.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly codeChange: _angular_core.OutputEmitterRef<CountryI>;
+    /**
+     * Fires when the dial code selection modal is opened.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly codeOpen: _angular_core.OutputEmitterRef<any>;
+    /**
+     * Fires when the dial code selection modal is closed.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly codeClose: _angular_core.OutputEmitterRef<any>;
+    /**
+     * Fires when a dial code is selected in dial code selection modal.
+     * See more on.
+     *
+     * @memberof IonIntlTelInputComponent
+     */
+    readonly codeSelect: _angular_core.OutputEmitterRef<string>;
+    private readonly numberInputEl;
+    private _value;
+    country: CountryI;
+    phoneNumber: string;
+    countries: CountryI[];
+    disabled: boolean;
+    onTouched: () => void;
+    propagateChange: (_: string | null) => void;
+    constructor();
+    get value(): string | null;
+    set value(value: string | null);
+    emitValueChange(change: string | null): void;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    writeValue(obj: string): void;
+    setDisabledState(isDisabled: boolean): void;
+    fillValues(value: string): void;
+    hasValue(): boolean;
+    openModal(): Promise<void>;
+    onCodeChange(): void;
+    onIonNumberChange(event: Event): void;
+    onIonNumberBlur(): void;
+    onIonNumberFocus(): void;
+    onIonNumberInput(event: KeyboardEvent): void;
+    onNumberChange(): void;
+    onNumberKeyDown(event: KeyboardEvent): void;
+    private fetchAllCountries;
+    private getCountryByIsoCode;
+    private isNullOrWhiteSpace;
+    private removeDialCode;
+    private setCountry;
+    private setPreferredCountries;
+    private readonly getClasses;
+    private readonly setClasses;
+    private readonly setIonicClasses;
+    private readonly setItemClass;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonIntlTelInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonIntlTelInputComponent, "ion-intl-tel-input", never, { "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "defaultCountryiso": { "alias": "defaultCountryiso"; "required": false; "isSignal": true; }; "dialCodePrefix": { "alias": "dialCodePrefix"; "required": false; "isSignal": true; }; "enableAutoCountrySelect": { "alias": "enableAutoCountrySelect"; "required": false; "isSignal": true; }; "enablePlaceholder": { "alias": "enablePlaceholder"; "required": false; "isSignal": true; }; "fallbackPlaceholder": { "alias": "fallbackPlaceholder"; "required": false; "isSignal": true; }; "inputPlaceholder": { "alias": "inputPlaceholder"; "required": false; "isSignal": true; }; "inputLabel": { "alias": "inputLabel"; "required": false; "isSignal": true; }; "inputLabelColor": { "alias": "inputLabelColor"; "required": false; "isSignal": true; }; "inputLabelPlacement": { "alias": "inputLabelPlacement"; "required": false; "isSignal": true; }; "usePatternPlaceholder": { "alias": "usePatternPlaceholder"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "modalTitle": { "alias": "modalTitle"; "required": false; "isSignal": true; }; "modalCssClass": { "alias": "modalCssClass"; "required": false; "isSignal": true; }; "modalSearchPlaceholder": { "alias": "modalSearchPlaceholder"; "required": false; "isSignal": true; }; "modalCloseText": { "alias": "modalCloseText"; "required": false; "isSignal": true; }; "modalCloseButtonSlot": { "alias": "modalCloseButtonSlot"; "required": false; "isSignal": true; }; "modalCanSearch": { "alias": "modalCanSearch"; "required": false; "isSignal": true; }; "modalShouldBackdropClose": { "alias": "modalShouldBackdropClose"; "required": false; "isSignal": true; }; "modalShouldFocusSearchbar": { "alias": "modalShouldFocusSearchbar"; "required": false; "isSignal": true; }; "modalSearchFailText": { "alias": "modalSearchFailText"; "required": false; "isSignal": true; }; "onlyCountries": { "alias": "onlyCountries"; "required": false; "isSignal": true; }; "preferredCountries": { "alias": "preferredCountries"; "required": false; "isSignal": true; }; "selectFirstCountry": { "alias": "selectFirstCountry"; "required": false; "isSignal": true; }; "separateDialCode": { "alias": "separateDialCode"; "required": false; "isSignal": true; }; }, { "numberChange": "numberChange"; "numberBlur": "numberBlur"; "numberFocus": "numberFocus"; "numberInput": "numberInput"; "codeChange": "codeChange"; "codeOpen": "codeOpen"; "codeClose": "codeClose"; "codeSelect": "codeSelect"; }, never, never, true, never>;
+}
+
+declare class IonIntTelCodeComponent implements OnInit {
+    private readonly modalController;
+    readonly country: _angular_core.InputSignal<CountryI>;
+    readonly canSearch: _angular_core.InputSignal<boolean>;
+    readonly closeButtonText: _angular_core.InputSignal<string>;
+    readonly closeButtonSlot: _angular_core.InputSignal<string>;
+    readonly countries: _angular_core.InputSignal<CountryI[]>;
+    readonly searchFailText: _angular_core.InputSignal<string>;
+    readonly searchPlaceholder: _angular_core.InputSignal<string>;
+    readonly shouldFocusSearchbar: _angular_core.InputSignal<boolean>;
+    readonly title: _angular_core.InputSignal<string>;
+    readonly dialCode: _angular_core.InputSignal<string>;
+    protected readonly searchBar: _angular_core.Signal<IonSearchbar>;
+    protected readonly displayedCountries: _angular_core.Signal<CountryI[]>;
+    protected readonly searchText: _angular_core.WritableSignal<string>;
+    protected readonly notFound: _angular_core.Signal<boolean>;
+    private allCountries;
+    ngOnInit(): void;
+    ionViewDidEnter(): void;
+    search(ev: any): void;
+    itemTapped(c: any): Promise<void>;
+    closeModal(): Promise<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonIntTelCodeComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonIntTelCodeComponent, "ion-intl-tel-code", never, { "country": { "alias": "country"; "required": false; "isSignal": true; }; "canSearch": { "alias": "canSearch"; "required": false; "isSignal": true; }; "closeButtonText": { "alias": "closeButtonText"; "required": false; "isSignal": true; }; "closeButtonSlot": { "alias": "closeButtonSlot"; "required": false; "isSignal": true; }; "countries": { "alias": "countries"; "required": false; "isSignal": true; }; "searchFailText": { "alias": "searchFailText"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "shouldFocusSearchbar": { "alias": "shouldFocusSearchbar"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "dialCode": { "alias": "dialCode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class IonIntlTelInputService {
+    countryList: CountryI[];
+    constructor();
+    getListOfCountries(): any;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonIntlTelInputService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<IonIntlTelInputService>;
+}
+
+export { IonIntTelCodeComponent, IonIntlTelInputComponent, IonIntlTelInputService, IonIntlTelInputValidatorDirective, IonIntlTelInputValidators };

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.4.3",
+  "version": "3.1.0",
   "name": "@crodriguezdominguez/ion-intl-tel-input",
   "title": "Ion Intl Tel Input",
   "private": false,
@@ -9,16 +9,16 @@
     "url": "https://github.com/azzamasghar1"
   },
   "license": "See license in LICENSE",
-  "homepage": "https://github.com/azzamasghar1/ion-intl-tel-input",
+  "homepage": "https://github.com/crodriguezdominguez/ion-intl-tel-input",
   "repository": {
     "type": "git",
-    "url": "https://github.com/azzamasghar1/ion-intl-tel-input"
+    "url": "https://github.com/crodriguezdominguez/ion-intl-tel-input"
   },
   "bugs": {
-    "url": "https://github.com/azzamasghar1/ion-intl-tel-input/issues"
+    "url": "https://github.com/crodriguezdominguez/ion-intl-tel-input/issues"
   },
   "keywords": [
-    "ionic 7",
+    "ionic 8",
     "ion-intl-tel-input",
     "intl tel input",
     "intl",
@@ -33,7 +33,7 @@
   ],
   "peerDependencies": {
     "flag-icons": "^7.0.0",
-    "libphonenumber-js": "^1.10.49"
+    "libphonenumber-js": "^1.11.15"
   },
   "module": "fesm2022/crodriguezdominguez-ion-intl-tel-input.mjs",
   "typings": "index.d.ts",
@@ -43,8 +43,6 @@
     },
     ".": {
       "types": "./index.d.ts",
-      "esm2022": "./esm2022/crodriguezdominguez-ion-intl-tel-input.mjs",
-      "esm": "./esm2022/crodriguezdominguez-ion-intl-tel-input.mjs",
       "default": "./fesm2022/crodriguezdominguez-ion-intl-tel-input.mjs"
     }
   },

package/esm2022/crodriguezdominguez-ion-intl-tel-input.mjs

@@ -1,5 +0,0 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './public-api';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3JvZHJpZ3VlemRvbWluZ3Vlei1pb24taW50bC10ZWwtaW5wdXQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9wcm9qZWN0cy9pb24taW50bC10ZWwtaW5wdXQvc3JjL2Nyb2RyaWd1ZXpkb21pbmd1ZXotaW9uLWludGwtdGVsLWlucHV0LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxjQUFjLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vcHVibGljLWFwaSc7XG4iXX0=