@input-kit/phone 0.1.2 → 0.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/README.md +69 -36
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +96 -12
- package/dist/index.d.ts +96 -12
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +9 -4
package/dist/index.d.ts
CHANGED
|
@@ -17,8 +17,64 @@ declare function localizeCountry(country: Country | undefined, locale?: string |
|
|
|
17
17
|
declare function localizeCountries(list: Country[], locale?: string | readonly string[]): Country[];
|
|
18
18
|
declare function getCountriesByDialCode(dialCode: string): Country[];
|
|
19
19
|
declare function getCountryByDialCode(dialCode: string): Country | undefined;
|
|
20
|
+
interface CountryOption {
|
|
21
|
+
value: string;
|
|
22
|
+
label: string;
|
|
23
|
+
dialCode: string;
|
|
24
|
+
flag: string;
|
|
25
|
+
}
|
|
26
|
+
interface GetCountryOptionsParams {
|
|
27
|
+
locale?: string | readonly string[];
|
|
28
|
+
preferredCountries?: string[];
|
|
29
|
+
excludeCountries?: string[];
|
|
30
|
+
onlyCountries?: string[];
|
|
31
|
+
}
|
|
32
|
+
declare function getCountryOptions(params?: GetCountryOptionsParams): CountryOption[];
|
|
20
33
|
declare function detectCountryFromPhone(phone: string): Country | undefined;
|
|
21
34
|
|
|
35
|
+
type MaybeCountry = Country | null | undefined;
|
|
36
|
+
type ValidationReason = 'required' | 'too_short' | 'too_long' | 'invalid' | null;
|
|
37
|
+
interface ValidationResult {
|
|
38
|
+
isValid: boolean;
|
|
39
|
+
reason: ValidationReason;
|
|
40
|
+
message: string | null;
|
|
41
|
+
error: string | null;
|
|
42
|
+
}
|
|
43
|
+
interface ParsedPhoneValue {
|
|
44
|
+
country: Country | undefined;
|
|
45
|
+
nationalNumber: string;
|
|
46
|
+
e164: string | undefined;
|
|
47
|
+
isValid: boolean;
|
|
48
|
+
}
|
|
49
|
+
declare function cleanPhone(phone: string): string;
|
|
50
|
+
declare function formatPhone(phone: string, country: MaybeCountry): string;
|
|
51
|
+
declare function unformatPhone(formattedPhone: string): string;
|
|
52
|
+
declare function validatePhoneLength(phone: string, country: MaybeCountry): boolean;
|
|
53
|
+
declare function validatePhone(phone: string, country: MaybeCountry, customValidator?: (phone: string, country: Country | undefined) => boolean): boolean;
|
|
54
|
+
declare function addDialCode(phone: string, country: MaybeCountry): string;
|
|
55
|
+
declare function removeDialCode(phone: string, country: MaybeCountry): string;
|
|
56
|
+
declare function filterCountries(countries: Country[], query: string, preferredCountries?: string[]): Country[];
|
|
57
|
+
declare function getCountryDisplayName(country: Country | undefined): string;
|
|
58
|
+
declare function getPlaceholder(country: MaybeCountry): string;
|
|
59
|
+
declare const stripNonDigits: typeof cleanPhone;
|
|
60
|
+
declare function isInternationalFormat(phone: string): boolean;
|
|
61
|
+
declare function extractDialCode(phone: string): {
|
|
62
|
+
dialCode: string | null;
|
|
63
|
+
nationalNumber: string;
|
|
64
|
+
};
|
|
65
|
+
declare function detectCountry(phone: string): Country | null;
|
|
66
|
+
declare function formatPhoneNumber(phone: string, country: MaybeCountry, format?: 'national' | 'international' | 'e164'): string;
|
|
67
|
+
declare function parseToE164(phone: string, country: MaybeCountry): string;
|
|
68
|
+
declare function getNationalNumber(phone: string, country?: MaybeCountry): string;
|
|
69
|
+
declare function validatePhoneNumber(phone: string, country?: MaybeCountry, required?: boolean, customValidator?: (phone: string, country: Country | undefined) => boolean): ValidationResult;
|
|
70
|
+
declare function parsePhoneValue(phone: string, country?: MaybeCountry): ParsedPhoneValue;
|
|
71
|
+
declare function isPhoneNumberComplete(phone: string, country?: MaybeCountry): boolean;
|
|
72
|
+
declare function formatAsYouType(phone: string, country: MaybeCountry): string;
|
|
73
|
+
declare const normalizePhoneNumber: typeof cleanPhone;
|
|
74
|
+
declare function phoneNumbersEqual(left: string, right: string): boolean;
|
|
75
|
+
declare function getCountryDisplayLabel(country: Country, includeDialCode?: boolean): string;
|
|
76
|
+
declare function limitInputLength(phone: string, country?: MaybeCountry): string;
|
|
77
|
+
|
|
22
78
|
interface PhoneInputLabels {
|
|
23
79
|
selectCountry: string;
|
|
24
80
|
countrySearchPlaceholder: string;
|
|
@@ -31,12 +87,17 @@ interface PhoneInputOptions {
|
|
|
31
87
|
defaultCountry?: string;
|
|
32
88
|
preferredCountries?: string[];
|
|
33
89
|
excludeCountries?: string[];
|
|
90
|
+
excludedCountries?: string[];
|
|
34
91
|
onlyCountries?: string[];
|
|
92
|
+
allowedCountries?: string[];
|
|
35
93
|
searchable?: boolean;
|
|
36
94
|
autoDetect?: boolean;
|
|
95
|
+
autoDetectCountry?: boolean;
|
|
37
96
|
formatOnType?: boolean;
|
|
38
97
|
includeDialCode?: boolean;
|
|
98
|
+
required?: boolean;
|
|
39
99
|
validator?: (phone: string, country: Country | undefined) => boolean;
|
|
100
|
+
onValidationChange?: (state: ValidationResult) => void;
|
|
40
101
|
locale?: string | readonly string[];
|
|
41
102
|
labels?: Partial<PhoneInputLabels>;
|
|
42
103
|
}
|
|
@@ -45,20 +106,28 @@ interface PhoneInputState {
|
|
|
45
106
|
fullPhone: string;
|
|
46
107
|
country: Country | undefined;
|
|
47
108
|
isValid: boolean;
|
|
109
|
+
validationReason: ValidationReason;
|
|
48
110
|
isOpen: boolean;
|
|
49
111
|
searchQuery: string;
|
|
50
112
|
labels: PhoneInputLabels;
|
|
51
113
|
}
|
|
52
114
|
interface PhoneInputActions {
|
|
53
115
|
setPhone: (phone: string) => void;
|
|
116
|
+
setValue: (phone: string) => void;
|
|
54
117
|
setCountry: (code: string) => void;
|
|
55
118
|
toggleDropdown: () => void;
|
|
119
|
+
toggle: () => void;
|
|
56
120
|
openDropdown: () => void;
|
|
121
|
+
open: () => void;
|
|
57
122
|
closeDropdown: () => void;
|
|
123
|
+
close: () => void;
|
|
58
124
|
setSearchQuery: (query: string) => void;
|
|
59
125
|
clear: () => void;
|
|
60
126
|
}
|
|
61
127
|
interface UsePhoneInputReturn extends PhoneInputState, PhoneInputActions {
|
|
128
|
+
value: string;
|
|
129
|
+
formattedValue: string;
|
|
130
|
+
error: string | null;
|
|
62
131
|
inputProps: InputHTMLAttributes<HTMLInputElement> & {
|
|
63
132
|
ref: RefObject<HTMLInputElement | null>;
|
|
64
133
|
};
|
|
@@ -68,13 +137,38 @@ interface UsePhoneInputReturn extends PhoneInputState, PhoneInputActions {
|
|
|
68
137
|
'aria-haspopup': 'listbox';
|
|
69
138
|
'aria-label': string;
|
|
70
139
|
};
|
|
140
|
+
countrySelectorProps: {
|
|
141
|
+
onClick: () => void;
|
|
142
|
+
'aria-expanded': boolean;
|
|
143
|
+
'aria-haspopup': 'listbox';
|
|
144
|
+
'aria-label': string;
|
|
145
|
+
};
|
|
146
|
+
dropdownProps: {
|
|
147
|
+
role: 'listbox';
|
|
148
|
+
'aria-label': string;
|
|
149
|
+
'aria-activedescendant'?: string;
|
|
150
|
+
};
|
|
71
151
|
filteredCountries: Country[];
|
|
152
|
+
countries: Country[];
|
|
72
153
|
selectCountry: (country: Country) => void;
|
|
154
|
+
getCountryOptionId: (code: string) => string;
|
|
155
|
+
getCountryOptionProps: (country: Country, index: number) => {
|
|
156
|
+
id: string;
|
|
157
|
+
role: 'option';
|
|
158
|
+
'aria-selected': boolean;
|
|
159
|
+
onClick: () => void;
|
|
160
|
+
onKeyDown: (event: {
|
|
161
|
+
key: string;
|
|
162
|
+
preventDefault: () => void;
|
|
163
|
+
}) => void;
|
|
164
|
+
tabIndex: number;
|
|
165
|
+
};
|
|
73
166
|
}
|
|
74
167
|
interface PhoneInputProps extends PhoneInputOptions {
|
|
75
168
|
value?: string;
|
|
76
169
|
defaultValue?: string;
|
|
77
170
|
onChange?: (phone: string, country: Country | undefined) => void;
|
|
171
|
+
onCountryChange?: (country: Country | undefined) => void;
|
|
78
172
|
onBlur?: () => void;
|
|
79
173
|
onFocus?: () => void;
|
|
80
174
|
containerClassName?: string;
|
|
@@ -94,6 +188,7 @@ declare function usePhoneInput(options?: PhoneInputOptions & {
|
|
|
94
188
|
value?: string;
|
|
95
189
|
defaultValue?: string;
|
|
96
190
|
onChange?: (phone: string, country: Country | undefined) => void;
|
|
191
|
+
onCountryChange?: (country: Country | undefined) => void;
|
|
97
192
|
onBlur?: () => void;
|
|
98
193
|
onFocus?: () => void;
|
|
99
194
|
}): UsePhoneInputReturn;
|
|
@@ -112,15 +207,4 @@ declare const PhoneInput: react.ForwardRefExoticComponent<PhoneInputProps & reac
|
|
|
112
207
|
declare const DEFAULT_PHONE_INPUT_LABELS: PhoneInputLabels;
|
|
113
208
|
declare function resolvePhoneInputLabels(locale?: string | readonly string[], overrides?: Partial<PhoneInputLabels>): PhoneInputLabels;
|
|
114
209
|
|
|
115
|
-
|
|
116
|
-
declare function formatPhone(phone: string, country: Country | undefined): string;
|
|
117
|
-
declare function unformatPhone(formattedPhone: string): string;
|
|
118
|
-
declare function validatePhoneLength(phone: string, country: Country | undefined): boolean;
|
|
119
|
-
declare function validatePhone(phone: string, country: Country | undefined, customValidator?: (phone: string, country: Country | undefined) => boolean): boolean;
|
|
120
|
-
declare function addDialCode(phone: string, country: Country | undefined): string;
|
|
121
|
-
declare function removeDialCode(phone: string, country: Country | undefined): string;
|
|
122
|
-
declare function filterCountries(countries: Country[], query: string, preferredCountries?: string[]): Country[];
|
|
123
|
-
declare function getCountryDisplayName(country: Country | undefined): string;
|
|
124
|
-
declare function getPlaceholder(country: Country | undefined): string;
|
|
125
|
-
|
|
126
|
-
export { type Country, DEFAULT_PHONE_INPUT_LABELS, PhoneInput, type PhoneInputActions, type PhoneInputLabels, type PhoneInputOptions, type PhoneInputProps, type PhoneInputRef, type PhoneInputState, type UsePhoneInputReturn, addDialCode, cleanPhone, countries, detectCountryFromPhone, filterCountries, formatPhone, getCountriesByDialCode, getCountryByCode, getCountryByDialCode, getCountryDisplayName, getLocalizedCountryName, getPlaceholder, localizeCountries, localizeCountry, removeDialCode, resolvePhoneInputLabels, unformatPhone, usePhoneInput, validatePhone, validatePhoneLength };
|
|
210
|
+
export { type Country, type CountryOption, DEFAULT_PHONE_INPUT_LABELS, type GetCountryOptionsParams, type ParsedPhoneValue, PhoneInput, type PhoneInputActions, type PhoneInputLabels, type PhoneInputOptions, type PhoneInputProps, type PhoneInputRef, type PhoneInputState, type UsePhoneInputReturn, type ValidationReason, type ValidationResult, addDialCode, cleanPhone, countries, detectCountry, detectCountryFromPhone, extractDialCode, filterCountries, formatAsYouType, formatPhone, formatPhoneNumber, getCountriesByDialCode, getCountryByCode, getCountryByDialCode, getCountryDisplayLabel, getCountryDisplayName, getCountryOptions, getLocalizedCountryName, getNationalNumber, getPlaceholder, isInternationalFormat, isPhoneNumberComplete, limitInputLength, localizeCountries, localizeCountry, normalizePhoneNumber, parsePhoneValue, parseToE164, phoneNumbersEqual, removeDialCode, resolvePhoneInputLabels, stripNonDigits, unformatPhone, usePhoneInput, validatePhone, validatePhoneLength, validatePhoneNumber };
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {forwardRef,useRef,useState,useId,useCallback,useEffect,useImperativeHandle,useMemo,useLayoutEffect}from'react';import {getCountries,getCountryCallingCode,getExampleNumber,parsePhoneNumberFromString,AsYouType,isValidPhoneNumber,isPossiblePhoneNumber,validatePhoneNumberLength}from'libphonenumber-js';import ke from'libphonenumber-js/mobile/examples';import Me from'world-countries';import {jsxs,Fragment,jsx}from'react/jsx-runtime';var Te=["US","GB","CA","AU","DE","FR","IT","ES","JP","CN","IN","BR","MX","KR","NL","CH","SE","AE","SG","ZA","NG","SA","TR","ID","PH","TH","VN","MY","NZ","AR"],We=new Set(getCountries());function $e(e,n){let t=e.startsWith("+")?e:`+${e}`,o=n.replace(/\D/g,"");return `${t}${o}`}function Ue(e){let n=e.idd?.root;if(!n)return [];let o=(e.idd?.suffixes?.length?e.idd.suffixes:[""]).map(a=>$e(n,a)).filter(a=>/^\+\d+$/.test(a));return Array.from(new Set(o))}function He(e){let n=getExampleNumber(e,ke);return n?n.formatNational().replace(/\d/g,"#"):void 0}function Ie(e){let n=Te.indexOf(e);return n===-1?Number.MAX_SAFE_INTEGER:n}var _e=Me.filter(e=>We.has(e.cca2)).map(e=>{let n=e.cca2,t=Ue(e),o=`+${getCountryCallingCode(n)}`;return !e.flag||t.length===0?null:{code:n,name:e.name.common,dialCode:o,dialCodes:t,flag:e.flag,format:He(n)}}).filter(e=>e!==null).sort((e,n)=>{let t=Ie(e.code)-Ie(n.code);return t!==0?t:e.name.localeCompare(n.name)}),T=_e,Ve=new Map(T.map(e=>[e.code,e])),Ge=T.reduce((e,n)=>{for(let t of n.dialCodes){let o=e.get(t)??[];o.push(n),e.set(t,o);}return e},new Map),Ke=T.flatMap(e=>e.dialCodes.map(n=>({dialCode:n,country:e}))).sort((e,n)=>n.dialCode.length-e.dialCode.length),Ae=new Map;function je(e){return Array.isArray(e)?[...e]:e?[e]:[]}function Qe(e){let n=je(e);if(n.length===0||typeof Intl>"u"||typeof Intl.DisplayNames>"u")return;let t=n.join("|"),o=Ae.get(t);if(o)return o;try{let a=new Intl.DisplayNames(n,{type:"region"});return Ae.set(t,a),a}catch{return}}function Ye(e){let n=e.replace(/\D/g,"");return n?`+${n}`:""}function K(e){return Ve.get(e.toUpperCase())}function Ne(e,n){return e?Qe(n)?.of(e.code)??e.displayName??e.name:void 0}function j(e,n){if(!e)return;let t=Ne(e,n);return t?{...e,displayName:t}:e}function de(e,n){return n?e.map(t=>j(t,n)??t):e}function xe(e){return Ge.get(Ye(e))??[]}function qe(e){return xe(e)[0]}function pe(e){let n=e.trim();if(!n)return;let t=n.startsWith("+")?`+${n.replace(/\D/g,"")}`:n.startsWith("00")?`+${n.slice(2).replace(/\D/g,"")}`:"";if(!t)return;let o=parsePhoneNumberFromString(t);return o?.country?K(o.country):Ke.find(a=>t.startsWith(a.dialCode))?.country}var fe={selectCountry:"Select country",countrySearchPlaceholder:"Search countries...",noCountriesFound:"No countries found",searchCountriesAriaLabel:"Search countries",countryOptionsAriaLabel:"Country options",countryButtonAriaLabel:"Open country selector"},Xe={en:fe,fr:{selectCountry:"Choisir un pays",countrySearchPlaceholder:"Rechercher un pays...",noCountriesFound:"Aucun pays trouv\xE9",searchCountriesAriaLabel:"Rechercher des pays",countryOptionsAriaLabel:"Options de pays",countryButtonAriaLabel:"Ouvrir le s\xE9lecteur de pays"},de:{selectCountry:"Land ausw\xE4hlen",countrySearchPlaceholder:"Land suchen...",noCountriesFound:"Keine L\xE4nder gefunden",searchCountriesAriaLabel:"L\xE4nder suchen",countryOptionsAriaLabel:"L\xE4nderoptionen",countryButtonAriaLabel:"L\xE4nderauswahl \xF6ffnen"},es:{selectCountry:"Seleccionar pa\xEDs",countrySearchPlaceholder:"Buscar pa\xEDs...",noCountriesFound:"No se encontraron pa\xEDses",searchCountriesAriaLabel:"Buscar pa\xEDses",countryOptionsAriaLabel:"Opciones de pa\xEDs",countryButtonAriaLabel:"Abrir selector de pa\xEDs"},pt:{selectCountry:"Selecionar pa\xEDs",countrySearchPlaceholder:"Pesquisar pa\xEDs...",noCountriesFound:"Nenhum pa\xEDs encontrado",searchCountriesAriaLabel:"Pesquisar pa\xEDses",countryOptionsAriaLabel:"Op\xE7\xF5es de pa\xEDs",countryButtonAriaLabel:"Abrir seletor de pa\xEDs"},it:{selectCountry:"Seleziona paese",countrySearchPlaceholder:"Cerca paese...",noCountriesFound:"Nessun paese trovato",searchCountriesAriaLabel:"Cerca paesi",countryOptionsAriaLabel:"Opzioni paese",countryButtonAriaLabel:"Apri selettore paese"},ja:{selectCountry:"\u56FD\u3092\u9078\u629E",countrySearchPlaceholder:"\u56FD\u3092\u691C\u7D22...",noCountriesFound:"\u56FD\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093",searchCountriesAriaLabel:"\u56FD\u3092\u691C\u7D22",countryOptionsAriaLabel:"\u56FD\u306E\u5019\u88DC",countryButtonAriaLabel:"\u56FD\u306E\u30BB\u30EC\u30AF\u30BF\u30FC\u3092\u958B\u304F"},ko:{selectCountry:"\uAD6D\uAC00 \uC120\uD0DD",countrySearchPlaceholder:"\uAD6D\uAC00 \uAC80\uC0C9...",noCountriesFound:"\uAD6D\uAC00\uB97C \uCC3E\uC744 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4",searchCountriesAriaLabel:"\uAD6D\uAC00 \uAC80\uC0C9",countryOptionsAriaLabel:"\uAD6D\uAC00 \uC635\uC158",countryButtonAriaLabel:"\uAD6D\uAC00 \uC120\uD0DD\uAE30 \uC5F4\uAE30"},zh:{selectCountry:"\u9009\u62E9\u56FD\u5BB6",countrySearchPlaceholder:"\u641C\u7D22\u56FD\u5BB6...",noCountriesFound:"\u672A\u627E\u5230\u56FD\u5BB6",searchCountriesAriaLabel:"\u641C\u7D22\u56FD\u5BB6",countryOptionsAriaLabel:"\u56FD\u5BB6\u9009\u9879",countryButtonAriaLabel:"\u6253\u5F00\u56FD\u5BB6\u9009\u62E9\u5668"},ar:{selectCountry:"\u0627\u062E\u062A\u0631 \u0627\u0644\u062F\u0648\u0644\u0629",countrySearchPlaceholder:"\u0627\u0628\u062D\u062B \u0639\u0646 \u062F\u0648\u0644\u0629...",noCountriesFound:"\u0644\u0645 \u064A\u062A\u0645 \u0627\u0644\u0639\u062B\u0648\u0631 \u0639\u0644\u0649 \u062F\u0648\u0644",searchCountriesAriaLabel:"\u0627\u0628\u062D\u062B \u0639\u0646 \u0627\u0644\u062F\u0648\u0644",countryOptionsAriaLabel:"\u062E\u064A\u0627\u0631\u0627\u062A \u0627\u0644\u062F\u0648\u0644",countryButtonAriaLabel:"\u0627\u0641\u062A\u062D \u0645\u062D\u062F\u062F \u0627\u0644\u062F\u0648\u0644\u0629"},hi:{selectCountry:"\u0926\u0947\u0936 \u091A\u0941\u0928\u0947\u0902",countrySearchPlaceholder:"\u0926\u0947\u0936 \u0916\u094B\u091C\u0947\u0902...",noCountriesFound:"\u0915\u094B\u0908 \u0926\u0947\u0936 \u0928\u0939\u0940\u0902 \u092E\u093F\u0932\u093E",searchCountriesAriaLabel:"\u0926\u0947\u0936 \u0916\u094B\u091C\u0947\u0902",countryOptionsAriaLabel:"\u0926\u0947\u0936 \u0935\u093F\u0915\u0932\u094D\u092A",countryButtonAriaLabel:"\u0926\u0947\u0936 \u091A\u092F\u0928 \u0916\u094B\u0932\u0947\u0902"}};function Ze(e){let t=(Array.isArray(e)?e:e?[e]:[]).find(Boolean);return t?t.toLowerCase().split("-")[0]:void 0}function Ce(e,n){let t=Ze(e),o=t?Xe[t]:void 0;return {...fe,...o,...n}}function W(e){let n=e.trim(),t=w(n);return n.startsWith("+")&&!t?"+":t?n.startsWith("+")?`+${t}`:t:""}function ye(e){return e?.code}function w(e){return e.replace(/\D/g,"")}function he(e,n){return e&&new AsYouType(ye(n)).input(W(e))}function ne(e){return W(e)}function nn(e,n){return !e||!n?false:e.trim().startsWith("+")?validatePhoneNumberLength(W(e))===void 0:validatePhoneNumberLength(w(e),ye(n))===void 0}function ge(e,n,t){if(!e)return false;if(t)return t(e,n);let o=W(e),a=ye(n);return a?o.startsWith("+")?isValidPhoneNumber(o):isValidPhoneNumber(w(o),a):isPossiblePhoneNumber(o.startsWith("+")?o:`+${w(o)}`)}function $(e,n){if(!n)return e;let t=W(e);if(!t||t==="+")return "";if(t.startsWith("+"))return t;let o=w(t);return n.dialCodes.find(d=>o.startsWith(d.replace("+","")))?`+${o}`:`${n.dialCode}${o}`}function te(e,n){if(!n)return e;let t=W(e),o=w(t);for(let a of n.dialCodes){let d=a.replace("+","");if(o.startsWith(d))return o.slice(d.length)}return o}function me(e,n,t){let o=n.toLowerCase().trim();return o?e.filter(a=>a.name.toLowerCase().includes(o)||(a.displayName??"").toLowerCase().includes(o)||a.code.toLowerCase().includes(o)||a.dialCodes.some(d=>d.includes(o))):t?.length?[...e].sort((a,d)=>{let P=t.indexOf(a.code),N=t.indexOf(d.code);return P!==-1&&N!==-1?P-N:P!==-1?-1:N!==-1?1:(a.displayName??a.name).localeCompare(d.displayName??d.name)}):e}function be(e){return e?.displayName??e?.name??""}function Pe(e){return e?.format?e.format.replace(/#/g,"0"):e?.dialCode?`${e.dialCode} 000 000 0000`:"Phone number"}function on(e,n){return e.slice(0,n).replace(/\D/g,"").length}function rn(e,n){if(n<=0)return e.startsWith("+")?1:0;let t=0;for(let o=0;o<e.length;o+=1)if(/\d/.test(e[o])&&(t+=1,t===n))return o+1;return e.length}function Le(e={}){let{value:n,defaultValue:t="",onChange:o,onBlur:a,onFocus:d,defaultCountry:P="US",preferredCountries:N,excludeCountries:H,onlyCountries:_,autoDetect:Y=true,formatOnType:q=true,includeDialCode:p=false,validator:O,locale:m,labels:X}=e,v=n!==void 0,Z=useRef(null),V=useRef(null),y=useMemo(()=>{let r=T;return _?.length&&(r=r.filter(i=>_.includes(i.code))),H?.length&&(r=r.filter(i=>!H.includes(i.code))),r},[_,H]),R=useMemo(()=>de(y,m),[y,m]),E=useMemo(()=>Ce(m,X),[m,X]),B=y.find(r=>r.code===P)||y[0],[L,F]=useState(t),[s,z]=useState(B),[h,f]=useState(false),[k,M]=useState(""),u=v?n:L;useEffect(()=>{let r=y.find(i=>i.code===P)||y[0];r&&r.code!==s?.code&&z(r);},[P,y,s?.code]),useEffect(()=>{if(Y&&u){let r=pe(u);r&&y.some(i=>i.code===r.code)&&r.code!==s?.code&&z(r);}},[y,Y,u,s?.code]);let G=useMemo(()=>q?he(p&&u.startsWith("+")?te(u,s):u,s):p&&u.startsWith("+")?te(u,s):u,[q,p,u,s]),re=useMemo(()=>p&&s?$(u,s):u,[u,s,p]),S=useMemo(()=>ge(u,s,O),[u,s,O]),ie=useMemo(()=>j(s,m),[s,m]),ae=useMemo(()=>me(R,k,N),[R,k,N]),C=useCallback(r=>j(r,m),[m]);useLayoutEffect(()=>{let r=V.current,i=Z.current;if(r===null||!i||typeof i.setSelectionRange!="function"||typeof document<"u"&&document.activeElement!==i)return;let ee=rn(G,r);i.setSelectionRange(ee,ee),V.current=null;},[G]);let I=useCallback(r=>{let i=ne(r);v||F(i),o?.(p?$(i,s):i,C(s));},[v,o,s,p,C]),x=useCallback(r=>{let i=K(r);i&&(z(i),o?.(p?$(u,i):u,C(i)));},[u,o,p,C]),se=useCallback(r=>{let i=K(r.code)??r;z(i),f(false),M(""),o?.(p?$(u,i):u,C(i));},[u,o,p,C]),J=useCallback(()=>{f(r=>!r),h&&M("");},[h]),ue=useCallback(()=>{f(true);},[]),le=useCallback(()=>{f(false),M("");},[]),ce=useCallback(()=>{v||F(""),o?.("",C(s));},[v,o,s,C]),l=useCallback(r=>{let i=r.target.value,ee=r.target.selectionStart??i.length,Oe=i.trim().startsWith("+")?`+${i.replace(/\D/g,"")}`:ne(i);V.current=on(i,ee),I(Oe);},[I]),A=useCallback(()=>{d?.();},[d]),b=useCallback(()=>{a?.();},[a]);return {phone:u,fullPhone:re,country:ie,isValid:S,isOpen:h,searchQuery:k,labels:E,setPhone:I,setCountry:x,toggleDropdown:J,openDropdown:ue,closeDropdown:le,setSearchQuery:M,clear:ce,inputProps:{ref:Z,value:G,onChange:l,onFocus:A,onBlur:b,type:"tel",inputMode:"tel",autoComplete:"tel",placeholder:Pe(s),"aria-invalid":u?!S:void 0},countryButtonProps:{onClick:J,"aria-expanded":h,"aria-haspopup":"listbox","aria-label":E.countryButtonAriaLabel},filteredCountries:ae,selectCountry:se}}var dn=({size:e=12})=>jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:jsx("polyline",{points:"18 15 12 9 6 15"})}),pn=({size:e=12})=>jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:jsx("polyline",{points:"6 9 12 15 18 9"})}),fn=forwardRef(function(n,t){let{value:o,defaultValue:a,onChange:d,onBlur:P,onFocus:N,inputClassName:H,selectorClassName:_,containerClassName:Y,searchable:q=true,placeholder:p,disabled:O,readOnly:m,name:X,id:v,"aria-label":Z,"aria-labelledby":V,...y}=n,R=useRef(null),E=useRef([]),[B,L]=useState(0),F=useId(),{inputProps:s,countryButtonProps:z,country:h,filteredCountries:f,isOpen:k,isValid:M,searchQuery:u,setSearchQuery:G,setCountry:re,selectCountry:S,clear:ie,openDropdown:ae,closeDropdown:C,labels:I}=Le({value:o,defaultValue:a,onChange:d,onBlur:P,onFocus:N,...y}),x=s.ref,se=useCallback(l=>{R.current=l,typeof x=="function"?x(l):x&&"current"in x&&(x.current=l);},[x]),J=useCallback(()=>{R.current?.focus();},[]),ue=useCallback(()=>{R.current?.blur();},[]),le=useCallback(l=>{S(l),L(0);},[S]),ce=useCallback((l,A,b)=>{switch(l.key){case "Enter":case " ":l.preventDefault(),S(A),L(0);break;case "ArrowDown":if(l.preventDefault(),b<f.length-1){let r=b+1;L(r),E.current[r]?.focus();}break;case "ArrowUp":if(l.preventDefault(),b>0){let r=b-1;L(r),E.current[r]?.focus();}break;case "Escape":l.preventDefault(),C();break}},[S,f.length,C]);return useEffect(()=>{if(f.length===0){B!==0&&L(0);return}B>=f.length&&L(f.length-1);},[f.length,B]),useImperativeHandle(t,()=>({focus:J,blur:ue,clear:ie,setCountry:re,getCountry:()=>h,open:ae,close:C})),jsxs("div",{className:Y,"data-valid":M,children:[jsxs("button",{...z,type:"button",className:_,disabled:O,tabIndex:O?-1:0,"aria-controls":F,children:[h?jsxs(Fragment,{children:[jsx("span",{className:"phone-input-flag",children:h.flag}),jsx("span",{className:"phone-input-dial-code",children:h.dialCode})]}):jsx("span",{className:"phone-input-placeholder",children:I.selectCountry}),jsx("span",{className:"phone-input-arrow","aria-hidden":"true",children:k?jsx(dn,{size:12}):jsx(pn,{size:12})})]}),jsx("input",{...s,ref:se,id:v,name:X,className:H,placeholder:p||s.placeholder,disabled:O,readOnly:m,"aria-label":Z,"aria-labelledby":V}),k&&jsxs("div",{className:"phone-input-dropdown",children:[q&&jsx("div",{className:"phone-input-search",children:jsx("input",{type:"text",value:u,onChange:l=>G(l.target.value),placeholder:I.countrySearchPlaceholder,autoFocus:true,"aria-controls":F,"aria-label":I.searchCountriesAriaLabel})}),jsxs("ul",{className:"phone-input-country-list",id:F,role:"listbox","aria-label":I.countryOptionsAriaLabel,children:[f.map((l,A)=>jsxs("li",{ref:b=>{E.current[A]=b;},role:"option","aria-selected":l.code===h?.code,className:`phone-input-country-option ${l.code===h?.code?"selected":""} ${A===B?"highlighted":""}`,onClick:()=>le(l),onKeyDown:b=>ce(b,l,A),onMouseEnter:()=>L(A),tabIndex:A===B?0:-1,children:[jsx("span",{className:"phone-input-flag",children:l.flag}),jsx("span",{className:"phone-input-country-name",children:be(l)}),jsx("span",{className:"phone-input-dial-code",children:l.dialCode})]},l.code)),f.length===0&&jsx("li",{className:"phone-input-no-results",children:I.noCountriesFound})]})]})]})});export{fe as DEFAULT_PHONE_INPUT_LABELS,fn as PhoneInput,$ as addDialCode,w as cleanPhone,T as countries,pe as detectCountryFromPhone,me as filterCountries,he as formatPhone,xe as getCountriesByDialCode,K as getCountryByCode,qe as getCountryByDialCode,be as getCountryDisplayName,Ne as getLocalizedCountryName,Pe as getPlaceholder,de as localizeCountries,j as localizeCountry,te as removeDialCode,Ce as resolvePhoneInputLabels,ne as unformatPhone,Le as usePhoneInput,ge as validatePhone,nn as validatePhoneLength};//# sourceMappingURL=index.js.map
|
|
1
|
+
import {forwardRef,useRef,useState,useId,useCallback,useEffect,useImperativeHandle,useMemo,useLayoutEffect}from'react';import {getCountries,getCountryCallingCode,getExampleNumber,parsePhoneNumberFromString,AsYouType,isValidPhoneNumber,isPossiblePhoneNumber,validatePhoneNumberLength}from'libphonenumber-js';import rn from'libphonenumber-js/mobile/examples';import on from'world-countries';import {jsxs,Fragment,jsx}from'react/jsx-runtime';var an=["US","GB","CA","AU","DE","FR","IT","ES","JP","CN","IN","BR","MX","KR","NL","CH","SE","AE","SG","ZA","NG","SA","TR","ID","PH","TH","VN","MY","NZ","AR"],sn=new Set(getCountries()),un=new Map(on.map(e=>[e.cca2,e])),ln={AC:{name:"Ascension Island",dialCode:"+247"},TA:{name:"Tristan da Cunha",dialCode:"+290"},BQ:{name:"Caribbean Netherlands",dialCode:"+599"}};function dn(e,n){let t=e.startsWith("+")?e:`+${e}`,r=n.replace(/\D/g,"");return `${t}${r}`}function cn(e){return e.toUpperCase().replace(/./g,n=>String.fromCodePoint(127397+n.charCodeAt(0)))}function pn(e,n){let t=e?.idd?.root;if(!t)return [n];let o=(e.idd?.suffixes?.length?e.idd.suffixes:[""]).map(s=>dn(t,s)).filter(s=>/^\+\d+$/.test(s));return Array.from(new Set([n,...o.length?o:[]]))}function fn(e){let n=getExampleNumber(e,rn);return n?n.formatNational().replace(/\d/g,"#"):void 0}function Ve(e){let n=an.indexOf(e);return n===-1?Number.MAX_SAFE_INTEGER:n}var Cn=Array.from(sn).map(e=>{let n=un.get(e),t=ln[e],r=t?.dialCode??`+${getCountryCallingCode(e)}`,o=pn(n,r);return {code:e,name:n?.name.common??t?.name??e,dialCode:r,dialCodes:o,flag:n?.flag||t?.flag||cn(e),format:fn(e)}}).sort((e,n)=>{let t=Ve(e.code)-Ve(n.code);return t!==0?t:e.name.localeCompare(n.name)}),S=Cn,gn=new Map(S.map(e=>[e.code,e])),yn=S.reduce((e,n)=>{for(let t of n.dialCodes){let r=e.get(t)??[];r.push(n),e.set(t,r);}return e},new Map),mn=S.flatMap(e=>e.dialCodes.map(n=>({dialCode:n,country:e}))).sort((e,n)=>n.dialCode.length-e.dialCode.length),$e=new Map;function hn(e){return Array.isArray(e)?[...e]:e?[e]:[]}function bn(e){let n=hn(e);if(n.length===0||typeof Intl>"u"||typeof Intl.DisplayNames>"u")return;let t=n.join("|"),r=$e.get(t);if(r)return r;try{let o=new Intl.DisplayNames(n,{type:"region"});return $e.set(t,o),o}catch{return}}function Pn(e){let n=e.replace(/\D/g,"");return n?`+${n}`:""}function T(e){return gn.get(e.toUpperCase())}function ke(e,n){return e?bn(n)?.of(e.code)??e.displayName??e.name:void 0}function Z(e,n){if(!e)return;let t=ke(e,n);return t?{...e,displayName:t}:e}function le(e,n){return n?e.map(t=>Z(t,n)??t):e}function ze(e){return yn.get(Pn(e))??[]}function Ln(e){return ze(e)[0]}function xn(e={}){let n=S;if(e.onlyCountries?.length){let t=new Set(e.onlyCountries.map(r=>r.toUpperCase()));n=n.filter(r=>t.has(r.code));}if(e.excludeCountries?.length){let t=new Set(e.excludeCountries.map(r=>r.toUpperCase()));n=n.filter(r=>!t.has(r.code));}if(n=le(n,e.locale),e.preferredCountries?.length){let t=e.preferredCountries.map(r=>r.toUpperCase());n=[...n].sort((r,o)=>{let s=t.indexOf(r.code),c=t.indexOf(o.code);return s!==-1&&c!==-1?s-c:s!==-1?-1:c!==-1?1:(r.displayName??r.name).localeCompare(o.displayName??o.name)});}return n.map(t=>({value:t.code,label:`${t.displayName??t.name} (${t.dialCode})`,dialCode:t.dialCode,flag:t.flag}))}function q(e){let n=e.trim();if(!n)return;let t=n.startsWith("+")?`+${n.replace(/\D/g,"")}`:n.startsWith("00")?`+${n.slice(2).replace(/\D/g,"")}`:"";if(!t)return;let r=parsePhoneNumberFromString(t);return r?.country?T(r.country):mn.find(o=>t.startsWith(o.dialCode))?.country}var De={selectCountry:"Select country",countrySearchPlaceholder:"Search countries...",noCountriesFound:"No countries found",searchCountriesAriaLabel:"Search countries",countryOptionsAriaLabel:"Country options",countryButtonAriaLabel:"Open country selector"},Nn={en:De,fr:{selectCountry:"Choisir un pays",countrySearchPlaceholder:"Rechercher un pays...",noCountriesFound:"Aucun pays trouv\xE9",searchCountriesAriaLabel:"Rechercher des pays",countryOptionsAriaLabel:"Options de pays",countryButtonAriaLabel:"Ouvrir le s\xE9lecteur de pays"},de:{selectCountry:"Land ausw\xE4hlen",countrySearchPlaceholder:"Land suchen...",noCountriesFound:"Keine L\xE4nder gefunden",searchCountriesAriaLabel:"L\xE4nder suchen",countryOptionsAriaLabel:"L\xE4nderoptionen",countryButtonAriaLabel:"L\xE4nderauswahl \xF6ffnen"},es:{selectCountry:"Seleccionar pa\xEDs",countrySearchPlaceholder:"Buscar pa\xEDs...",noCountriesFound:"No se encontraron pa\xEDses",searchCountriesAriaLabel:"Buscar pa\xEDses",countryOptionsAriaLabel:"Opciones de pa\xEDs",countryButtonAriaLabel:"Abrir selector de pa\xEDs"},pt:{selectCountry:"Selecionar pa\xEDs",countrySearchPlaceholder:"Pesquisar pa\xEDs...",noCountriesFound:"Nenhum pa\xEDs encontrado",searchCountriesAriaLabel:"Pesquisar pa\xEDses",countryOptionsAriaLabel:"Op\xE7\xF5es de pa\xEDs",countryButtonAriaLabel:"Abrir seletor de pa\xEDs"},it:{selectCountry:"Seleziona paese",countrySearchPlaceholder:"Cerca paese...",noCountriesFound:"Nessun paese trovato",searchCountriesAriaLabel:"Cerca paesi",countryOptionsAriaLabel:"Opzioni paese",countryButtonAriaLabel:"Apri selettore paese"},ja:{selectCountry:"\u56FD\u3092\u9078\u629E",countrySearchPlaceholder:"\u56FD\u3092\u691C\u7D22...",noCountriesFound:"\u56FD\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093",searchCountriesAriaLabel:"\u56FD\u3092\u691C\u7D22",countryOptionsAriaLabel:"\u56FD\u306E\u5019\u88DC",countryButtonAriaLabel:"\u56FD\u306E\u30BB\u30EC\u30AF\u30BF\u30FC\u3092\u958B\u304F"},ko:{selectCountry:"\uAD6D\uAC00 \uC120\uD0DD",countrySearchPlaceholder:"\uAD6D\uAC00 \uAC80\uC0C9...",noCountriesFound:"\uAD6D\uAC00\uB97C \uCC3E\uC744 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4",searchCountriesAriaLabel:"\uAD6D\uAC00 \uAC80\uC0C9",countryOptionsAriaLabel:"\uAD6D\uAC00 \uC635\uC158",countryButtonAriaLabel:"\uAD6D\uAC00 \uC120\uD0DD\uAE30 \uC5F4\uAE30"},zh:{selectCountry:"\u9009\u62E9\u56FD\u5BB6",countrySearchPlaceholder:"\u641C\u7D22\u56FD\u5BB6...",noCountriesFound:"\u672A\u627E\u5230\u56FD\u5BB6",searchCountriesAriaLabel:"\u641C\u7D22\u56FD\u5BB6",countryOptionsAriaLabel:"\u56FD\u5BB6\u9009\u9879",countryButtonAriaLabel:"\u6253\u5F00\u56FD\u5BB6\u9009\u62E9\u5668"},ar:{selectCountry:"\u0627\u062E\u062A\u0631 \u0627\u0644\u062F\u0648\u0644\u0629",countrySearchPlaceholder:"\u0627\u0628\u062D\u062B \u0639\u0646 \u062F\u0648\u0644\u0629...",noCountriesFound:"\u0644\u0645 \u064A\u062A\u0645 \u0627\u0644\u0639\u062B\u0648\u0631 \u0639\u0644\u0649 \u062F\u0648\u0644",searchCountriesAriaLabel:"\u0627\u0628\u062D\u062B \u0639\u0646 \u0627\u0644\u062F\u0648\u0644",countryOptionsAriaLabel:"\u062E\u064A\u0627\u0631\u0627\u062A \u0627\u0644\u062F\u0648\u0644",countryButtonAriaLabel:"\u0627\u0641\u062A\u062D \u0645\u062D\u062F\u062F \u0627\u0644\u062F\u0648\u0644\u0629"},hi:{selectCountry:"\u0926\u0947\u0936 \u091A\u0941\u0928\u0947\u0902",countrySearchPlaceholder:"\u0926\u0947\u0936 \u0916\u094B\u091C\u0947\u0902...",noCountriesFound:"\u0915\u094B\u0908 \u0926\u0947\u0936 \u0928\u0939\u0940\u0902 \u092E\u093F\u0932\u093E",searchCountriesAriaLabel:"\u0926\u0947\u0936 \u0916\u094B\u091C\u0947\u0902",countryOptionsAriaLabel:"\u0926\u0947\u0936 \u0935\u093F\u0915\u0932\u094D\u092A",countryButtonAriaLabel:"\u0926\u0947\u0936 \u091A\u092F\u0928 \u0916\u094B\u0932\u0947\u0902"}};function vn(e){let t=(Array.isArray(e)?e:e?[e]:[]).find(Boolean);return t?t.toLowerCase().split("-")[0]:void 0}function Ae(e,n){let t=vn(e),r=t?Nn[t]:void 0;return {...De,...r,...n}}function W(e){let n=e.trim(),t=p(n);return n.startsWith("+")&&!t?"+":t?n.startsWith("+")?`+${t}`:t:""}function ce(e){return e?.code}function He(e){return e?.format?.replace(/[^#]/g,"").length}function p(e){return e.replace(/\D/g,"")}function K(e,n){return e&&new AsYouType(ce(n)).input(W(e))}function pe(e){return W(e)}function Ge(e,n){return !e||!n?false:e.trim().startsWith("+")?validatePhoneNumberLength(W(e))===void 0:validatePhoneNumberLength(p(e),ce(n))===void 0}function qe(e,n,t){if(!e)return false;if(t)return t(e,n??void 0);let r=W(e),o=ce(n);return o?r.startsWith("+")?isValidPhoneNumber(r):isValidPhoneNumber(p(r),o):isPossiblePhoneNumber(r.startsWith("+")?r:`+${p(r)}`)}function B(e,n){if(!n)return e;let t=W(e);if(!t||t==="+")return "";if(t.startsWith("+"))return t;let r=p(t);return n.dialCodes.find(s=>r.startsWith(s.replace("+","")))?`+${r}`:`${n.dialCode}${r}`}function O(e,n){if(!n)return e;let t=W(e),r=p(t),o=p(n.dialCode);if(r.startsWith(o))return r.slice(o.length);for(let s of n.dialCodes){let c=s.replace("+","");if(r.startsWith(c))return r.slice(c.length)}return r}function we(e,n,t){let r=n.toLowerCase().trim();return r?e.filter(o=>o.name.toLowerCase().includes(r)||(o.displayName??"").toLowerCase().includes(r)||o.code.toLowerCase().includes(r)||o.dialCodes.some(s=>s.includes(r))):t?.length?[...e].sort((o,s)=>{let c=t.indexOf(o.code),y=t.indexOf(s.code);return c!==-1&&y!==-1?c-y:c!==-1?-1:y!==-1?1:(o.displayName??o.name).localeCompare(s.displayName??s.name)}):e}function fe(e){return e?.displayName??e?.name??""}function Re(e){return e?.format?e.format.replace(/#/g,"0"):e?.dialCode?`${e.dialCode} 000 000 0000`:"Phone number"}var An=p;function J(e){return e.trim().startsWith("+")||e.trim().startsWith("00")}function On(e){let n=p(e);if(!J(e))return {dialCode:null,nationalNumber:n};let t=S.map(o=>o.dialCode).sort((o,s)=>s.length-o.length).find(o=>n.startsWith(p(o)));if(!t)return {dialCode:null,nationalNumber:n};let r=p(t);return {dialCode:r,nationalNumber:n.slice(r.length)}}function wn(e){return q(e)??null}function Rn(e,n,t="national"){if(!e)return "";if(t==="e164")return B(e,n);let r=J(e)?O(e,n):e;if(!n&&t==="national")return p(r).slice(0,9).replace(/(\d{3})(?=\d)/g,"$1 ").trim();let o=K(r,n);return t==="international"?n?`${n.dialCode} ${o}`:B(e,n):o}function En(e,n){return B(e,n)}function Sn(e,n){if(n)return O(e,n);let t=q(e);return t?O(e,t):p(e)}function de(e,n){return {isValid:false,reason:e,message:n,error:n}}function _e(){return {isValid:true,reason:null,message:null,error:null}}function Ee(e,n,t=false,r){let o=p(e);if(!o)return t?de("required","Phone number is required"):_e();let s=He(n),c=n?p(O(e,n)):o;return c.length<7?de("too_short","Phone number is too short"):s&&c.length>s?de("too_long",`Phone number is too long (max ${s} digits)`):(r?r(e,n??void 0):qe(e,n))?_e():de("invalid","Invalid phone number")}function Bn(e,n){let t=ce(n),r=W(e),o=r.startsWith("+")?parsePhoneNumberFromString(r):parsePhoneNumberFromString(p(r),t);if(!o){let c=n?O(e,n):p(e);return {country:n??void 0,nationalNumber:c,e164:void 0,isValid:false}}return {country:o.country?T(o.country):n??void 0,nationalNumber:o.nationalNumber,e164:o.isValid()?o.number:void 0,isValid:o.isValid()}}function Mn(e,n){return n?Ge(e,n):p(e).length>=7}function Fn(e,n){return J(e)&&n?`${n.dialCode} ${K(O(e,n),n)}`:K(e,n)}var Oe=p;function Vn(e,n){return Oe(e)===Oe(n)}function $n(e,n=true){let t=`${e.flag} ${fe(e)}`;return n?`${t} (${e.dialCode})`:t}function kn(e,n){let t=He(n);if(!t)return e;let r=J(e),o=p(e),s=n?p(n.dialCode):"",c=r?s.length+t:t,y=o.slice(0,c);return r?`+${y}`:y}function Tn(e,n){return e.slice(0,n).replace(/\D/g,"").length}function Wn(e,n){if(n<=0)return e.startsWith("+")?1:0;let t=0;for(let r=0;r<e.length;r+=1)if(/\d/.test(e[r])&&(t+=1,t===n))return r+1;return e.length}function Me(e={}){let{value:n,defaultValue:t="",onChange:r,onCountryChange:o,onBlur:s,onFocus:c,defaultCountry:y="US",preferredCountries:ne,excludeCountries:ge,excludedCountries:ye,onlyCountries:me,allowedCountries:he,autoDetect:Y,autoDetectCountry:be,formatOnType:te=true,includeDialCode:L=false,required:re=false,validator:oe,onValidationChange:ie,locale:P,labels:U}=e,V=me??he,I=ge??ye,D=Y??be??true,w=n!==void 0,_=useRef(null),j=useRef(null),ae=useRef(y),C=useMemo(()=>{let i=S;return V?.length&&(i=i.filter(a=>V.includes(a.code))),I?.length&&(i=i.filter(a=>!I.includes(a.code))),i},[V,I]),N=useMemo(()=>le(C,P),[C,P]),R=useMemo(()=>Ae(P,U),[P,U]),Pe=C.find(i=>i.code===y)||C[0],[Le,se]=useState(t),[d,E]=useState(Pe),[$,H]=useState(false),[A,k]=useState(""),l=w?n:Le,f=useCallback(i=>Z(i,P),[P]);useEffect(()=>{let i=ae.current!==y;ae.current=y;let a=C.find(X=>X.code===y)||C[0],v=d?C.some(X=>X.code===d.code):false;a&&(i||!v)&&E(a);},[y,C,d]),useEffect(()=>{if(D&&l){let i=q(l);i&&C.some(a=>a.code===i.code)&&i.code!==d?.code&&(E(i),o?.(f(i)));}},[C,D,l,d?.code,o,f]);let G=useMemo(()=>te?K(L&&l.startsWith("+")?O(l,d):l,d):L&&l.startsWith("+")?O(l,d):l,[te,L,l,d]),xe=useMemo(()=>L&&d?B(l,d):l,[l,d,L]),M=useMemo(()=>Ee(l,d,re,oe),[l,d,re,oe]);useEffect(()=>{ie?.(M);},[M,ie]);let Ne=useMemo(()=>Z(d,P),[d,P]),ue=useMemo(()=>we(N,A,ne),[N,A,ne]);useLayoutEffect(()=>{let i=j.current,a=_.current;if(i===null||!a||typeof a.setSelectionRange!="function"||typeof document<"u"&&document.activeElement!==a)return;let v=Wn(G,i);a.setSelectionRange(v,v),j.current=null;},[G]);let z=useCallback(i=>{let a=pe(i);w||se(a),r?.(L?B(a,d):a,f(d));},[w,r,d,L,f]),ve=useCallback(i=>{let a=T(i);a&&(E(a),o?.(f(a)),r?.(L?B(l,a):l,f(a)));},[l,r,o,L,f]),u=useCallback(i=>{let a=T(i.code)??i;E(a),H(false),k(""),o?.(f(a)),r?.(L?B(l,a):l,f(a));},[l,r,o,L,f]),h=useCallback(()=>{H(i=>!i),$&&k("");},[$]),b=useCallback(()=>{H(true);},[]),m=useCallback(()=>{H(false),k("");},[]),Qe=useCallback(()=>{w||se(""),r?.("",f(d));},[w,r,d,f]),Ye=useCallback(i=>{let a=i.target.value,v=i.target.selectionStart??a.length,X=a.trim().startsWith("+")?`+${a.replace(/\D/g,"")}`:pe(a);j.current=Tn(a,v),z(X);},[z]),je=useCallback(()=>{c?.();},[c]),Xe=useCallback(()=>{s?.();},[s]),Ie=useCallback(i=>`phone-input-country-${i}`,[]),Ze=useCallback((i,a)=>({id:Ie(i.code),role:"option","aria-selected":i.code===d?.code,onClick:()=>u(i),onKeyDown:v=>{(v.key==="Enter"||v.key===" ")&&(v.preventDefault(),u(i)),v.key==="Escape"&&(v.preventDefault(),m());},tabIndex:a===0?0:-1}),[m,d?.code,Ie,u]);return {phone:l,value:l,fullPhone:xe,country:Ne,isValid:M.isValid,validationReason:M.reason,error:M.error,isOpen:$,searchQuery:A,labels:R,formattedValue:G,setPhone:z,setValue:z,setCountry:ve,toggleDropdown:h,toggle:h,openDropdown:b,open:b,closeDropdown:m,close:m,setSearchQuery:k,clear:Qe,inputProps:{ref:_,value:G,onChange:Ye,onFocus:je,onBlur:Xe,type:"tel",inputMode:"tel",autoComplete:"tel",placeholder:Re(d),"aria-invalid":l?!M.isValid:void 0},countryButtonProps:{onClick:h,"aria-expanded":$,"aria-haspopup":"listbox","aria-label":R.countryButtonAriaLabel},countrySelectorProps:{onClick:h,"aria-expanded":$,"aria-haspopup":"listbox","aria-label":R.countryButtonAriaLabel},dropdownProps:{role:"listbox","aria-label":R.countryOptionsAriaLabel},getCountryOptionId:Ie,filteredCountries:ue,countries:ue,selectCountry:u,getCountryOptionProps:Ze}}var qn=({size:e=12})=>jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:jsx("polyline",{points:"18 15 12 9 6 15"})}),Kn=({size:e=12})=>jsx("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:jsx("polyline",{points:"6 9 12 15 18 9"})}),Qn=forwardRef(function(n,t){let{value:r,defaultValue:o,onChange:s,onBlur:c,onFocus:y,inputClassName:ne,selectorClassName:ge,containerClassName:ye,searchable:me=true,placeholder:he,disabled:Y,readOnly:be,name:te,id:L,"aria-label":re,"aria-labelledby":oe,...ie}=n,P=useRef(null),U=useRef(null),V=useRef([]),[I,D]=useState(0),w=useId(),{inputProps:_,countryButtonProps:j,dropdownProps:ae,country:C,filteredCountries:N,isOpen:R,isValid:Pe,searchQuery:Le,setSearchQuery:se,setCountry:d,selectCountry:E,clear:$,openDropdown:H,closeDropdown:A,getCountryOptionId:k,labels:l}=Me({value:r,defaultValue:o,onChange:s,onBlur:c,onFocus:y,...ie}),f=_.ref,G=useCallback(u=>{U.current=u,typeof f=="function"?f(u):f&&"current"in f&&(f.current=u);},[f]),xe=useCallback(()=>{U.current?.focus();},[]),M=useCallback(()=>{U.current?.blur();},[]),Ne=useCallback(u=>{E(u),D(0);},[E]),ue=useCallback((u,h,b)=>{switch(u.key){case "Enter":case " ":u.preventDefault(),E(h),D(0);break;case "ArrowDown":if(u.preventDefault(),b<N.length-1){let m=b+1;D(m),V.current[m]?.focus();}break;case "ArrowUp":if(u.preventDefault(),b>0){let m=b-1;D(m),V.current[m]?.focus();}break;case "Escape":u.preventDefault(),A();break}},[E,N.length,A]);useEffect(()=>{if(!R)return;let u=b=>{let m=b.target;P.current&&m&&!P.current.contains(m)&&A();},h=b=>{let m=b.target;P.current&&m&&!P.current.contains(m)&&A();};return document.addEventListener("mousedown",u),document.addEventListener("focusin",h),()=>{document.removeEventListener("mousedown",u),document.removeEventListener("focusin",h);}},[R,A]),useEffect(()=>{if(N.length===0){I!==0&&D(0);return}I>=N.length&&D(N.length-1);},[N.length,I]),useImperativeHandle(t,()=>({focus:xe,blur:M,clear:$,setCountry:d,getCountry:()=>C,open:H,close:A}));let z=N[I],ve=z?k(z.code):void 0;return jsxs("div",{ref:P,className:ye,"data-valid":Pe,children:[jsxs("button",{...j,type:"button",className:ge,disabled:Y,tabIndex:Y?-1:0,"aria-controls":w,children:[C?jsxs(Fragment,{children:[jsx("span",{className:"phone-input-flag",children:C.flag}),jsx("span",{className:"phone-input-dial-code",children:C.dialCode})]}):jsx("span",{className:"phone-input-placeholder",children:l.selectCountry}),jsx("span",{className:"phone-input-arrow","aria-hidden":"true",children:R?jsx(qn,{size:12}):jsx(Kn,{size:12})})]}),jsx("input",{..._,ref:G,id:L,name:te,className:ne,placeholder:he||_.placeholder,disabled:Y,readOnly:be,"aria-label":re,"aria-labelledby":oe}),R&&jsxs("div",{className:"phone-input-dropdown",children:[me&&jsx("div",{className:"phone-input-search",children:jsx("input",{type:"text",value:Le,onChange:u=>se(u.target.value),placeholder:l.countrySearchPlaceholder,autoFocus:true,"aria-controls":w,"aria-label":l.searchCountriesAriaLabel})}),jsxs("ul",{...ae,className:"phone-input-country-list",id:w,"aria-activedescendant":ve,children:[N.map((u,h)=>jsxs("li",{id:k(u.code),ref:b=>{V.current[h]=b;},role:"option","aria-selected":u.code===C?.code,className:`phone-input-country-option ${u.code===C?.code?"selected":""} ${h===I?"highlighted":""}`,onClick:()=>Ne(u),onKeyDown:b=>ue(b,u,h),onMouseEnter:()=>D(h),tabIndex:h===I?0:-1,children:[jsx("span",{className:"phone-input-flag",children:u.flag}),jsx("span",{className:"phone-input-country-name",children:fe(u)}),jsx("span",{className:"phone-input-dial-code",children:u.dialCode})]},u.code)),N.length===0&&jsx("li",{className:"phone-input-no-results",children:l.noCountriesFound})]})]})]})});export{De as DEFAULT_PHONE_INPUT_LABELS,Qn as PhoneInput,B as addDialCode,p as cleanPhone,S as countries,wn as detectCountry,q as detectCountryFromPhone,On as extractDialCode,we as filterCountries,Fn as formatAsYouType,K as formatPhone,Rn as formatPhoneNumber,ze as getCountriesByDialCode,T as getCountryByCode,Ln as getCountryByDialCode,$n as getCountryDisplayLabel,fe as getCountryDisplayName,xn as getCountryOptions,ke as getLocalizedCountryName,Sn as getNationalNumber,Re as getPlaceholder,J as isInternationalFormat,Mn as isPhoneNumberComplete,kn as limitInputLength,le as localizeCountries,Z as localizeCountry,Oe as normalizePhoneNumber,Bn as parsePhoneValue,En as parseToE164,Vn as phoneNumbersEqual,O as removeDialCode,Ae as resolvePhoneInputLabels,An as stripNonDigits,pe as unformatPhone,Me as usePhoneInput,qe as validatePhone,Ge as validatePhoneLength,Ee as validatePhoneNumber};//# sourceMappingURL=index.js.map
|
|
2
2
|
//# sourceMappingURL=index.js.map
|