intl-tel-input 27.1.2 → 27.2.0
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.
- package/CHANGELOG.md +1 -1
- package/README.md +2 -2
- package/angular/README.md +8 -0
- package/angular/dist/IntlTelInput.d.ts +13 -1
- package/angular/dist/IntlTelInput.js +238 -186
- package/angular/dist/IntlTelInputWithUtils.js +238 -186
- package/dist/js/data.js +1 -1
- package/dist/js/data.min.js +1 -1
- package/dist/js/intlTelInput.js +204 -184
- package/dist/js/intlTelInput.min.js +9 -9
- package/dist/js/intlTelInput.mjs +203 -183
- package/dist/js/intlTelInputWithUtils.js +204 -184
- package/dist/js/intlTelInputWithUtils.min.js +7 -7
- package/dist/js/intlTelInputWithUtils.mjs +203 -183
- package/package.json +1 -1
- package/react/README.md +8 -0
- package/react/dist/IntlTelInput.d.ts +5 -0
- package/react/dist/IntlTelInput.js +246 -188
- package/react/dist/IntlTelInputWithUtils.js +246 -188
- package/svelte/README.md +9 -0
- package/svelte/src/IntlTelInput.svelte +49 -7
- package/svelte/src/IntlTelInput.svelte.d.ts +6 -0
- package/vue/README.md +9 -0
- package/vue/dist/{IntlTelInput-6eM889WB.js → IntlTelInput-DTtMkd4-.js} +338 -309
- package/vue/dist/IntlTelInput.js +1 -1
- package/vue/dist/IntlTelInput.vue.d.ts +19 -11
- package/vue/dist/IntlTelInputWithUtils.js +1 -1
|
@@ -2975,7 +2975,7 @@ var UI = class _UI {
|
|
|
2975
2975
|
this.#selectedCountryEl.focus();
|
|
2976
2976
|
}
|
|
2977
2977
|
}
|
|
2978
|
-
if (!this.#options.countrySearch && REGEX.HIDDEN_SEARCH_CHAR.test(e.key)) {
|
|
2978
|
+
if (!this.#options.countrySearch && e.target !== this.telInputEl && REGEX.HIDDEN_SEARCH_CHAR.test(e.key)) {
|
|
2979
2979
|
e.stopPropagation();
|
|
2980
2980
|
if (queryTimer) {
|
|
2981
2981
|
clearTimeout(queryTimer);
|
|
@@ -3483,6 +3483,8 @@ var Iti = class _Iti {
|
|
|
3483
3483
|
#isActive = true;
|
|
3484
3484
|
#abortController;
|
|
3485
3485
|
#numerals;
|
|
3486
|
+
//* Tracks whether the user has typed/pasted their own formatting chars, so AYT-formatting should back off.
|
|
3487
|
+
#userOverrideFormatting = false;
|
|
3486
3488
|
#autoCountryDeferred;
|
|
3487
3489
|
#utilsDeferred;
|
|
3488
3490
|
constructor(input, customOptions = {}) {
|
|
@@ -3672,176 +3674,211 @@ var Iti = class _Iti {
|
|
|
3672
3674
|
this.#bindKeydownListener();
|
|
3673
3675
|
this.#bindPasteListener();
|
|
3674
3676
|
}
|
|
3675
|
-
|
|
3676
|
-
|
|
3677
|
-
|
|
3678
|
-
|
|
3679
|
-
|
|
3680
|
-
|
|
3681
|
-
|
|
3682
|
-
|
|
3683
|
-
|
|
3684
|
-
|
|
3685
|
-
|
|
3677
|
+
//* Android workaround for handling plus when separateDialCode enabled (as impossible to handle with keydown/keyup, for which e.key always returns "Unidentified", see https://stackoverflow.com/q/59584061/217866)
|
|
3678
|
+
#handleAndroidPlusKey(inputValue) {
|
|
3679
|
+
this.#removeJustTypedChar(inputValue);
|
|
3680
|
+
this.#openDropdownWithPlus();
|
|
3681
|
+
}
|
|
3682
|
+
//* Android strictMode workaround: the keydown-based filter can't block these because e.key is "Unidentified" on Android virtual keyboards, so strip them here on input.
|
|
3683
|
+
#handleAndroidStrictReject(inputValue, rejectedInput) {
|
|
3684
|
+
const newCaretPos = this.#removeJustTypedChar(inputValue);
|
|
3685
|
+
this.#ui.telInputEl.setSelectionRange(newCaretPos, newCaretPos);
|
|
3686
|
+
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3687
|
+
source: "key",
|
|
3688
|
+
rejectedInput,
|
|
3689
|
+
reason: "invalid"
|
|
3690
|
+
});
|
|
3691
|
+
}
|
|
3692
|
+
//* Format the input value using libphonenumber's AYT formatter, preserving caret position (called after an input event).
|
|
3693
|
+
#formatAsYouType(inputValue, isDeleteForwards) {
|
|
3694
|
+
const currentCaretPos = this.#ui.telInputEl.selectionStart || 0;
|
|
3695
|
+
const valueBeforeCaret = inputValue.substring(0, currentCaretPos);
|
|
3696
|
+
const relevantCharsBeforeCaret = valueBeforeCaret.replace(
|
|
3697
|
+
REGEX.NON_PLUS_NUMERIC_GLOBAL,
|
|
3698
|
+
""
|
|
3699
|
+
).length;
|
|
3700
|
+
const fullNumber = this.#getFullNumber();
|
|
3701
|
+
const formattedValue = formatNumberAsYouType(
|
|
3702
|
+
fullNumber,
|
|
3703
|
+
inputValue,
|
|
3704
|
+
intlTelInput.utils,
|
|
3705
|
+
this.#selectedCountry,
|
|
3706
|
+
this.#options.separateDialCode
|
|
3707
|
+
);
|
|
3708
|
+
const newCaretPos = computeNewCaretPosition(
|
|
3709
|
+
relevantCharsBeforeCaret,
|
|
3710
|
+
formattedValue,
|
|
3711
|
+
currentCaretPos,
|
|
3712
|
+
isDeleteForwards
|
|
3713
|
+
);
|
|
3714
|
+
this.#setTelInputValue(formattedValue);
|
|
3715
|
+
this.#ui.telInputEl.setSelectionRange(newCaretPos, newCaretPos);
|
|
3716
|
+
}
|
|
3717
|
+
//* If separateDialCode AND typed dial code (e.g. from paste or autofill, or from typing a dial code when countrySearch disabled), then remove the typed dial code.
|
|
3718
|
+
//* Only strip when a full dial code is actually present — otherwise a lone typed "+" (or partial prefix) would get erased.
|
|
3719
|
+
#stripTypedDialCode(inputValue) {
|
|
3720
|
+
if (inputValue.startsWith("+") && this.#selectedCountry && this.#getDialCode(inputValue)) {
|
|
3721
|
+
const cleanNumber = stripSeparateDialCode(
|
|
3722
|
+
inputValue,
|
|
3723
|
+
true,
|
|
3724
|
+
true,
|
|
3725
|
+
this.#selectedCountry
|
|
3726
|
+
);
|
|
3727
|
+
this.#setTelInputValue(cleanNumber);
|
|
3686
3728
|
}
|
|
3687
|
-
|
|
3688
|
-
|
|
3689
|
-
|
|
3690
|
-
|
|
3691
|
-
|
|
3692
|
-
if (this.#isAndroid && e?.data === "+" && separateDialCode && allowDropdown && countrySearch) {
|
|
3693
|
-
this.#removeJustTypedChar(inputValue);
|
|
3694
|
-
this.#openDropdownWithPlus();
|
|
3695
|
-
return;
|
|
3696
|
-
}
|
|
3697
|
-
if (this.#isAndroid && strictMode && (e?.data === " " || e?.data === "-" || e?.data === ".")) {
|
|
3698
|
-
const newCaretPos = this.#removeJustTypedChar(inputValue);
|
|
3699
|
-
this.#ui.telInputEl.setSelectionRange(newCaretPos, newCaretPos);
|
|
3700
|
-
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3701
|
-
source: "key",
|
|
3702
|
-
rejectedInput: e.data,
|
|
3703
|
-
reason: "invalid"
|
|
3704
|
-
});
|
|
3705
|
-
return;
|
|
3706
|
-
}
|
|
3707
|
-
if (this.#updateCountryFromNumber(inputValue)) {
|
|
3708
|
-
this.#dispatchCountryChangeEvent();
|
|
3709
|
-
}
|
|
3710
|
-
const isFormattingChar = e?.data && REGEX.NON_PLUS_NUMERIC.test(e.data);
|
|
3711
|
-
const isPaste = e?.inputType === INPUT_TYPES.PASTE && inputValue;
|
|
3712
|
-
if (isFormattingChar || isPaste && !strictMode) {
|
|
3713
|
-
userOverrideFormatting = true;
|
|
3714
|
-
} else if (!REGEX.NON_PLUS_NUMERIC.test(inputValue)) {
|
|
3715
|
-
userOverrideFormatting = false;
|
|
3716
|
-
}
|
|
3717
|
-
const isSetNumber = e?.detail && e.detail["isSetNumber"];
|
|
3718
|
-
const isAscii = this.#numerals.isAscii();
|
|
3719
|
-
if (formatAsYouType && !userOverrideFormatting && !isSetNumber && isAscii) {
|
|
3720
|
-
const currentCaretPos = this.#ui.telInputEl.selectionStart || 0;
|
|
3721
|
-
const valueBeforeCaret = inputValue.substring(0, currentCaretPos);
|
|
3722
|
-
const relevantCharsBeforeCaret = valueBeforeCaret.replace(
|
|
3723
|
-
REGEX.NON_PLUS_NUMERIC_GLOBAL,
|
|
3724
|
-
""
|
|
3725
|
-
).length;
|
|
3726
|
-
const isDeleteForwards = e?.inputType === INPUT_TYPES.DELETE_FORWARD;
|
|
3727
|
-
const fullNumber = this.#getFullNumber();
|
|
3728
|
-
const formattedValue = formatNumberAsYouType(
|
|
3729
|
-
fullNumber,
|
|
3730
|
-
inputValue,
|
|
3731
|
-
intlTelInput.utils,
|
|
3732
|
-
this.#selectedCountry,
|
|
3733
|
-
separateDialCode
|
|
3734
|
-
);
|
|
3735
|
-
const newCaretPos = computeNewCaretPosition(
|
|
3736
|
-
relevantCharsBeforeCaret,
|
|
3737
|
-
formattedValue,
|
|
3738
|
-
currentCaretPos,
|
|
3739
|
-
isDeleteForwards
|
|
3740
|
-
);
|
|
3741
|
-
this.#setTelInputValue(formattedValue);
|
|
3742
|
-
this.#ui.telInputEl.setSelectionRange(newCaretPos, newCaretPos);
|
|
3743
|
-
}
|
|
3744
|
-
if (separateDialCode && inputValue.startsWith("+") && this.#selectedCountry?.dialCode) {
|
|
3745
|
-
const cleanNumber = stripSeparateDialCode(
|
|
3746
|
-
inputValue,
|
|
3747
|
-
true,
|
|
3748
|
-
separateDialCode,
|
|
3749
|
-
this.#selectedCountry
|
|
3750
|
-
);
|
|
3751
|
-
this.#setTelInputValue(cleanNumber);
|
|
3752
|
-
}
|
|
3753
|
-
};
|
|
3729
|
+
}
|
|
3730
|
+
#bindInputListener() {
|
|
3731
|
+
this.#userOverrideFormatting = REGEX.ALPHA_UNICODE.test(
|
|
3732
|
+
this.#getTelInputValue()
|
|
3733
|
+
);
|
|
3754
3734
|
this.#ui.telInputEl.addEventListener(
|
|
3755
3735
|
"input",
|
|
3756
|
-
handleInputEvent,
|
|
3736
|
+
this.#handleInputEvent,
|
|
3757
3737
|
{
|
|
3758
3738
|
signal: this.#abortController.signal
|
|
3759
3739
|
}
|
|
3760
3740
|
);
|
|
3761
3741
|
}
|
|
3742
|
+
//* On input event: (1) Update selected country, (2) Format-as-you-type.
|
|
3743
|
+
//* Note that this fires AFTER the input is updated.
|
|
3744
|
+
#handleInputEvent = (e) => {
|
|
3745
|
+
const { strictMode, formatAsYouType, separateDialCode, allowDropdown, countrySearch } = this.#options;
|
|
3746
|
+
const detail = e?.detail;
|
|
3747
|
+
if (detail?.["isCountryChange"]) {
|
|
3748
|
+
return;
|
|
3749
|
+
}
|
|
3750
|
+
const inputValue = this.#getTelInputValue();
|
|
3751
|
+
if (this.#isAndroid && e?.data === "+" && separateDialCode && allowDropdown && countrySearch) {
|
|
3752
|
+
this.#handleAndroidPlusKey(inputValue);
|
|
3753
|
+
return;
|
|
3754
|
+
}
|
|
3755
|
+
if (this.#isAndroid && strictMode && (e?.data === " " || e?.data === "-" || e?.data === ".")) {
|
|
3756
|
+
this.#handleAndroidStrictReject(inputValue, e.data);
|
|
3757
|
+
return;
|
|
3758
|
+
}
|
|
3759
|
+
if (this.#updateCountryFromNumber(inputValue)) {
|
|
3760
|
+
this.#dispatchCountryChangeEvent();
|
|
3761
|
+
}
|
|
3762
|
+
const isFormattingChar = e?.data && REGEX.NON_PLUS_NUMERIC.test(e.data);
|
|
3763
|
+
const isPaste = e?.inputType === INPUT_TYPES.PASTE && inputValue;
|
|
3764
|
+
if (isFormattingChar || isPaste && !strictMode) {
|
|
3765
|
+
this.#userOverrideFormatting = true;
|
|
3766
|
+
} else if (!REGEX.NON_PLUS_NUMERIC.test(inputValue)) {
|
|
3767
|
+
this.#userOverrideFormatting = false;
|
|
3768
|
+
}
|
|
3769
|
+
if (formatAsYouType && !this.#userOverrideFormatting && !detail?.["isSetNumber"] && this.#numerals.isAscii()) {
|
|
3770
|
+
this.#formatAsYouType(
|
|
3771
|
+
inputValue,
|
|
3772
|
+
e?.inputType === INPUT_TYPES.DELETE_FORWARD
|
|
3773
|
+
);
|
|
3774
|
+
}
|
|
3775
|
+
if (separateDialCode) {
|
|
3776
|
+
this.#stripTypedDialCode(inputValue);
|
|
3777
|
+
}
|
|
3778
|
+
};
|
|
3762
3779
|
#bindKeydownListener() {
|
|
3763
|
-
const { strictMode, separateDialCode
|
|
3780
|
+
const { strictMode, separateDialCode } = this.#options;
|
|
3764
3781
|
if (!strictMode && !separateDialCode) {
|
|
3765
3782
|
return;
|
|
3766
3783
|
}
|
|
3767
|
-
|
|
3768
|
-
if (!e.key || e.key.length !== 1 || e.altKey || e.ctrlKey || e.metaKey) {
|
|
3769
|
-
return;
|
|
3770
|
-
}
|
|
3771
|
-
if (separateDialCode && allowDropdown && countrySearch && e.key === "+") {
|
|
3772
|
-
e.preventDefault();
|
|
3773
|
-
this.#openDropdownWithPlus();
|
|
3774
|
-
return;
|
|
3775
|
-
}
|
|
3776
|
-
if (!strictMode) {
|
|
3777
|
-
return;
|
|
3778
|
-
}
|
|
3779
|
-
const inputValue = this.#getTelInputValue();
|
|
3780
|
-
const alreadyHasPlus = inputValue.startsWith("+");
|
|
3781
|
-
const isInitialPlus = !alreadyHasPlus && this.#ui.telInputEl.selectionStart === 0 && e.key === "+";
|
|
3782
|
-
const normalisedKey = this.#numerals.normalise(e.key);
|
|
3783
|
-
const isNumeric = /^[0-9]$/.test(normalisedKey);
|
|
3784
|
-
const isAllowedChar = separateDialCode ? isNumeric : isInitialPlus || isNumeric;
|
|
3785
|
-
const input = this.#ui.telInputEl;
|
|
3786
|
-
const selStart = input.selectionStart;
|
|
3787
|
-
const selEnd = input.selectionEnd;
|
|
3788
|
-
const before = inputValue.slice(0, selStart ?? void 0);
|
|
3789
|
-
const after = inputValue.slice(selEnd ?? void 0);
|
|
3790
|
-
const newValue = before + normalisedKey + after;
|
|
3791
|
-
const newFullNumber = this.#buildFullNumber(newValue);
|
|
3792
|
-
let hasExceededMaxLength = false;
|
|
3793
|
-
if (intlTelInput.utils && this.#maxCoreNumberLength) {
|
|
3794
|
-
const coreNumber = intlTelInput.utils.getCoreNumber(
|
|
3795
|
-
newFullNumber,
|
|
3796
|
-
this.#selectedCountry?.iso2
|
|
3797
|
-
);
|
|
3798
|
-
hasExceededMaxLength = coreNumber.length > this.#maxCoreNumberLength;
|
|
3799
|
-
}
|
|
3800
|
-
const newCountry = this.#resolveCountryChangeFromNumber(newFullNumber);
|
|
3801
|
-
const isChangingDialCode = newCountry !== null;
|
|
3802
|
-
if (!isAllowedChar || hasExceededMaxLength && !isChangingDialCode && !isInitialPlus) {
|
|
3803
|
-
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3804
|
-
source: "key",
|
|
3805
|
-
rejectedInput: e.key,
|
|
3806
|
-
reason: !isAllowedChar ? "invalid" : "max-length"
|
|
3807
|
-
});
|
|
3808
|
-
e.preventDefault();
|
|
3809
|
-
}
|
|
3810
|
-
};
|
|
3811
|
-
this.#ui.telInputEl.addEventListener("keydown", handleKeydownEvent, {
|
|
3784
|
+
this.#ui.telInputEl.addEventListener("keydown", this.#handleKeydownEvent, {
|
|
3812
3785
|
signal: this.#abortController.signal
|
|
3813
3786
|
});
|
|
3814
3787
|
}
|
|
3788
|
+
//* On keydown event: (1) if strictMode then prevent invalid characters, (2) if separateDialCode then handle plus key
|
|
3789
|
+
//* Note that this fires BEFORE the input is updated.
|
|
3790
|
+
#handleKeydownEvent = (e) => {
|
|
3791
|
+
const { strictMode, separateDialCode, allowDropdown, countrySearch } = this.#options;
|
|
3792
|
+
if (!e.key || e.key.length !== 1 || e.altKey || e.ctrlKey || e.metaKey) {
|
|
3793
|
+
return;
|
|
3794
|
+
}
|
|
3795
|
+
if (separateDialCode && allowDropdown && countrySearch && e.key === "+") {
|
|
3796
|
+
e.preventDefault();
|
|
3797
|
+
this.#openDropdownWithPlus();
|
|
3798
|
+
return;
|
|
3799
|
+
}
|
|
3800
|
+
if (!strictMode) {
|
|
3801
|
+
return;
|
|
3802
|
+
}
|
|
3803
|
+
const inputValue = this.#getTelInputValue();
|
|
3804
|
+
const alreadyHasPlus = inputValue.startsWith("+");
|
|
3805
|
+
const isInitialPlus = !alreadyHasPlus && this.#ui.telInputEl.selectionStart === 0 && e.key === "+";
|
|
3806
|
+
const normalisedKey = this.#numerals.normalise(e.key);
|
|
3807
|
+
const isNumeric = /^[0-9]$/.test(normalisedKey);
|
|
3808
|
+
const isAllowedChar = separateDialCode ? isNumeric : isInitialPlus || isNumeric;
|
|
3809
|
+
const input = this.#ui.telInputEl;
|
|
3810
|
+
const selStart = input.selectionStart;
|
|
3811
|
+
const selEnd = input.selectionEnd;
|
|
3812
|
+
const before = inputValue.slice(0, selStart ?? void 0);
|
|
3813
|
+
const after = inputValue.slice(selEnd ?? void 0);
|
|
3814
|
+
const newValue = before + normalisedKey + after;
|
|
3815
|
+
const newFullNumber = this.#buildFullNumber(newValue);
|
|
3816
|
+
let hasExceededMaxLength = false;
|
|
3817
|
+
if (intlTelInput.utils && this.#maxCoreNumberLength) {
|
|
3818
|
+
const coreNumber = intlTelInput.utils.getCoreNumber(
|
|
3819
|
+
newFullNumber,
|
|
3820
|
+
this.#selectedCountry?.iso2
|
|
3821
|
+
);
|
|
3822
|
+
hasExceededMaxLength = coreNumber.length > this.#maxCoreNumberLength;
|
|
3823
|
+
}
|
|
3824
|
+
const newCountry = this.#resolveCountryChangeFromNumber(newFullNumber);
|
|
3825
|
+
const isChangingDialCode = newCountry !== null;
|
|
3826
|
+
if (!isAllowedChar || hasExceededMaxLength && !isChangingDialCode && !isInitialPlus) {
|
|
3827
|
+
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3828
|
+
source: "key",
|
|
3829
|
+
rejectedInput: e.key,
|
|
3830
|
+
reason: !isAllowedChar ? "invalid" : "max-length"
|
|
3831
|
+
});
|
|
3832
|
+
e.preventDefault();
|
|
3833
|
+
}
|
|
3834
|
+
};
|
|
3815
3835
|
#bindPasteListener() {
|
|
3816
3836
|
if (!this.#options.strictMode) {
|
|
3817
3837
|
return;
|
|
3818
3838
|
}
|
|
3819
|
-
|
|
3820
|
-
|
|
3821
|
-
|
|
3822
|
-
|
|
3823
|
-
|
|
3824
|
-
|
|
3825
|
-
|
|
3826
|
-
|
|
3827
|
-
|
|
3828
|
-
|
|
3829
|
-
|
|
3830
|
-
|
|
3831
|
-
|
|
3832
|
-
|
|
3833
|
-
|
|
3834
|
-
|
|
3835
|
-
|
|
3836
|
-
|
|
3837
|
-
|
|
3838
|
-
|
|
3839
|
-
|
|
3840
|
-
|
|
3841
|
-
|
|
3842
|
-
|
|
3843
|
-
|
|
3844
|
-
|
|
3839
|
+
this.#ui.telInputEl.addEventListener("paste", this.#handlePasteEvent, {
|
|
3840
|
+
signal: this.#abortController.signal
|
|
3841
|
+
});
|
|
3842
|
+
}
|
|
3843
|
+
#handlePasteEvent = (e) => {
|
|
3844
|
+
e.preventDefault();
|
|
3845
|
+
const input = this.#ui.telInputEl;
|
|
3846
|
+
const selStart = input.selectionStart;
|
|
3847
|
+
const selEnd = input.selectionEnd;
|
|
3848
|
+
const inputValue = this.#getTelInputValue();
|
|
3849
|
+
const before = inputValue.slice(0, selStart ?? void 0);
|
|
3850
|
+
const after = inputValue.slice(selEnd ?? void 0);
|
|
3851
|
+
const iso2 = this.#selectedCountry?.iso2;
|
|
3852
|
+
const pastedRaw = e.clipboardData.getData("text");
|
|
3853
|
+
const pasted = this.#numerals.normalise(pastedRaw);
|
|
3854
|
+
const initialCharSelected = selStart === 0 && selEnd > 0;
|
|
3855
|
+
const allowLeadingPlus = !inputValue.startsWith("+") || initialCharSelected;
|
|
3856
|
+
const allowedChars = pasted.replace(REGEX.NON_PLUS_NUMERIC_GLOBAL, "");
|
|
3857
|
+
const hasLeadingPlus = allowedChars.startsWith("+");
|
|
3858
|
+
const numerics = allowedChars.replace(/\+/g, "");
|
|
3859
|
+
const sanitised = hasLeadingPlus && allowLeadingPlus ? `+${numerics}` : numerics;
|
|
3860
|
+
let newValue = before + sanitised + after;
|
|
3861
|
+
let rejectReason = sanitised !== pasted ? "invalid" : null;
|
|
3862
|
+
if (newValue.length > 5 && intlTelInput.utils) {
|
|
3863
|
+
let coreNumber = intlTelInput.utils.getCoreNumber(newValue, iso2);
|
|
3864
|
+
while (coreNumber.length === 0 && newValue.length > 0) {
|
|
3865
|
+
newValue = newValue.slice(0, -1);
|
|
3866
|
+
coreNumber = intlTelInput.utils.getCoreNumber(newValue, iso2);
|
|
3867
|
+
}
|
|
3868
|
+
if (!coreNumber) {
|
|
3869
|
+
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3870
|
+
source: "paste",
|
|
3871
|
+
rejectedInput: pastedRaw,
|
|
3872
|
+
reason: "max-length"
|
|
3873
|
+
});
|
|
3874
|
+
return;
|
|
3875
|
+
}
|
|
3876
|
+
if (this.#maxCoreNumberLength && coreNumber.length > this.#maxCoreNumberLength) {
|
|
3877
|
+
if (input.selectionEnd === inputValue.length) {
|
|
3878
|
+
const trimLength = coreNumber.length - this.#maxCoreNumberLength;
|
|
3879
|
+
newValue = newValue.slice(0, newValue.length - trimLength);
|
|
3880
|
+
rejectReason = "max-length";
|
|
3881
|
+
} else {
|
|
3845
3882
|
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3846
3883
|
source: "paste",
|
|
3847
3884
|
rejectedInput: pastedRaw,
|
|
@@ -3849,37 +3886,20 @@ var Iti = class _Iti {
|
|
|
3849
3886
|
});
|
|
3850
3887
|
return;
|
|
3851
3888
|
}
|
|
3852
|
-
if (this.#maxCoreNumberLength && coreNumber.length > this.#maxCoreNumberLength) {
|
|
3853
|
-
if (input.selectionEnd === inputValue.length) {
|
|
3854
|
-
const trimLength = coreNumber.length - this.#maxCoreNumberLength;
|
|
3855
|
-
newValue = newValue.slice(0, newValue.length - trimLength);
|
|
3856
|
-
rejectReason = "max-length";
|
|
3857
|
-
} else {
|
|
3858
|
-
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3859
|
-
source: "paste",
|
|
3860
|
-
rejectedInput: pastedRaw,
|
|
3861
|
-
reason: "max-length"
|
|
3862
|
-
});
|
|
3863
|
-
return;
|
|
3864
|
-
}
|
|
3865
|
-
}
|
|
3866
3889
|
}
|
|
3867
|
-
|
|
3868
|
-
|
|
3869
|
-
|
|
3870
|
-
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
3877
|
-
}
|
|
3878
|
-
}
|
|
3879
|
-
|
|
3880
|
-
signal: this.#abortController.signal
|
|
3881
|
-
});
|
|
3882
|
-
}
|
|
3890
|
+
}
|
|
3891
|
+
this.#setTelInputValue(newValue);
|
|
3892
|
+
const caretPos = selStart + sanitised.length;
|
|
3893
|
+
input.setSelectionRange(caretPos, caretPos);
|
|
3894
|
+
input.dispatchEvent(new InputEvent("input", { bubbles: true }));
|
|
3895
|
+
if (rejectReason) {
|
|
3896
|
+
this.#dispatchEvent(EVENTS.STRICT_REJECT, {
|
|
3897
|
+
source: "paste",
|
|
3898
|
+
rejectedInput: pastedRaw,
|
|
3899
|
+
reason: rejectReason
|
|
3900
|
+
});
|
|
3901
|
+
}
|
|
3902
|
+
};
|
|
3883
3903
|
//* Adhere to the input's maxlength attr.
|
|
3884
3904
|
#truncateToMaxLength(number) {
|
|
3885
3905
|
const max = Number(this.#ui.telInputEl.getAttribute("maxlength"));
|
|
@@ -4521,7 +4541,7 @@ var intlTelInput = Object.assign(
|
|
|
4521
4541
|
attachUtils,
|
|
4522
4542
|
startedLoadingUtils: false,
|
|
4523
4543
|
startedLoadingAutoCountry: false,
|
|
4524
|
-
version: "27.
|
|
4544
|
+
version: "27.2.0"
|
|
4525
4545
|
}
|
|
4526
4546
|
);
|
|
4527
4547
|
var intlTelInput_default = intlTelInput;
|
|
@@ -10889,6 +10909,9 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
10889
10909
|
countryChange = new EventEmitter();
|
|
10890
10910
|
validityChange = new EventEmitter();
|
|
10891
10911
|
errorCodeChange = new EventEmitter();
|
|
10912
|
+
openCountryDropdown = new EventEmitter();
|
|
10913
|
+
closeCountryDropdown = new EventEmitter();
|
|
10914
|
+
strictReject = new EventEmitter();
|
|
10892
10915
|
blur = new EventEmitter();
|
|
10893
10916
|
focus = new EventEmitter();
|
|
10894
10917
|
keydown = new EventEmitter();
|
|
@@ -10903,6 +10926,8 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
10903
10926
|
lastEmittedErrorCode;
|
|
10904
10927
|
// writeValue may be called by Angular forms before utils has loaded; queue it until then
|
|
10905
10928
|
pendingWriteValue;
|
|
10929
|
+
// if an input event fires before utils has loaded, we defer the update until the promise resolves
|
|
10930
|
+
pendingUpdate = false;
|
|
10906
10931
|
// eslint-disable-next-line class-methods-use-this
|
|
10907
10932
|
onChange = () => {
|
|
10908
10933
|
};
|
|
@@ -10912,8 +10937,16 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
10912
10937
|
// eslint-disable-next-line class-methods-use-this
|
|
10913
10938
|
onValidatorChange = () => {
|
|
10914
10939
|
};
|
|
10940
|
+
handleOpenDropdown = () => this.openCountryDropdown.emit();
|
|
10941
|
+
handleCloseDropdown = () => this.closeCountryDropdown.emit();
|
|
10942
|
+
handleStrictReject = (e) => {
|
|
10943
|
+
this.strictReject.emit(e.detail);
|
|
10944
|
+
};
|
|
10915
10945
|
ngAfterViewInit() {
|
|
10916
10946
|
this.iti = intlTelInput_default(this.inputRef.nativeElement, this.buildInitOptions());
|
|
10947
|
+
this.inputRef.nativeElement.addEventListener("open:countrydropdown", this.handleOpenDropdown);
|
|
10948
|
+
this.inputRef.nativeElement.addEventListener("close:countrydropdown", this.handleCloseDropdown);
|
|
10949
|
+
this.inputRef.nativeElement.addEventListener("strict:reject", this.handleStrictReject);
|
|
10917
10950
|
this.applyInputAttrs();
|
|
10918
10951
|
if (this.disabled) {
|
|
10919
10952
|
this.iti.setDisabled(this.disabled);
|
|
@@ -10931,6 +10964,12 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
10931
10964
|
} else if (this.initialValue) {
|
|
10932
10965
|
this.iti.setNumber(this.initialValue);
|
|
10933
10966
|
}
|
|
10967
|
+
if (this.pendingUpdate) {
|
|
10968
|
+
this.pendingUpdate = false;
|
|
10969
|
+
this.handleInput();
|
|
10970
|
+
} else if (this.inputRef.nativeElement.value) {
|
|
10971
|
+
this.onValidatorChange();
|
|
10972
|
+
}
|
|
10934
10973
|
});
|
|
10935
10974
|
}
|
|
10936
10975
|
buildInitOptions() {
|
|
@@ -10982,6 +11021,10 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
10982
11021
|
if (!this.iti) {
|
|
10983
11022
|
return;
|
|
10984
11023
|
}
|
|
11024
|
+
if (!intlTelInput_default.utils) {
|
|
11025
|
+
this.pendingUpdate = true;
|
|
11026
|
+
return;
|
|
11027
|
+
}
|
|
10985
11028
|
const num = this.iti.getNumber() ?? "";
|
|
10986
11029
|
const countryIso = this.iti.getSelectedCountryData()?.iso2 ?? "";
|
|
10987
11030
|
let hasChanged = false;
|
|
@@ -11046,6 +11089,9 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
11046
11089
|
return this.inputRef.nativeElement;
|
|
11047
11090
|
}
|
|
11048
11091
|
ngOnDestroy() {
|
|
11092
|
+
this.inputRef.nativeElement.removeEventListener("open:countrydropdown", this.handleOpenDropdown);
|
|
11093
|
+
this.inputRef.nativeElement.removeEventListener("close:countrydropdown", this.handleCloseDropdown);
|
|
11094
|
+
this.inputRef.nativeElement.removeEventListener("strict:reject", this.handleStrictReject);
|
|
11049
11095
|
this.iti?.destroy();
|
|
11050
11096
|
}
|
|
11051
11097
|
ignoredInputAttrs = /* @__PURE__ */ new Set([
|
|
@@ -11096,7 +11142,7 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
11096
11142
|
}
|
|
11097
11143
|
// ============ Validator Implementation ============
|
|
11098
11144
|
validate(_control) {
|
|
11099
|
-
if (!this.iti || !this.iti.getNumber()) {
|
|
11145
|
+
if (!this.iti || !intlTelInput_default.utils || !this.iti.getNumber()) {
|
|
11100
11146
|
return null;
|
|
11101
11147
|
}
|
|
11102
11148
|
const isValid = this.usePreciseValidation ? this.iti.isValidNumberPrecise() : this.iti.isValidNumber();
|
|
@@ -11122,7 +11168,7 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
11122
11168
|
let _t;
|
|
11123
11169
|
i0.\u0275\u0275queryRefresh(_t = i0.\u0275\u0275loadQuery()) && (ctx.inputRef = _t.first);
|
|
11124
11170
|
}
|
|
11125
|
-
}, inputs: { initialValue: "initialValue", usePreciseValidation: "usePreciseValidation", inputAttributes: "inputAttributes", disabled: "disabled", readonly: "readonly", allowDropdown: "allowDropdown", allowedNumberTypes: "allowedNumberTypes", allowNumberExtensions: "allowNumberExtensions", allowPhonewords: "allowPhonewords", autoPlaceholder: "autoPlaceholder", containerClass: "containerClass", countryNameLocale: "countryNameLocale", countryOrder: "countryOrder", countrySearch: "countrySearch", customPlaceholder: "customPlaceholder", dropdownAlwaysOpen: "dropdownAlwaysOpen", dropdownContainer: "dropdownContainer", excludeCountries: "excludeCountries", fixDropdownWidth: "fixDropdownWidth", formatAsYouType: "formatAsYouType", formatOnDisplay: "formatOnDisplay", geoIpLookup: "geoIpLookup", hiddenInput: "hiddenInput", i18n: "i18n", initialCountry: "initialCountry", loadUtils: "loadUtils", nationalMode: "nationalMode", onlyCountries: "onlyCountries", placeholderNumberType: "placeholderNumberType", searchInputClass: "searchInputClass", separateDialCode: "separateDialCode", showFlags: "showFlags", strictMode: "strictMode", useFullscreenPopup: "useFullscreenPopup" }, outputs: { numberChange: "numberChange", countryChange: "countryChange", validityChange: "validityChange", errorCodeChange: "errorCodeChange", blur: "blur", focus: "focus", keydown: "keydown", keyup: "keyup", paste: "paste", click: "click" }, features: [i0.\u0275\u0275ProvidersFeature([
|
|
11171
|
+
}, inputs: { initialValue: "initialValue", usePreciseValidation: "usePreciseValidation", inputAttributes: "inputAttributes", disabled: "disabled", readonly: "readonly", allowDropdown: "allowDropdown", allowedNumberTypes: "allowedNumberTypes", allowNumberExtensions: "allowNumberExtensions", allowPhonewords: "allowPhonewords", autoPlaceholder: "autoPlaceholder", containerClass: "containerClass", countryNameLocale: "countryNameLocale", countryOrder: "countryOrder", countrySearch: "countrySearch", customPlaceholder: "customPlaceholder", dropdownAlwaysOpen: "dropdownAlwaysOpen", dropdownContainer: "dropdownContainer", excludeCountries: "excludeCountries", fixDropdownWidth: "fixDropdownWidth", formatAsYouType: "formatAsYouType", formatOnDisplay: "formatOnDisplay", geoIpLookup: "geoIpLookup", hiddenInput: "hiddenInput", i18n: "i18n", initialCountry: "initialCountry", loadUtils: "loadUtils", nationalMode: "nationalMode", onlyCountries: "onlyCountries", placeholderNumberType: "placeholderNumberType", searchInputClass: "searchInputClass", separateDialCode: "separateDialCode", showFlags: "showFlags", strictMode: "strictMode", useFullscreenPopup: "useFullscreenPopup" }, outputs: { numberChange: "numberChange", countryChange: "countryChange", validityChange: "validityChange", errorCodeChange: "errorCodeChange", openCountryDropdown: "openCountryDropdown", closeCountryDropdown: "closeCountryDropdown", strictReject: "strictReject", blur: "blur", focus: "focus", keydown: "keydown", keyup: "keyup", paste: "paste", click: "click" }, features: [i0.\u0275\u0275ProvidersFeature([
|
|
11126
11172
|
{
|
|
11127
11173
|
provide: NG_VALUE_ACCESSOR,
|
|
11128
11174
|
useExisting: forwardRef(() => _IntlTelInput),
|
|
@@ -11266,6 +11312,12 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
11266
11312
|
type: Output
|
|
11267
11313
|
}], errorCodeChange: [{
|
|
11268
11314
|
type: Output
|
|
11315
|
+
}], openCountryDropdown: [{
|
|
11316
|
+
type: Output
|
|
11317
|
+
}], closeCountryDropdown: [{
|
|
11318
|
+
type: Output
|
|
11319
|
+
}], strictReject: [{
|
|
11320
|
+
type: Output
|
|
11269
11321
|
}], blur: [{
|
|
11270
11322
|
type: Output
|
|
11271
11323
|
}], focus: [{
|
|
@@ -11281,7 +11333,7 @@ var IntlTelInput = class _IntlTelInput {
|
|
|
11281
11333
|
}] });
|
|
11282
11334
|
})();
|
|
11283
11335
|
(() => {
|
|
11284
|
-
(typeof ngDevMode === "undefined" || ngDevMode) && i0.\u0275setClassDebugInfo(IntlTelInput, { className: "IntlTelInput", filePath: "IntlTelInput.ts", lineNumber:
|
|
11336
|
+
(typeof ngDevMode === "undefined" || ngDevMode) && i0.\u0275setClassDebugInfo(IntlTelInput, { className: "IntlTelInput", filePath: "IntlTelInput.ts", lineNumber: 68 });
|
|
11285
11337
|
})();
|
|
11286
11338
|
var IntlTelInput_default = IntlTelInput;
|
|
11287
11339
|
|
package/dist/js/data.js
CHANGED
package/dist/js/data.min.js
CHANGED