@serene-dev/ng-tel-input
Version:
This is a wrapper for [intl-tel-input@ 23.0.10](https://github.com/jackocnr/intl-tel-input)
1 lines • 8.31 kB
Source Map (JSON)
{"version":3,"file":"serene-dev-ng-tel-input.mjs","sources":["../../../../projects/ng-tel-input/src/lib/ng-tel-input.directive.ts","../../../../projects/ng-tel-input/src/public-api.ts","../../../../projects/ng-tel-input/src/serene-dev-ng-tel-input.ts"],"sourcesContent":["import { isPlatformBrowser } from '@angular/common';\nimport {\n Directive,\n ElementRef,\n HostListener,\n Inject,\n Input,\n PLATFORM_ID,\n computed,\n input,\n output,\n} from '@angular/core';\nimport { Iti, SomeOptions } from 'intl-tel-input';\n// import { Options, Plugin } from 'intl-tel-input/utils-compiled';\n\n/**\n * Directive to validate input of telephone numbers\n */\n@Directive({\n selector: '[ngTelInput]',\n standalone: true,\n exportAs: 'ngTelInput',\n}) /**\n * Directive to validate input of telephone numbers\n */\nexport class NGTelInputDirective {\n /**\n * Path to intl-tel-input js script.\n * IF you wish to import the script outside the directive, you can set this field as undefined or null.\n */\n readonly scriptPath = input<string>(\n 'https://cdn.jsdelivr.net/npm/intl-tel-input@23.0.10/build/js/intlTelInput.min.js',\n );\n /**\n * Path to intl-tel-input utils js script.\n */\n readonly utilScriptPath = input<string>(\n 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/23.0.10/js/utils.js',\n );\n\n /**\n * Instance of the intl-tel-input object\n */\n instance?: Iti;\n\n /**\n * Options that can be provided during initialization.\n */\n readonly _ng2TelInputOptions = input<TelInputOptions>({}, { alias: 'ng2TelInputOptions' });\n /**\n * Emits an event when an error occurs.\n */\n readonly hasError = output<boolean>();\n /**\n * Emits the current number in the given format (defaults to E.164 standard). The different formats are available in the enum intlTelInputUtils.numberFormat - taken from here. Requires the utilsScript option. Note that even if nationalMode is enabled, this can still return a full international number.\n */\n readonly ng2TelOutput = output<any>();\n /**\n * Emits the country data for the currently selected flag.\n */\n readonly countryChange = output<ReturnType<Iti['getSelectedCountryData']>>();\n /**\n * Emits the instance of the intl-tel-input object\n */\n readonly intlTelInputObject = output<any>();\n /**\n * Computed Options\n */\n readonly ng2TelInputOptions = computed<TelInputOptions>(() => ({\n ...this._ng2TelInputOptions(),\n utilsScript: this.utilScriptPath() || this._ng2TelInputOptions()?.utilsScript,\n }));\n\n /**\n * Directive to validate input of telephone numbers\n */\n constructor(\n /**\n * Reference to the input element.\n */\n public elementRef: ElementRef<HTMLInputElement>,\n @Inject(PLATFORM_ID) private platformId: string,\n ) {}\n\n /**\n * initialise the plugin with optional options.\n */\n async ngOnInit() {\n await new Promise((resolve) => {\n if (this.scriptPath()) {\n const scripTag = document.createElement('script');\n scripTag.src = this.scriptPath();\n document.getElementsByTagName('body')[0].appendChild(scripTag);\n scripTag.onload = (e) => {\n resolve(true);\n };\n }\n });\n if (isPlatformBrowser(this.platformId)) {\n // iti;\n // debugger;\n this.instance = window['intlTelInput'](this.elementRef.nativeElement, {\n ...this.ng2TelInputOptions(),\n });\n\n this.elementRef.nativeElement.addEventListener('countrychange', () => {\n this.countryChange.emit(this.instance?.getSelectedCountryData());\n });\n\n this.intlTelInputObject.emit(this.instance);\n }\n }\n\n /**\n * Runs validation checks after the content of the input changes.\n */\n @HostListener('blur') onBlur() {\n let isInputValid = this.isInputValid();\n if (isInputValid) {\n let telOutput = this.instance?.getNumber();\n this.hasError.emit(isInputValid);\n this.ng2TelOutput.emit(telOutput);\n } else {\n this.hasError.emit(isInputValid);\n }\n }\n\n /**\n * Validate the current number. Expects an internationally formatted number (unless nationalMode is enabled). If validation fails, you can use getValidationError to get more information. Requires the utilsScript option. Also see getNumberType if you want to make sure the user enters a certain type of number e.g. a mobile number.\n * @returns Boolean\n */\n isInputValid() {\n return this.instance?.isValidNumber();\n }\n\n /**\n * Change the country selection (e.g. when the user is entering their address).\n * @param countryCode — country code of the country to be set.\n */\n setCountry(country: string) {\n this.instance?.setCountry(country);\n }\n}\n/**Telephone inputs custom configuration */\nexport interface TelInputOptions extends SomeOptions {}\n","/*\n * Public API Surface of ng-tel-input\n */\n\nexport * from './lib/ng-tel-input.directive';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}