lite-phone-input 0.3.0 → 0.4.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/README.md +30 -0
- package/dist/core/index.d.cts +1 -0
- package/dist/core/index.d.ts +1 -0
- package/dist/preact/index.cjs +19 -1
- package/dist/preact/index.cjs.map +1 -1
- package/dist/preact/index.d.cts +1 -0
- package/dist/preact/index.d.ts +1 -0
- package/dist/preact/index.js +19 -1
- package/dist/preact/index.js.map +1 -1
- package/dist/react/index.cjs +19 -1
- package/dist/react/index.cjs.map +1 -1
- package/dist/react/index.d.cts +1 -0
- package/dist/react/index.d.ts +1 -0
- package/dist/react/index.js +19 -1
- package/dist/react/index.js.map +1 -1
- package/dist/vanilla/index.cjs +17 -1
- package/dist/vanilla/index.cjs.map +1 -1
- package/dist/vanilla/index.d.cts +3 -0
- package/dist/vanilla/index.d.ts +3 -0
- package/dist/vanilla/index.global.js +17 -1
- package/dist/vanilla/index.global.js.map +1 -1
- package/dist/vanilla/index.js +17 -1
- package/dist/vanilla/index.js.map +1 -1
- package/package.json +1 -1
package/dist/preact/index.d.cts
CHANGED
|
@@ -46,6 +46,7 @@ interface PhoneInputOptions {
|
|
|
46
46
|
initialValue?: string;
|
|
47
47
|
containerClass?: string;
|
|
48
48
|
dropdownContainer?: HTMLElement;
|
|
49
|
+
geoIpLookup?: (callback: (countryCode: string | null) => void) => void;
|
|
49
50
|
onChange?: (e164: string, country: Country, validation: ValidationResult) => void;
|
|
50
51
|
onCountryChange?: (country: Country) => void;
|
|
51
52
|
onValidationChange?: (validation: ValidationResult) => void;
|
package/dist/preact/index.d.ts
CHANGED
|
@@ -46,6 +46,7 @@ interface PhoneInputOptions {
|
|
|
46
46
|
initialValue?: string;
|
|
47
47
|
containerClass?: string;
|
|
48
48
|
dropdownContainer?: HTMLElement;
|
|
49
|
+
geoIpLookup?: (callback: (countryCode: string | null) => void) => void;
|
|
49
50
|
onChange?: (e164: string, country: Country, validation: ValidationResult) => void;
|
|
50
51
|
onCountryChange?: (country: Country) => void;
|
|
51
52
|
onValidationChange?: (validation: ValidationResult) => void;
|
package/dist/preact/index.js
CHANGED
|
@@ -3275,6 +3275,7 @@ var PhoneInput = class _PhoneInput {
|
|
|
3275
3275
|
constructor(el, options) {
|
|
3276
3276
|
this.nationalDigits = "";
|
|
3277
3277
|
this.displayInternational = false;
|
|
3278
|
+
this.userHasInteracted = false;
|
|
3278
3279
|
this.lastValidation = null;
|
|
3279
3280
|
this.dropdown = null;
|
|
3280
3281
|
this.dialCodeEl = null;
|
|
@@ -3292,6 +3293,7 @@ var PhoneInput = class _PhoneInput {
|
|
|
3292
3293
|
if (this.opts.initialValue) {
|
|
3293
3294
|
this.setValueInternal(this.opts.initialValue, true);
|
|
3294
3295
|
}
|
|
3296
|
+
this.invokeGeoIpLookup();
|
|
3295
3297
|
}
|
|
3296
3298
|
}
|
|
3297
3299
|
get isNationalInput() {
|
|
@@ -3329,8 +3331,9 @@ var PhoneInput = class _PhoneInput {
|
|
|
3329
3331
|
return validatePhone(this.nationalDigits, this.selectedCountry);
|
|
3330
3332
|
}
|
|
3331
3333
|
setOptions(opts) {
|
|
3334
|
+
const { geoIpLookup: _, ...rest } = opts;
|
|
3332
3335
|
const prev = { ...this.opts };
|
|
3333
|
-
Object.assign(this.opts,
|
|
3336
|
+
Object.assign(this.opts, rest);
|
|
3334
3337
|
if (opts.allowedCountries !== void 0 || opts.excludedCountries !== void 0) {
|
|
3335
3338
|
this.countries = this.filterCountries(getAllCountries());
|
|
3336
3339
|
if (!this.countries.find((c) => c.code === this.selectedCountry.code)) {
|
|
@@ -3372,6 +3375,16 @@ var PhoneInput = class _PhoneInput {
|
|
|
3372
3375
|
}
|
|
3373
3376
|
this.el.innerHTML = "";
|
|
3374
3377
|
}
|
|
3378
|
+
invokeGeoIpLookup() {
|
|
3379
|
+
const lookup = this.opts.geoIpLookup;
|
|
3380
|
+
if (!lookup) return;
|
|
3381
|
+
this.opts.geoIpLookup = void 0;
|
|
3382
|
+
const signal = this.ac.signal;
|
|
3383
|
+
lookup((countryCode) => {
|
|
3384
|
+
if (signal.aborted || this.userHasInteracted || !countryCode) return;
|
|
3385
|
+
this.setCountry(countryCode);
|
|
3386
|
+
});
|
|
3387
|
+
}
|
|
3375
3388
|
// --- DOM Construction ---
|
|
3376
3389
|
buildDOM() {
|
|
3377
3390
|
this.containerEl = document.createElement("div");
|
|
@@ -3471,6 +3484,7 @@ var PhoneInput = class _PhoneInput {
|
|
|
3471
3484
|
this.inputEl.addEventListener("paste", (e) => this.handlePaste(e), { signal });
|
|
3472
3485
|
}
|
|
3473
3486
|
handleInput(e) {
|
|
3487
|
+
this.userHasInteracted = true;
|
|
3474
3488
|
if (this.opts.strict !== false && e.data === "+" && this.isNationalInput) {
|
|
3475
3489
|
this.inputEl.value = this.inputEl.value.replace("+", "");
|
|
3476
3490
|
}
|
|
@@ -3536,6 +3550,7 @@ var PhoneInput = class _PhoneInput {
|
|
|
3536
3550
|
}
|
|
3537
3551
|
}
|
|
3538
3552
|
handlePaste(e) {
|
|
3553
|
+
this.userHasInteracted = true;
|
|
3539
3554
|
e.preventDefault();
|
|
3540
3555
|
const text = e.clipboardData?.getData("text") ?? "";
|
|
3541
3556
|
if (!text) return;
|
|
@@ -3574,6 +3589,7 @@ var PhoneInput = class _PhoneInput {
|
|
|
3574
3589
|
// --- Dropdown ---
|
|
3575
3590
|
openDropdown() {
|
|
3576
3591
|
if (this.dropdown) return;
|
|
3592
|
+
this.userHasInteracted = true;
|
|
3577
3593
|
this.dropdown = new Dropdown({
|
|
3578
3594
|
countries: this.countries,
|
|
3579
3595
|
preferredCountries: this.opts.preferredCountries ?? [],
|
|
@@ -3831,6 +3847,7 @@ var WIDGET_KEYS = /* @__PURE__ */ new Set([
|
|
|
3831
3847
|
"initialValue",
|
|
3832
3848
|
"containerClass",
|
|
3833
3849
|
"dropdownContainer",
|
|
3850
|
+
"geoIpLookup",
|
|
3834
3851
|
"onChange",
|
|
3835
3852
|
"onCountryChange",
|
|
3836
3853
|
"onValidationChange",
|
|
@@ -3888,6 +3905,7 @@ var PhoneInput2 = forwardRef(
|
|
|
3888
3905
|
hiddenInput: p.hiddenInput,
|
|
3889
3906
|
containerClass: p.containerClass,
|
|
3890
3907
|
dropdownContainer: p.dropdownContainer,
|
|
3908
|
+
geoIpLookup: p.geoIpLookup,
|
|
3891
3909
|
initialValue: p.initialValue,
|
|
3892
3910
|
inputAttributes,
|
|
3893
3911
|
onChange: (e164, country, validation) => propsRef.current.onChange?.(e164, country, validation),
|