react-phone-number-input-pro 1.0.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 +27 -0
- package/LICENSE +21 -0
- package/README.md +185 -0
- package/dist/components/CountryDropdown/CountryDropdown.d.ts +17 -0
- package/dist/components/CountryDropdown/CountryDropdown.d.ts.map +1 -0
- package/dist/components/CountryDropdown/index.d.ts +2 -0
- package/dist/components/CountryDropdown/index.d.ts.map +1 -0
- package/dist/components/NumberInput/NumberInput.d.ts +21 -0
- package/dist/components/NumberInput/NumberInput.d.ts.map +1 -0
- package/dist/components/NumberInput/index.d.ts +2 -0
- package/dist/components/NumberInput/index.d.ts.map +1 -0
- package/dist/components/PhoneInput/PhoneInput.d.ts +23 -0
- package/dist/components/PhoneInput/PhoneInput.d.ts.map +1 -0
- package/dist/components/PhoneInput/index.d.ts +2 -0
- package/dist/components/PhoneInput/index.d.ts.map +1 -0
- package/dist/data/countries.d.ts +14 -0
- package/dist/data/countries.d.ts.map +1 -0
- package/dist/data/countryAliases.d.ts +7 -0
- package/dist/data/countryAliases.d.ts.map +1 -0
- package/dist/data/phoneRules.d.ts +21 -0
- package/dist/data/phoneRules.d.ts.map +1 -0
- package/dist/hooks/useAutoDetect.d.ts +11 -0
- package/dist/hooks/useAutoDetect.d.ts.map +1 -0
- package/dist/hooks/useCountrySearch.d.ts +17 -0
- package/dist/hooks/useCountrySearch.d.ts.map +1 -0
- package/dist/hooks/useFormatter.d.ts +10 -0
- package/dist/hooks/useFormatter.d.ts.map +1 -0
- package/dist/hooks/usePhoneInput.d.ts +15 -0
- package/dist/hooks/usePhoneInput.d.ts.map +1 -0
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.ts +11 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.mjs +1181 -0
- package/dist/index.mjs.map +1 -0
- package/dist/phone-input.css +1 -0
- package/dist/tests/setup.d.ts +2 -0
- package/dist/tests/setup.d.ts.map +1 -0
- package/dist/types/index.d.ts +95 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/utils/formatter.d.ts +27 -0
- package/dist/utils/formatter.d.ts.map +1 -0
- package/dist/utils/parser.d.ts +20 -0
- package/dist/utils/parser.d.ts.map +1 -0
- package/dist/utils/validator.d.ts +13 -0
- package/dist/utils/validator.d.ts.map +1 -0
- package/package.json +95 -0
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to this project will be documented in this file.
|
|
4
|
+
|
|
5
|
+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
|
+
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
|
+
|
|
8
|
+
## [Unreleased]
|
|
9
|
+
|
|
10
|
+
<!-- Changes for the next release go here -->
|
|
11
|
+
<!-- Format: ### Added / ### Fixed / ### Changed -->
|
|
12
|
+
|
|
13
|
+
## [1.0.0] - 2026-06-26
|
|
14
|
+
|
|
15
|
+
### Added
|
|
16
|
+
- Initial release
|
|
17
|
+
- `<PhoneInput />` component with country selector and number input
|
|
18
|
+
- `usePhoneInput()` headless hook
|
|
19
|
+
- Auto-detection of country from browser locale
|
|
20
|
+
- Support for 240+ countries with dial codes and flag emojis
|
|
21
|
+
- Custom validation rules per country (regex + length)
|
|
22
|
+
- Real-time phone number formatting with country-specific masks
|
|
23
|
+
- Searchable country dropdown
|
|
24
|
+
- Paste handler for international numbers (+919876543210)
|
|
25
|
+
- CSS variables theming system
|
|
26
|
+
- Full TypeScript support
|
|
27
|
+
- Zero dependencies (only peer deps: react, react-dom)
|
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 react-phone-input-pro
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
# react-phone-number-input-pro
|
|
2
|
+
> A zero-dependency React component for international phone number input with country selection, auto-formatting, and validation for 240+ countries.
|
|
3
|
+
|
|
4
|
+
[](https://www.npmjs.com/package/react-phone-number-input-pro)
|
|
5
|
+
[](https://bundlephobia.com/package/react-phone-number-input-pro)
|
|
6
|
+
[](LICENSE)
|
|
7
|
+
[](https://www.typescriptlang.org)
|
|
8
|
+
|
|
9
|
+
## Features
|
|
10
|
+
|
|
11
|
+
- 🌠**240+ countries** — complete dataset with dial codes and crisp SVG flags (via FlagCDN)
|
|
12
|
+
- 🔠**Searchable dropdown** — filter by country name, code, or dial code
|
|
13
|
+
- ✅ **Per-country validation** — custom regex + length rules for every country
|
|
14
|
+
- 🎠**Auto-format** — masks number as you type (e.g. `98765 43210`)
|
|
15
|
+
- 📋 **Paste detection** — paste `+919876543210` and it auto-selects country
|
|
16
|
+
- 🌠**Auto-detect country** — reads browser locale on mount
|
|
17
|
+
- 🎨 **CSS variables theming** — full customization, dark mode included
|
|
18
|
+
- 🔌 **Headless hook** — `usePhoneInput()` for custom UI
|
|
19
|
+
- 📦 **Zero dependencies** — only peer deps: `react >=17`
|
|
20
|
+
- 💪 **TypeScript** — 100% typed, types shipped with package
|
|
21
|
+
|
|
22
|
+
---
|
|
23
|
+
|
|
24
|
+
## Installation
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
npm install react-phone-number-input-pro
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
---
|
|
31
|
+
|
|
32
|
+
## Quick Start
|
|
33
|
+
|
|
34
|
+
```tsx
|
|
35
|
+
import { PhoneInput } from 'react-phone-number-input-pro';
|
|
36
|
+
import 'react-phone-number-input-pro/styles';
|
|
37
|
+
|
|
38
|
+
function MyForm() {
|
|
39
|
+
return (
|
|
40
|
+
<PhoneInput
|
|
41
|
+
defaultCountry="auto"
|
|
42
|
+
onChange={(value, meta) => {
|
|
43
|
+
console.log(value); // "+919876543210"
|
|
44
|
+
console.log(meta.isValid); // true
|
|
45
|
+
console.log(meta.country); // "IN"
|
|
46
|
+
}}
|
|
47
|
+
/>
|
|
48
|
+
);
|
|
49
|
+
}
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
---
|
|
53
|
+
|
|
54
|
+
## Props
|
|
55
|
+
|
|
56
|
+
| Prop | Type | Default | Description |
|
|
57
|
+
|---|---|---|---|
|
|
58
|
+
| `value` | `string` | — | Controlled value (full international number) |
|
|
59
|
+
| `onChange` | `(value, meta) => void` | — | Called on every change |
|
|
60
|
+
| `defaultCountry` | `string` | `"auto"` | ISO code or `"auto"` to detect from browser |
|
|
61
|
+
| `placeholder` | `string` | `"Phone number"` | Input placeholder |
|
|
62
|
+
| `disabled` | `boolean` | `false` | Disables the component |
|
|
63
|
+
| `error` | `boolean` | `false` | Forces error state (red border) |
|
|
64
|
+
| `className` | `string` | — | Extra class on wrapper |
|
|
65
|
+
| `style` | `CSSProperties` | — | Extra inline styles |
|
|
66
|
+
| `name` | `string` | — | Input `name` attribute |
|
|
67
|
+
| `id` | `string` | — | Input `id` attribute |
|
|
68
|
+
| `required` | `boolean` | — | Input `required` attribute |
|
|
69
|
+
| `onBlur` | `() => void` | — | Focus out callback |
|
|
70
|
+
| `onFocus` | `() => void` | — | Focus in callback |
|
|
71
|
+
|
|
72
|
+
### `onChange` meta object
|
|
73
|
+
|
|
74
|
+
```ts
|
|
75
|
+
interface PhoneChangeMeta {
|
|
76
|
+
country: string; // "IN"
|
|
77
|
+
dialCode: string; // "+91"
|
|
78
|
+
nationalNumber: string; // "98765 43210" (formatted)
|
|
79
|
+
rawNumber: string; // "9876543210" (digits only)
|
|
80
|
+
isValid: boolean; // true
|
|
81
|
+
}
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
---
|
|
85
|
+
|
|
86
|
+
## Headless Hook
|
|
87
|
+
|
|
88
|
+
Build your own UI while using all the logic:
|
|
89
|
+
|
|
90
|
+
```tsx
|
|
91
|
+
import { usePhoneInput } from 'react-phone-number-input-pro';
|
|
92
|
+
|
|
93
|
+
function CustomPhoneInput() {
|
|
94
|
+
const {
|
|
95
|
+
country,
|
|
96
|
+
setCountry,
|
|
97
|
+
nationalNumber,
|
|
98
|
+
setNationalNumber,
|
|
99
|
+
formatted,
|
|
100
|
+
fullNumber,
|
|
101
|
+
isValid,
|
|
102
|
+
error,
|
|
103
|
+
reset,
|
|
104
|
+
} = usePhoneInput({ defaultCountry: 'auto' });
|
|
105
|
+
|
|
106
|
+
return (
|
|
107
|
+
<div>
|
|
108
|
+
<span>{country.dialCode}</span>
|
|
109
|
+
<input
|
|
110
|
+
value={formatted}
|
|
111
|
+
onChange={(e) => setNationalNumber(e.target.value)}
|
|
112
|
+
/>
|
|
113
|
+
{error && <p>{error}</p>}
|
|
114
|
+
</div>
|
|
115
|
+
);
|
|
116
|
+
}
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
---
|
|
120
|
+
|
|
121
|
+
## Theming with CSS Variables
|
|
122
|
+
|
|
123
|
+
```css
|
|
124
|
+
.my-phone-input {
|
|
125
|
+
--rpi-border-radius: 12px;
|
|
126
|
+
--rpi-border-color: #8b5cf6;
|
|
127
|
+
--rpi-border-color-focus:#7c3aed;
|
|
128
|
+
--rpi-border-color-valid: #10b981;
|
|
129
|
+
--rpi-border-color-error: #f43f5e;
|
|
130
|
+
--rpi-font-size: 1rem;
|
|
131
|
+
--rpi-height: 52px;
|
|
132
|
+
--rpi-trigger-width: 110px;
|
|
133
|
+
}
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
```tsx
|
|
137
|
+
<PhoneInput className="my-phone-input" defaultCountry="auto" />
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
### Available CSS Variables
|
|
141
|
+
|
|
142
|
+
| Variable | Default | Description |
|
|
143
|
+
|---|---|---|
|
|
144
|
+
| `--rpi-font-size` | `0.9375rem` | Text size |
|
|
145
|
+
| `--rpi-height` | `46px` | Input height |
|
|
146
|
+
| `--rpi-border-color` | `#d1d5db` | Border color |
|
|
147
|
+
| `--rpi-border-color-focus` | `#6366f1` | Focus border |
|
|
148
|
+
| `--rpi-border-color-valid` | `#22c55e` | Valid border |
|
|
149
|
+
| `--rpi-border-color-error` | `#ef4444` | Error border |
|
|
150
|
+
| `--rpi-border-radius` | `10px` | Corner radius |
|
|
151
|
+
| `--rpi-bg` | `#ffffff` | Background |
|
|
152
|
+
| `--rpi-trigger-width` | `96px` | Country selector width |
|
|
153
|
+
| `--rpi-dropdown-width` | `300px` | Dropdown panel width |
|
|
154
|
+
| `--rpi-dropdown-max-height` | `300px` | Dropdown scroll height |
|
|
155
|
+
|
|
156
|
+
---
|
|
157
|
+
|
|
158
|
+
## Using Utilities Directly
|
|
159
|
+
|
|
160
|
+
```tsx
|
|
161
|
+
import { validatePhone, countries, getCountryByCode } from 'react-phone-number-input-pro';
|
|
162
|
+
|
|
163
|
+
// Validate a number
|
|
164
|
+
const { isValid, error } = validatePhone('9876543210', 'IN');
|
|
165
|
+
|
|
166
|
+
// Look up a country
|
|
167
|
+
const india = getCountryByCode('IN');
|
|
168
|
+
// { name: "India", code: "IN", dialCode: "+91" }
|
|
169
|
+
|
|
170
|
+
// Access the full list
|
|
171
|
+
console.log(countries.length); // 240
|
|
172
|
+
```
|
|
173
|
+
|
|
174
|
+
---
|
|
175
|
+
|
|
176
|
+
## Browser Support
|
|
177
|
+
|
|
178
|
+
All modern browsers. Flags are served dynamically via high-quality CDNs, guaranteeing perfect rendering on Windows, Mac, iOS, and Android (bypassing Windows' lack of native flag emoji support).
|
|
179
|
+
Works flawlessly in React 17, 18, and 19.
|
|
180
|
+
|
|
181
|
+
---
|
|
182
|
+
|
|
183
|
+
## License
|
|
184
|
+
|
|
185
|
+
MIT © saafir-bhimani
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { Country } from '../../types';
|
|
3
|
+
|
|
4
|
+
interface CountryDropdownProps {
|
|
5
|
+
selected: Country;
|
|
6
|
+
onChange: (country: Country) => void;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Searchable country selector dropdown.
|
|
11
|
+
* Shows flag emoji + country name + dial code.
|
|
12
|
+
* Closes on outside click, Escape key, or selection.
|
|
13
|
+
* Supports arrow-key navigation for accessibility.
|
|
14
|
+
*/
|
|
15
|
+
export declare const CountryDropdown: React.FC<CountryDropdownProps>;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=CountryDropdown.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CountryDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/CountryDropdown/CountryDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAG3C,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;GAKG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2N1D,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CountryDropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
interface NumberInputProps {
|
|
2
|
+
value: string;
|
|
3
|
+
onChange: (value: string) => void;
|
|
4
|
+
placeholder?: string;
|
|
5
|
+
disabled?: boolean;
|
|
6
|
+
isValid?: boolean;
|
|
7
|
+
hasError?: boolean;
|
|
8
|
+
hasValue?: boolean;
|
|
9
|
+
name?: string;
|
|
10
|
+
id?: string;
|
|
11
|
+
required?: boolean;
|
|
12
|
+
onBlur?: () => void;
|
|
13
|
+
onFocus?: () => void;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* The number input field portion of PhoneInput.
|
|
17
|
+
* Receives formatted display value but emits raw input for processing.
|
|
18
|
+
*/
|
|
19
|
+
export declare const NumberInput: import('react').ForwardRefExoticComponent<NumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
20
|
+
export {};
|
|
21
|
+
//# sourceMappingURL=NumberInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/NumberInput/NumberInput.tsx"],"names":[],"mappings":"AAEA,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,+GA8CvB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/NumberInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { PhoneInputProps } from '../../types';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* `<PhoneInput />` — The main exported component.
|
|
6
|
+
*
|
|
7
|
+
* Combines a searchable country dropdown (with flag + dial code)
|
|
8
|
+
* and a formatted number input field with real-time country-specific
|
|
9
|
+
* validation. Zero external dependencies.
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* import { PhoneInput } from 'react-phone-input-pro';
|
|
14
|
+
* import 'react-phone-input-pro/styles';
|
|
15
|
+
*
|
|
16
|
+
* <PhoneInput
|
|
17
|
+
* defaultCountry="auto"
|
|
18
|
+
* onChange={(value, meta) => console.log(value, meta)}
|
|
19
|
+
* />
|
|
20
|
+
* ```
|
|
21
|
+
*/
|
|
22
|
+
export declare const PhoneInput: React.FC<PhoneInputProps>;
|
|
23
|
+
//# sourceMappingURL=PhoneInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/PhoneInput/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAKnD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAuIhD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PhoneInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { Country } from '../types';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Complete list of 250 countries and territories with ISO codes and dial codes.
|
|
5
|
+
* Sorted alphabetically by country name.
|
|
6
|
+
*/
|
|
7
|
+
export declare const countries: Country[];
|
|
8
|
+
/** Map of ISO code → Country for O(1) lookups */
|
|
9
|
+
export declare const countryMap: Map<string, Country>;
|
|
10
|
+
/** Get a country by its ISO code */
|
|
11
|
+
export declare const getCountryByCode: (code: string) => Country | undefined;
|
|
12
|
+
/** Get all countries whose dialCode matches the given prefix */
|
|
13
|
+
export declare const getCountriesByDialCode: (dialCode: string) => Country[];
|
|
14
|
+
//# sourceMappingURL=countries.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"countries.d.ts","sourceRoot":"","sources":["../../src/data/countries.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAExC;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,OAAO,EA8O9B,CAAC;AAEF,iDAAiD;AACjD,eAAO,MAAM,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAE3C,CAAC;AAEF,oCAAoC;AACpC,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM,KAAG,OAAO,GAAG,SACtB,CAAC;AAErC,gEAAgE;AAChE,eAAO,MAAM,sBAAsB,GAAI,UAAU,MAAM,KAAG,OAAO,EACf,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Common aliases, abbreviations, and major cities for countries.
|
|
3
|
+
* Used to power smarter search in the country dropdown.
|
|
4
|
+
* Key = ISO country code, Value = array of search terms.
|
|
5
|
+
*/
|
|
6
|
+
export declare const countryAliases: Record<string, string[]>;
|
|
7
|
+
//# sourceMappingURL=countryAliases.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"countryAliases.d.ts","sourceRoot":"","sources":["../../src/data/countryAliases.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CA0GnD,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { PhoneRule } from '../types';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Default rule for phone number validation.
|
|
5
|
+
* Fallback rule used when a country-specific rule is not defined.
|
|
6
|
+
* Accepts 7–14 digits — covers most edge cases worldwide.
|
|
7
|
+
*/
|
|
8
|
+
export declare const defaultRule: PhoneRule;
|
|
9
|
+
/**
|
|
10
|
+
* Per-country phone number validation rules.
|
|
11
|
+
* - mask: 'X' = digit, other characters = literal separators
|
|
12
|
+
* - regex: validates the national number (raw digits only, no country code)
|
|
13
|
+
* - min/max: length of national number digits
|
|
14
|
+
*/
|
|
15
|
+
export declare const phoneRules: Record<string, PhoneRule>;
|
|
16
|
+
/**
|
|
17
|
+
* Get the phone rule for a country code.
|
|
18
|
+
* Falls back to defaultRule if no specific rule exists.
|
|
19
|
+
*/
|
|
20
|
+
export declare const getPhoneRule: (countryCode: string) => PhoneRule;
|
|
21
|
+
//# sourceMappingURL=phoneRules.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"phoneRules.d.ts","sourceRoot":"","sources":["../../src/data/phoneRules.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE1C;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,SAKzB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAuMhD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,YAAY,GAAI,aAAa,MAAM,KAAG,SACG,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Country } from '../types';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Hook that resolves the initial country.
|
|
5
|
+
*
|
|
6
|
+
* - If `defaultCountry` is "auto" or undefined → detects from browser locale
|
|
7
|
+
* - If `defaultCountry` is a valid ISO code → uses that country
|
|
8
|
+
* - Falls back to India if nothing matches
|
|
9
|
+
*/
|
|
10
|
+
export declare const useAutoDetect: (defaultCountry?: string) => Country;
|
|
11
|
+
//# sourceMappingURL=useAutoDetect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAutoDetect.d.ts","sourceRoot":"","sources":["../../src/hooks/useAutoDetect.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAkCxC;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,GAAI,iBAAiB,MAAM,KAAG,OAkBvD,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Country } from '../types';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Hook to filter the countries list by a search query.
|
|
5
|
+
* Matches against:
|
|
6
|
+
* - Country name ("United Arab Emirates")
|
|
7
|
+
* - ISO code ("AE")
|
|
8
|
+
* - Dial code ("+971")
|
|
9
|
+
* - Aliases ("uae", "dubai", "emirates")
|
|
10
|
+
*/
|
|
11
|
+
export declare const useCountrySearch: () => {
|
|
12
|
+
query: string;
|
|
13
|
+
setQuery: import('react').Dispatch<import('react').SetStateAction<string>>;
|
|
14
|
+
filtered: Country[];
|
|
15
|
+
clearSearch: () => void;
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=useCountrySearch.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCountrySearch.d.ts","sourceRoot":"","sources":["../../src/hooks/useCountrySearch.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAExC;;;;;;;GAOG;AACH,eAAO,MAAM,gBAAgB;;;;;CAyB5B,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook that applies a country's format mask to raw digit input.
|
|
3
|
+
* Returns the formatted string and the raw digits.
|
|
4
|
+
*/
|
|
5
|
+
export declare const useFormatter: (rawInput: string, countryCode: string) => {
|
|
6
|
+
formatted: string;
|
|
7
|
+
digits: string;
|
|
8
|
+
mask: string;
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=useFormatter.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFormatter.d.ts","sourceRoot":"","sources":["../../src/hooks/useFormatter.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,YAAY,GAAI,UAAU,MAAM,EAAE,aAAa,MAAM;;;;CAQjE,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { UsePhoneInputOptions, UsePhoneInputReturn } from '../types';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Core headless hook for phone number input.
|
|
5
|
+
*
|
|
6
|
+
* Manages all state: selected country, national number input,
|
|
7
|
+
* formatting, and validation. Export this so consumers can build
|
|
8
|
+
* custom UI on top of the logic.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* const { country, setCountry, nationalNumber, setNationalNumber, isValid } =
|
|
12
|
+
* usePhoneInput({ defaultCountry: 'auto' });
|
|
13
|
+
*/
|
|
14
|
+
export declare const usePhoneInput: (options?: UsePhoneInputOptions) => UsePhoneInputReturn;
|
|
15
|
+
//# sourceMappingURL=usePhoneInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePhoneInput.d.ts","sourceRoot":"","sources":["../../src/hooks/usePhoneInput.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAW,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAOnF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa,GAAI,UAAS,oBAAyB,KAAG,mBA6FlE,CAAC"}
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),r=require("react/jsx-runtime"),w=[{name:"Afghanistan",code:"AF",dialCode:"+93"},{name:"Albania",code:"AL",dialCode:"+355"},{name:"Algeria",code:"DZ",dialCode:"+213"},{name:"American Samoa",code:"AS",dialCode:"+1684"},{name:"Andorra",code:"AD",dialCode:"+376"},{name:"Angola",code:"AO",dialCode:"+244"},{name:"Anguilla",code:"AI",dialCode:"+1264"},{name:"Antigua and Barbuda",code:"AG",dialCode:"+1268"},{name:"Argentina",code:"AR",dialCode:"+54"},{name:"Armenia",code:"AM",dialCode:"+374"},{name:"Aruba",code:"AW",dialCode:"+297"},{name:"Australia",code:"AU",dialCode:"+61"},{name:"Austria",code:"AT",dialCode:"+43"},{name:"Azerbaijan",code:"AZ",dialCode:"+994"},{name:"Bahamas",code:"BS",dialCode:"+1242"},{name:"Bahrain",code:"BH",dialCode:"+973"},{name:"Bangladesh",code:"BD",dialCode:"+880"},{name:"Barbados",code:"BB",dialCode:"+1246"},{name:"Belarus",code:"BY",dialCode:"+375"},{name:"Belgium",code:"BE",dialCode:"+32"},{name:"Belize",code:"BZ",dialCode:"+501"},{name:"Benin",code:"BJ",dialCode:"+229"},{name:"Bermuda",code:"BM",dialCode:"+1441"},{name:"Bhutan",code:"BT",dialCode:"+975"},{name:"Bolivia",code:"BO",dialCode:"+591"},{name:"Bosnia and Herzegovina",code:"BA",dialCode:"+387"},{name:"Botswana",code:"BW",dialCode:"+267"},{name:"Brazil",code:"BR",dialCode:"+55"},{name:"British Indian Ocean Territory",code:"IO",dialCode:"+246"},{name:"British Virgin Islands",code:"VG",dialCode:"+1284"},{name:"Brunei",code:"BN",dialCode:"+673"},{name:"Bulgaria",code:"BG",dialCode:"+359"},{name:"Burkina Faso",code:"BF",dialCode:"+226"},{name:"Burundi",code:"BI",dialCode:"+257"},{name:"Cambodia",code:"KH",dialCode:"+855"},{name:"Cameroon",code:"CM",dialCode:"+237"},{name:"Canada",code:"CA",dialCode:"+1"},{name:"Cabo Verde",code:"CV",dialCode:"+238"},{name:"Cayman Islands",code:"KY",dialCode:"+1345"},{name:"Central African Republic",code:"CF",dialCode:"+236"},{name:"Chad",code:"TD",dialCode:"+235"},{name:"Chile",code:"CL",dialCode:"+56"},{name:"China",code:"CN",dialCode:"+86"},{name:"Colombia",code:"CO",dialCode:"+57"},{name:"Comoros",code:"KM",dialCode:"+269"},{name:"Congo (Democratic Republic)",code:"CD",dialCode:"+243"},{name:"Congo (Republic)",code:"CG",dialCode:"+242"},{name:"Cook Islands",code:"CK",dialCode:"+682"},{name:"Costa Rica",code:"CR",dialCode:"+506"},{name:"Croatia",code:"HR",dialCode:"+385"},{name:"Cuba",code:"CU",dialCode:"+53"},{name:"Curaçao",code:"CW",dialCode:"+599"},{name:"Cyprus",code:"CY",dialCode:"+357"},{name:"Czech Republic",code:"CZ",dialCode:"+420"},{name:"Denmark",code:"DK",dialCode:"+45"},{name:"Djibouti",code:"DJ",dialCode:"+253"},{name:"Dominica",code:"DM",dialCode:"+1767"},{name:"Dominican Republic",code:"DO",dialCode:"+1809"},{name:"Ecuador",code:"EC",dialCode:"+593"},{name:"Egypt",code:"EG",dialCode:"+20"},{name:"El Salvador",code:"SV",dialCode:"+503"},{name:"Equatorial Guinea",code:"GQ",dialCode:"+240"},{name:"Eritrea",code:"ER",dialCode:"+291"},{name:"Estonia",code:"EE",dialCode:"+372"},{name:"Eswatini",code:"SZ",dialCode:"+268"},{name:"Ethiopia",code:"ET",dialCode:"+251"},{name:"Falkland Islands",code:"FK",dialCode:"+500"},{name:"Faroe Islands",code:"FO",dialCode:"+298"},{name:"Fiji",code:"FJ",dialCode:"+679"},{name:"Finland",code:"FI",dialCode:"+358"},{name:"France",code:"FR",dialCode:"+33"},{name:"French Guiana",code:"GF",dialCode:"+594"},{name:"French Polynesia",code:"PF",dialCode:"+689"},{name:"Gabon",code:"GA",dialCode:"+241"},{name:"Gambia",code:"GM",dialCode:"+220"},{name:"Georgia",code:"GE",dialCode:"+995"},{name:"Germany",code:"DE",dialCode:"+49"},{name:"Ghana",code:"GH",dialCode:"+233"},{name:"Gibraltar",code:"GI",dialCode:"+350"},{name:"Greece",code:"GR",dialCode:"+30"},{name:"Greenland",code:"GL",dialCode:"+299"},{name:"Grenada",code:"GD",dialCode:"+1473"},{name:"Guadeloupe",code:"GP",dialCode:"+590"},{name:"Guam",code:"GU",dialCode:"+1671"},{name:"Guatemala",code:"GT",dialCode:"+502"},{name:"Guinea",code:"GN",dialCode:"+224"},{name:"Guinea-Bissau",code:"GW",dialCode:"+245"},{name:"Guyana",code:"GY",dialCode:"+592"},{name:"Haiti",code:"HT",dialCode:"+509"},{name:"Honduras",code:"HN",dialCode:"+504"},{name:"Hong Kong",code:"HK",dialCode:"+852"},{name:"Hungary",code:"HU",dialCode:"+36"},{name:"Iceland",code:"IS",dialCode:"+354"},{name:"India",code:"IN",dialCode:"+91"},{name:"Indonesia",code:"ID",dialCode:"+62"},{name:"Iran",code:"IR",dialCode:"+98"},{name:"Iraq",code:"IQ",dialCode:"+964"},{name:"Ireland",code:"IE",dialCode:"+353"},{name:"Isle of Man",code:"IM",dialCode:"+44"},{name:"Israel",code:"IL",dialCode:"+972"},{name:"Italy",code:"IT",dialCode:"+39"},{name:"Ivory Coast",code:"CI",dialCode:"+225"},{name:"Jamaica",code:"JM",dialCode:"+1876"},{name:"Japan",code:"JP",dialCode:"+81"},{name:"Jordan",code:"JO",dialCode:"+962"},{name:"Kazakhstan",code:"KZ",dialCode:"+7"},{name:"Kenya",code:"KE",dialCode:"+254"},{name:"Kiribati",code:"KI",dialCode:"+686"},{name:"Kosovo",code:"XK",dialCode:"+383"},{name:"Kuwait",code:"KW",dialCode:"+965"},{name:"Kyrgyzstan",code:"KG",dialCode:"+996"},{name:"Laos",code:"LA",dialCode:"+856"},{name:"Latvia",code:"LV",dialCode:"+371"},{name:"Lebanon",code:"LB",dialCode:"+961"},{name:"Lesotho",code:"LS",dialCode:"+266"},{name:"Liberia",code:"LR",dialCode:"+231"},{name:"Libya",code:"LY",dialCode:"+218"},{name:"Liechtenstein",code:"LI",dialCode:"+423"},{name:"Lithuania",code:"LT",dialCode:"+370"},{name:"Luxembourg",code:"LU",dialCode:"+352"},{name:"Macau",code:"MO",dialCode:"+853"},{name:"Madagascar",code:"MG",dialCode:"+261"},{name:"Malawi",code:"MW",dialCode:"+265"},{name:"Malaysia",code:"MY",dialCode:"+60"},{name:"Maldives",code:"MV",dialCode:"+960"},{name:"Mali",code:"ML",dialCode:"+223"},{name:"Malta",code:"MT",dialCode:"+356"},{name:"Marshall Islands",code:"MH",dialCode:"+692"},{name:"Martinique",code:"MQ",dialCode:"+596"},{name:"Mauritania",code:"MR",dialCode:"+222"},{name:"Mauritius",code:"MU",dialCode:"+230"},{name:"Mayotte",code:"YT",dialCode:"+262"},{name:"Mexico",code:"MX",dialCode:"+52"},{name:"Micronesia",code:"FM",dialCode:"+691"},{name:"Moldova",code:"MD",dialCode:"+373"},{name:"Monaco",code:"MC",dialCode:"+377"},{name:"Mongolia",code:"MN",dialCode:"+976"},{name:"Montenegro",code:"ME",dialCode:"+382"},{name:"Montserrat",code:"MS",dialCode:"+1664"},{name:"Morocco",code:"MA",dialCode:"+212"},{name:"Mozambique",code:"MZ",dialCode:"+258"},{name:"Myanmar",code:"MM",dialCode:"+95"},{name:"Namibia",code:"NA",dialCode:"+264"},{name:"Nauru",code:"NR",dialCode:"+674"},{name:"Nepal",code:"NP",dialCode:"+977"},{name:"Netherlands",code:"NL",dialCode:"+31"},{name:"New Caledonia",code:"NC",dialCode:"+687"},{name:"New Zealand",code:"NZ",dialCode:"+64"},{name:"Nicaragua",code:"NI",dialCode:"+505"},{name:"Niger",code:"NE",dialCode:"+227"},{name:"Nigeria",code:"NG",dialCode:"+234"},{name:"Niue",code:"NU",dialCode:"+683"},{name:"Norfolk Island",code:"NF",dialCode:"+672"},{name:"North Korea",code:"KP",dialCode:"+850"},{name:"North Macedonia",code:"MK",dialCode:"+389"},{name:"Northern Mariana Islands",code:"MP",dialCode:"+1670"},{name:"Norway",code:"NO",dialCode:"+47"},{name:"Oman",code:"OM",dialCode:"+968"},{name:"Pakistan",code:"PK",dialCode:"+92"},{name:"Palau",code:"PW",dialCode:"+680"},{name:"Palestine",code:"PS",dialCode:"+970"},{name:"Panama",code:"PA",dialCode:"+507"},{name:"Papua New Guinea",code:"PG",dialCode:"+675"},{name:"Paraguay",code:"PY",dialCode:"+595"},{name:"Peru",code:"PE",dialCode:"+51"},{name:"Philippines",code:"PH",dialCode:"+63"},{name:"Poland",code:"PL",dialCode:"+48"},{name:"Portugal",code:"PT",dialCode:"+351"},{name:"Puerto Rico",code:"PR",dialCode:"+1939"},{name:"Qatar",code:"QA",dialCode:"+974"},{name:"Réunion",code:"RE",dialCode:"+262"},{name:"Romania",code:"RO",dialCode:"+40"},{name:"Russia",code:"RU",dialCode:"+7"},{name:"Rwanda",code:"RW",dialCode:"+250"},{name:"Saint Barthélemy",code:"BL",dialCode:"+590"},{name:"Saint Helena",code:"SH",dialCode:"+290"},{name:"Saint Kitts and Nevis",code:"KN",dialCode:"+1869"},{name:"Saint Lucia",code:"LC",dialCode:"+1758"},{name:"Saint Martin",code:"MF",dialCode:"+590"},{name:"Saint Pierre and Miquelon",code:"PM",dialCode:"+508"},{name:"Saint Vincent and the Grenadines",code:"VC",dialCode:"+1784"},{name:"Samoa",code:"WS",dialCode:"+685"},{name:"San Marino",code:"SM",dialCode:"+378"},{name:"São Tomé and Príncipe",code:"ST",dialCode:"+239"},{name:"Saudi Arabia",code:"SA",dialCode:"+966"},{name:"Senegal",code:"SN",dialCode:"+221"},{name:"Serbia",code:"RS",dialCode:"+381"},{name:"Seychelles",code:"SC",dialCode:"+248"},{name:"Sierra Leone",code:"SL",dialCode:"+232"},{name:"Singapore",code:"SG",dialCode:"+65"},{name:"Sint Maarten",code:"SX",dialCode:"+1721"},{name:"Slovakia",code:"SK",dialCode:"+421"},{name:"Slovenia",code:"SI",dialCode:"+386"},{name:"Solomon Islands",code:"SB",dialCode:"+677"},{name:"Somalia",code:"SO",dialCode:"+252"},{name:"South Africa",code:"ZA",dialCode:"+27"},{name:"South Korea",code:"KR",dialCode:"+82"},{name:"South Sudan",code:"SS",dialCode:"+211"},{name:"Spain",code:"ES",dialCode:"+34"},{name:"Sri Lanka",code:"LK",dialCode:"+94"},{name:"Sudan",code:"SD",dialCode:"+249"},{name:"Suriname",code:"SR",dialCode:"+597"},{name:"Svalbard and Jan Mayen",code:"SJ",dialCode:"+47"},{name:"Sweden",code:"SE",dialCode:"+46"},{name:"Switzerland",code:"CH",dialCode:"+41"},{name:"Syria",code:"SY",dialCode:"+963"},{name:"Taiwan",code:"TW",dialCode:"+886"},{name:"Tajikistan",code:"TJ",dialCode:"+992"},{name:"Tanzania",code:"TZ",dialCode:"+255"},{name:"Thailand",code:"TH",dialCode:"+66"},{name:"Timor-Leste",code:"TL",dialCode:"+670"},{name:"Togo",code:"TG",dialCode:"+228"},{name:"Tokelau",code:"TK",dialCode:"+690"},{name:"Tonga",code:"TO",dialCode:"+676"},{name:"Trinidad and Tobago",code:"TT",dialCode:"+1868"},{name:"Tunisia",code:"TN",dialCode:"+216"},{name:"Turkey",code:"TR",dialCode:"+90"},{name:"Turkmenistan",code:"TM",dialCode:"+993"},{name:"Turks and Caicos Islands",code:"TC",dialCode:"+1649"},{name:"Tuvalu",code:"TV",dialCode:"+688"},{name:"Uganda",code:"UG",dialCode:"+256"},{name:"Ukraine",code:"UA",dialCode:"+380"},{name:"United Arab Emirates",code:"AE",dialCode:"+971"},{name:"United Kingdom",code:"GB",dialCode:"+44"},{name:"United States",code:"US",dialCode:"+1"},{name:"Uruguay",code:"UY",dialCode:"+598"},{name:"US Virgin Islands",code:"VI",dialCode:"+1340"},{name:"Uzbekistan",code:"UZ",dialCode:"+998"},{name:"Vanuatu",code:"VU",dialCode:"+678"},{name:"Vatican City",code:"VA",dialCode:"+379"},{name:"Venezuela",code:"VE",dialCode:"+58"},{name:"Vietnam",code:"VN",dialCode:"+84"},{name:"Wallis and Futuna",code:"WF",dialCode:"+681"},{name:"Western Sahara",code:"EH",dialCode:"+212"},{name:"Yemen",code:"YE",dialCode:"+967"},{name:"Zambia",code:"ZM",dialCode:"+260"},{name:"Zimbabwe",code:"ZW",dialCode:"+263"}],Y=new Map(w.map(e=>[e.code,e])),A=e=>Y.get(e.toUpperCase()),J=e=>w.filter(a=>a.dialCode===e),D={name:"India",code:"IN",dialCode:"+91"},K=()=>{var e;try{const a=(e=navigator.languages)!=null&&e.length?navigator.languages:[navigator.language];for(const X of a){const d=X.split("-");if(d.length>=2){const i=d[d.length-1].toUpperCase(),m=A(i);if(m)return m}}}catch{}return D},q=e=>{const[a,X]=n.useState(()=>!e||e==="auto"?K():A(e)??D);return n.useEffect(()=>{if(!e||e==="auto")X(K());else{const d=A(e);d&&X(d)}},[e]),a},U=(e,a)=>{if(!e)return"";let X=0,d="";for(let i=0;i<a.length;i++)if(a[i]==="X"){if(X>=e.length)break;d+=e[X++]}else d+=a[i];return d.replace(/[\s\-()]+$/,"")},I=e=>e.replace(/\D/g,""),Q=e=>[...e].filter(a=>a==="X").length,B=(e,a)=>e.slice(0,Q(a)),V={mask:"XXXXXXXXXXXXXXX",regex:/^\d{7,14}$/,min:7,max:14},j={IN:{mask:"XXXXX XXXXX",regex:/^[6-9]\d{9}$/,min:10,max:10},CN:{mask:"XXX XXXX XXXX",regex:/^1[3-9]\d{9}$/,min:11,max:11},JP:{mask:"XXX-XXXX-XXXX",regex:/^0[789]0\d{8}$/,min:11,max:11},KR:{mask:"XXX-XXXX-XXXX",regex:/^01[016789]\d{7,8}$/,min:10,max:11},PK:{mask:"XXX XXXXXXX",regex:/^3[0-46]\d{8}$/,min:10,max:10},BD:{mask:"XXXX-XXXXXX",regex:/^1[3-9]\d{8}$/,min:10,max:10},PH:{mask:"XXX XXX XXXX",regex:/^9\d{9}$/,min:10,max:10},ID:{mask:"XXXX-XXXX-XXXX",regex:/^8(1[1-9]|2[1-9]|3[1-9]|5[1-9]|7[1-9]|8[1-9]|9[1-9])\d{6,9}$/,min:9,max:12},VN:{mask:"XXX XXX XXXX",regex:/^[35789]\d{8}$/,min:9,max:10},TH:{mask:"XX-XXXX-XXXX",regex:/^[689]\d{8}$/,min:9,max:9},MY:{mask:"XX-XXXX XXXX",regex:/^1[0-9]\d{7,8}$/,min:9,max:10},SG:{mask:"XXXX XXXX",regex:/^[89]\d{7}$/,min:8,max:8},LK:{mask:"XXX XXX XXXX",regex:/^7[0-9]\d{7}$/,min:9,max:9},NP:{mask:"XXX-XXXXXXX",regex:/^9[78]\d{8}$/,min:10,max:10},MM:{mask:"XX XXXX XXXX",regex:/^[0-9]\d{8,9}$/,min:8,max:10},LA:{mask:"XX XX XXXXX",regex:/^[0-9]\d{7,9}$/,min:8,max:10},AF:{mask:"XXX XXX XXXX",regex:/^7[0-9]\d{8}$/,min:9,max:9},SY:{mask:"XXX XXX XXX",regex:/^9[0-9]\d{7}$/,min:9,max:9},LB:{mask:"XX XXX XXX",regex:/^[37]\d{7}$/,min:7,max:8},JO:{mask:"X XXXX XXXX",regex:/^7[7-9]\d{7}$/,min:9,max:9},SA:{mask:"XXX XXX XXXX",regex:/^5[013-9]\d{7}$/,min:9,max:9},AE:{mask:"XX XXX XXXX",regex:/^5[024568]\d{7}$/,min:9,max:9},KW:{mask:"XXXX XXXX",regex:/^[569]\d{7}$/,min:8,max:8},YE:{mask:"XXX XXX XXX",regex:/^7[0-7]\d{7}$/,min:9,max:9},IL:{mask:"XXX-XXX-XXXX",regex:/^5[0-9]\d{8}$/,min:9,max:10},PS:{mask:"XXX XXX XXXX",regex:/^5[6-9]\d{7}$/,min:9,max:9},KZ:{mask:"XXX XXX-XX-XX",regex:/^7[0-9]\d{8}$/,min:10,max:10},UZ:{mask:"XX XXX XX XX",regex:/^[39]\d{8}$/,min:9,max:9},TJ:{mask:"XX XXX XXXX",regex:/^[0-9]\d{8}$/,min:9,max:9},TM:{mask:"XX XXXXXX",regex:/^[6]\d{7}$/,min:8,max:8},KG:{mask:"XXX XXX XXX",regex:/^[0-9]\d{8}$/,min:9,max:9},AZ:{mask:"XX XXX XX XX",regex:/^[57]\d{8}$/,min:9,max:9},AM:{mask:"XX XXXXXX",regex:/^[049]\d{7}$/,min:8,max:8},GE:{mask:"XXX XXX XXX",regex:/^[579]\d{8}$/,min:9,max:9},BT:{mask:"XXX XXXXX",regex:/^[127]\d{6,7}$/,min:7,max:8},MV:{mask:"XXX-XXXX",regex:/^[7-9]\d{6}$/,min:7,max:7},MN:{mask:"XXXX XXXX",regex:/^[5689]\d{7}$/,min:8,max:8},KP:{mask:"XXX XXXX XXX",regex:/^[0-9]\d{8,9}$/,min:9,max:10},TW:{mask:"XXXX-XXXXXX",regex:/^9\d{8}$/,min:9,max:9},HK:{mask:"XXXX XXXX",regex:/^[5-9]\d{7}$/,min:8,max:8},MO:{mask:"XXXX XXXX",regex:/^6\d{7}$/,min:8,max:8},BN:{mask:"XXX XXXX",regex:/^[27]\d{6}$/,min:7,max:7},TL:{mask:"XXXX XXXX",regex:/^[7]\d{7}$/,min:8,max:8},GB:{mask:"XXXXX XXXXXX",regex:/^7[0-9]\d{8}$/,min:10,max:10},DE:{mask:"XXXX XXXXXXXX",regex:/^1[5-7]\d{9,10}$/,min:10,max:11},FR:{mask:"XX XX XX XX XX",regex:/^[67]\d{8}$/,min:9,max:9},IT:{mask:"XXX XXXXXXX",regex:/^3[0-9]\d{8}$/,min:9,max:10},ES:{mask:"XXX XXX XXX",regex:/^[67]\d{8}$/,min:9,max:9},PT:{mask:"XXX XXX XXX",regex:/^9[1236]\d{7}$/,min:9,max:9},NL:{mask:"X XXXX XXXX",regex:/^6\d{8}$/,min:9,max:9},BE:{mask:"XXX XX XX XX",regex:/^4[5-9]\d{7}$/,min:9,max:9},CH:{mask:"XX XXX XX XX",regex:/^7[5-9]\d{7}$/,min:9,max:9},AT:{mask:"XXX XXXXXX",regex:/^6[5-9]\d{7,9}$/,min:9,max:11},PL:{mask:"XXX XXX XXX",regex:/^[45678]\d{8}$/,min:9,max:9},RU:{mask:"XXX XXX-XX-XX",regex:/^[39]\d{9}$/,min:10,max:10},UA:{mask:"XX XXX XX XX",regex:/^[5-9]\d{8}$/,min:9,max:9},SE:{mask:"XX XXX XX XX",regex:/^7[0-9]\d{7,8}$/,min:9,max:10},NO:{mask:"XXX XX XXX",regex:/^[49]\d{7}$/,min:8,max:8},DK:{mask:"XX XX XX XX",regex:/^[2-9]\d{7}$/,min:8,max:8},FI:{mask:"XX XXX XXXX",regex:/^[45]\d{8,9}$/,min:9,max:10},GR:{mask:"XXX XXX XXXX",regex:/^6[0-9]\d{8}$/,min:10,max:10},CZ:{mask:"XXX XXX XXX",regex:/^[67]\d{8}$/,min:9,max:9},HU:{mask:"XX XXX XXXX",regex:/^[27]\d{8}$/,min:9,max:9},RO:{mask:"XXX XXX XXX",regex:/^7[0-9]\d{7}$/,min:9,max:9},BG:{mask:"XXX XXX XXX",regex:/^[89]\d{8}$/,min:9,max:9},RS:{mask:"XX XXXXXXX",regex:/^6[0-9]\d{6,7}$/,min:8,max:9},HR:{mask:"XX XXX XXXX",regex:/^9[125789]\d{6,7}$/,min:8,max:9},SK:{mask:"XXX XXX XXX",regex:/^9[0-9]\d{7}$/,min:9,max:9},AL:{mask:"XX XXX XXXX",regex:/^6[0-9]\d{7}$/,min:9,max:9},MK:{mask:"XX XXX XXX",regex:/^7[0-9]\d{6}$/,min:8,max:8},ME:{mask:"XX XXX XXX",regex:/^6[0-9]\d{6}$/,min:8,max:8},IE:{mask:"XXX XXX XXXX",regex:/^8[35-9]\d{7}$/,min:9,max:9},IS:{mask:"XXX XXXX",regex:/^[5-8]\d{6}$/,min:7,max:7},LU:{mask:"XXX XXX XXX",regex:/^6[269]\d{7}$/,min:9,max:9},LT:{mask:"X XXXX XXXX",regex:/^6\d{7}$/,min:8,max:8},LV:{mask:"XX XXX XXX",regex:/^2[0-9]\d{6}$/,min:8,max:8},EE:{mask:"XXXX XXXX",regex:/^[35]\d{6,7}$/,min:7,max:8},BY:{mask:"XX XXX-XX-XX",regex:/^[2345]\d{8}$/,min:9,max:9},MD:{mask:"XX XXX XXX",regex:/^6[789]\d{6}$/,min:8,max:8},TR:{mask:"XXX XXX XXXX",regex:/^5[0-9]\d{8}$/,min:10,max:10},CY:{mask:"XX XXXXXX",regex:/^9[6-9]\d{6}$/,min:8,max:8},MT:{mask:"XXXX XXXX",regex:/^[79]\d{7}$/,min:8,max:8},SM:{mask:"XXX XXXXXX",regex:/^6\d{8}$/,min:9,max:9},MC:{mask:"XXXX XXXX",regex:/^[46]\d{7}$/,min:8,max:8},LI:{mask:"XXX XXXXX",regex:/^[67]\d{6,7}$/,min:7,max:8},AD:{mask:"XXX XXX",regex:/^[346]\d{5}$/,min:6,max:6},XK:{mask:"XX XXX XXX",regex:/^4[3-9]\d{6}$/,min:8,max:8},US:{mask:"(XXX) XXX-XXXX",regex:/^[2-9]\d{9}$/,min:10,max:10},CA:{mask:"(XXX) XXX-XXXX",regex:/^[2-9]\d{9}$/,min:10,max:10},MX:{mask:"XXX XXX XXXX",regex:/^[2-9]\d{9}$/,min:10,max:10},BR:{mask:"(XX) XXXXX-XXXX",regex:/^[1-9]\d{9,10}$/,min:10,max:11},AR:{mask:"XX XXXX-XXXX",regex:/^9\d{9,10}$/,min:10,max:11},CO:{mask:"XXX XXX XXXX",regex:/^3[0-9]\d{8}$/,min:10,max:10},CL:{mask:"X XXXX XXXX",regex:/^9\d{8}$/,min:9,max:9},PE:{mask:"XXX XXX XXX",regex:/^9\d{8}$/,min:9,max:9},VE:{mask:"XXX-XXX-XXXX",regex:/^[24][0-9]\d{7}$/,min:10,max:10},EC:{mask:"XX XXX XXXX",regex:/^9\d{8}$/,min:9,max:9},BO:{mask:"XXXX XXXX",regex:/^[67]\d{7}$/,min:8,max:8},PY:{mask:"XXX XXX XXX",regex:/^9[5-9]\d{7}$/,min:9,max:9},UY:{mask:"X XXX XXXX",regex:/^9\d{7}$/,min:8,max:8},GY:{mask:"XXX XXXX",regex:/^6\d{6}$/,min:7,max:7},SR:{mask:"XXX XXXX",regex:/^[67]\d{6}$/,min:7,max:7},CR:{mask:"XXXX XXXX",regex:/^[67]\d{7}$/,min:8,max:8},PA:{mask:"XXXX XXXX",regex:/^[67]\d{7}$/,min:8,max:8},GT:{mask:"XXXX XXXX",regex:/^[45]\d{7}$/,min:8,max:8},HN:{mask:"XXXX XXXX",regex:/^[37]\d{7}$/,min:8,max:8},SV:{mask:"XXXX XXXX",regex:/^[67]\d{7}$/,min:8,max:8},NI:{mask:"XXXX XXXX",regex:/^[578]\d{7}$/,min:8,max:8},BZ:{mask:"XXX XXXX",regex:/^[6]\d{6}$/,min:7,max:7},CU:{mask:"X XXX XXXX",regex:/^5\d{7}$/,min:8,max:8},HT:{mask:"XXXX XXXX",regex:/^[34]\d{7}$/,min:8,max:8},DO:{mask:"(XXX) XXX-XXXX",regex:/^[89]\d{9}$/,min:10,max:10},JM:{mask:"(XXX) XXX-XXXX",regex:/^876\d{7}$/,min:10,max:10},TT:{mask:"(XXX) XXX-XXXX",regex:/^868\d{7}$/,min:10,max:10},BB:{mask:"(XXX) XXX-XXXX",regex:/^246\d{7}$/,min:10,max:10},GD:{mask:"(XXX) XXX-XXXX",regex:/^473\d{7}$/,min:10,max:10},DM:{mask:"(XXX) XXX-XXXX",regex:/^767\d{7}$/,min:10,max:10},VC:{mask:"(XXX) XXX-XXXX",regex:/^784\d{7}$/,min:10,max:10},LC:{mask:"(XXX) XXX-XXXX",regex:/^758\d{7}$/,min:10,max:10},KN:{mask:"(XXX) XXX-XXXX",regex:/^869\d{7}$/,min:10,max:10},AG:{mask:"(XXX) XXX-XXXX",regex:/^268\d{7}$/,min:10,max:10},BS:{mask:"(XXX) XXX-XXXX",regex:/^242\d{7}$/,min:10,max:10},NG:{mask:"XXX XXX XXXX",regex:/^[789]\d{9}$/,min:10,max:10},ZA:{mask:"XX XXX XXXX",regex:/^[678]\d{8}$/,min:9,max:9},EG:{mask:"XXX XXX XXXX",regex:/^1[0-9]\d{8}$/,min:10,max:10},ET:{mask:"XX XXX XXXX",regex:/^9[1-9]\d{7}$/,min:9,max:9},KE:{mask:"XXX XXX XXX",regex:/^7[0-9]\d{7}$/,min:9,max:9},TZ:{mask:"XXX XXX XXX",regex:/^7[5-9]\d{7}$/,min:9,max:9},UG:{mask:"XXX XXXXXX",regex:/^7[0-9]\d{7}$/,min:9,max:9},GH:{mask:"XXX XXX XXXX",regex:/^[25]\d{8}$/,min:9,max:9},MA:{mask:"XXX-XXX-XXX",regex:/^6[0-9]\d{7}$/,min:9,max:9},TN:{mask:"XX XXX XXX",regex:/^[259]\d{7}$/,min:8,max:8},DZ:{mask:"XXX XX XX XX",regex:/^[567]\d{8}$/,min:9,max:9},LY:{mask:"XX XXXXXXX",regex:/^9[1-9]\d{7}$/,min:9,max:9},SD:{mask:"XXX XXX XXXX",regex:/^9[0-9]\d{8}$/,min:9,max:9},CM:{mask:"XXXX XXXX",regex:/^[67]\d{7}$/,min:8,max:8},SN:{mask:"XX XXX XXXX",regex:/^7[0-9]\d{7}$/,min:9,max:9},CI:{mask:"XX XX XX XXXX",regex:/^[057]\d{8}$/,min:9,max:10},AO:{mask:"XXX XXX XXX",regex:/^9[1-9]\d{7}$/,min:9,max:9},MZ:{mask:"XX XXX XXXX",regex:/^8[24567]\d{7}$/,min:9,max:9},ZW:{mask:"XX XXX XXXX",regex:/^7[1-9]\d{7}$/,min:9,max:9},ZM:{mask:"XXX XXXXXX",regex:/^9[567]\d{7}$/,min:9,max:9},RW:{mask:"XXX XXX XXX",regex:/^7[2-9]\d{7}$/,min:9,max:9},MW:{mask:"XXX XX XXXX",regex:/^[189]\d{8}$/,min:9,max:9},NA:{mask:"XX XXX XXXX",regex:/^[68]\d{8}$/,min:9,max:9},BW:{mask:"XX XXX XXX",regex:/^7[1-9]\d{6}$/,min:8,max:8},MG:{mask:"XX XX XXX XX",regex:/^3[0-9]\d{8}$/,min:9,max:9},SC:{mask:"X XXX XXX",regex:/^2\d{6}$/,min:7,max:7},SL:{mask:"XXX XXXXXX",regex:/^[37]\d{7}$/,min:8,max:8},LR:{mask:"XXX XXX XXXX",regex:/^[47]\d{8}$/,min:9,max:9},GW:{mask:"XXX XXXX",regex:/^[59]\d{6}$/,min:7,max:7},MU:{mask:"XXXX XXXX",regex:/^[25]\d{7}$/,min:8,max:8},GA:{mask:"XX XX XX XX",regex:/^0[67]\d{6}$/,min:8,max:8},BJ:{mask:"XX XXX XXXX",regex:/^[69]\d{7}$/,min:8,max:8},TG:{mask:"XX XXX XXX",regex:/^[79]\d{7}$/,min:8,max:8},GN:{mask:"XXX XX XX XX",regex:/^6[2-9]\d{7}$/,min:9,max:9},ML:{mask:"XX XX XX XX",regex:/^[67]\d{7}$/,min:8,max:8},BF:{mask:"XX XX XX XX",regex:/^[67]\d{7}$/,min:8,max:8},NE:{mask:"XX XX XX XX",regex:/^[89]\d{7}$/,min:8,max:8},MR:{mask:"XXXX XXXX",regex:/^[23]\d{7}$/,min:8,max:8},GM:{mask:"XXX XXXX",regex:/^[79]\d{6}$/,min:7,max:7},CF:{mask:"XX XX XX XX",regex:/^[27]\d{7}$/,min:8,max:8},TD:{mask:"XX XX XX XX",regex:/^[69]\d{7}$/,min:8,max:8},BI:{mask:"XX XX XX XX",regex:/^[67]\d{7}$/,min:8,max:8},SS:{mask:"XXX XXX XXXX",regex:/^9[0-9]\d{8}$/,min:9,max:9},SO:{mask:"XXX XXX XXX",regex:/^[679]\d{8}$/,min:9,max:9},DJ:{mask:"XX XX XX XX",regex:/^[67]\d{7}$/,min:8,max:8},ER:{mask:"XXX XXX XXX",regex:/^[178]\d{6}$/,min:7,max:7},KM:{mask:"XXX XXXX",regex:/^[37]\d{6}$/,min:7,max:7},ST:{mask:"XXX XXXX",regex:/^9\d{6}$/,min:7,max:7},GQ:{mask:"XXX XXX XXX",regex:/^[23]\d{8}$/,min:9,max:9},SZ:{mask:"XX XXX XXX",regex:/^[67]\d{7}$/,min:8,max:8},LS:{mask:"XXXX XXXX",regex:/^[56]\d{7}$/,min:8,max:8},AU:{mask:"XXXX XXX XXX",regex:/^4\d{8}$/,min:9,max:9},PG:{mask:"XXX XXX XXX",regex:/^[78]\d{7}$/,min:8,max:8},SB:{mask:"XXXXX",regex:/^[7-9]\d{4}$/,min:5,max:5},VU:{mask:"XXX XXXX",regex:/^[57]\d{6}$/,min:7,max:7},FJ:{mask:"XXX XXXX",regex:/^[79]\d{6}$/,min:7,max:7},NC:{mask:"XX XX XX",regex:/^[67]\d{5}$/,min:6,max:6},PF:{mask:"XX XX XX",regex:/^[67]\d{5}$/,min:6,max:6},NZ:{mask:"XX XXX XXXX",regex:/^[27]\d{7,8}$/,min:8,max:9},WS:{mask:"XX XXXXX",regex:/^[67]\d{5,6}$/,min:6,max:7},TO:{mask:"XXXXX",regex:/^[57]\d{4}$/,min:5,max:5},KI:{mask:"XXXXX",regex:/^[3-9]\d{4}$/,min:5,max:5},NR:{mask:"XXX XXXX",regex:/^[45]\d{6}$/,min:7,max:7},PW:{mask:"XXX XXXX",regex:/^[67]\d{6}$/,min:7,max:7},FM:{mask:"XXX XXXX",regex:/^[39]\d{6}$/,min:7,max:7},MH:{mask:"XXX XXXX",regex:/^[25]\d{6}$/,min:7,max:7},TV:{mask:"XXXXX",regex:/^[289]\d{4}$/,min:5,max:5}},y=e=>j[e.toUpperCase()]??V,F=(e,a)=>{if(!e||e.length===0)return{isValid:!1,error:null};const X=y(a);return e.length<X.min?{isValid:!1,error:`Number too short — needs at least ${X.min} digits`}:e.length>X.max?{isValid:!1,error:`Number too long — maximum ${X.max} digits`}:X.regex.test(e)?{isValid:!0,error:null}:{isValid:!1,error:"Invalid phone number format for this country"}},ee=[...w].map(e=>({country:e,dialDigits:I(e.dialCode)})).sort((e,a)=>a.dialDigits.length-e.dialDigits.length),E=e=>{const a=e.trim();let X=a;if(X.startsWith("+"))X=X.slice(1);else if(X.startsWith("00"))X=X.slice(2);else return{country:null,nationalNumber:I(a)};const d=I(X);for(const{country:i,dialDigits:m}of ee)if(d.startsWith(m)){const s=d.slice(m.length);return{country:i,nationalNumber:s}}return{country:null,nationalNumber:d}},Z=(e,a)=>a?`${e.dialCode}${a}`:"",_=(e={})=>{const{defaultCountry:a="auto",initialValue:X=""}=e,d=q(a),[i,m]=n.useState(d),[s,g]=n.useState("");n.useEffect(()=>{m(d)},[d]);const $=n.useRef("");n.useEffect(()=>{if(X&&X!==$.current){const l=E(X);l.country&&m(l.country),g(l.nationalNumber),$.current=X}},[X]);const t=n.useCallback(l=>{m(l),g(N=>{const o=y(l.code);return B(N,o.mask)})},[]),b=n.useCallback(l=>{if(l.startsWith("+")||l.startsWith("00")){const x=E(l);if(x.country){m(x.country);const c=y(x.country.code);g(B(x.nationalNumber,c.mask));return}}const N=y(i.code),o=B(I(l),N.mask);g(o)},[i]),p=n.useCallback(()=>{m(d),g("")},[d]),{formatted:f,fullNumber:k,isValid:u,error:S}=n.useMemo(()=>{const l=y(i.code);return{formatted:U(s,l.mask),fullNumber:Z(i,s),...F(s,i.code)}},[i,s]);return n.useEffect(()=>{$.current=k},[k]),{country:i,setCountry:t,nationalNumber:s,setNationalNumber:b,fullNumber:k,formatted:f,isValid:u,error:S,reset:p}},ae={AE:["uae","dubai","abu dhabi","emirates","sharjah"],US:["usa","america","united states of america","new york","los angeles"],GB:["uk","england","britain","great britain","london","scotland","wales"],RU:["russia"],KR:["korea","south korea","seoul"],KP:["north korea"],TW:["taiwan","formosa"],VN:["vietnam"],IR:["iran","persia"],SY:["syria"],BO:["bolivia"],CN:["china","prc","beijing","shanghai"],IN:["india","bharat","mumbai","delhi","bangalore"],CD:["congo","drc","zaire"],CG:["congo brazzaville"],KH:["cambodia","khmer"],MM:["myanmar","burma"],LA:["laos"],CI:["ivory coast","cote divoire"],CV:["cape verde"],TL:["east timor","timor leste"],PS:["palestine","gaza","west bank"],SS:["south sudan"],XK:["kosovo"],CZ:["czech","czechia"],SK:["slovakia"],BA:["bosnia"],ME:["montenegro"],RS:["serbia"],MK:["north macedonia","macedonia"],SZ:["eswatini","swaziland"],TR:["turkey","turkiye","istanbul"],MX:["mexico","ciudad de mexico"],BR:["brazil","brasil","sao paulo","rio"],AR:["argentina","buenos aires"],ZA:["south africa","johannesburg","cape town"],NG:["nigeria","lagos"],EG:["egypt","cairo"],SA:["saudi","saudi arabia","riyadh","jeddah","ksa"],PK:["pakistan","karachi","lahore","islamabad"],BD:["bangladesh","dhaka"],LK:["sri lanka","ceylon"],MY:["malaysia","kuala lumpur","kl"],SG:["singapore"],ID:["indonesia","jakarta","bali"],PH:["philippines","manila"],JP:["japan","tokyo"],AU:["australia","sydney","melbourne"],NZ:["new zealand","auckland"],CA:["canada","toronto","vancouver"],DE:["germany","deutschland","berlin"],FR:["france","paris"],IT:["italy","italia","rome","milan"],ES:["spain","espana","madrid","barcelona"],PT:["portugal","lisbon"],NL:["netherlands","holland","amsterdam"],BE:["belgium","brussels"],CH:["switzerland","swiss","zurich"],AT:["austria","vienna"],SE:["sweden","stockholm"],NO:["norway","oslo"],DK:["denmark","copenhagen"],FI:["finland","helsinki"],PL:["poland","warsaw"],UA:["ukraine","kyiv"],QA:["qatar","doha"],KW:["kuwait"],BH:["bahrain"],OM:["oman","muscat"],JO:["jordan","amman"],LB:["lebanon","beirut"],IL:["israel","tel aviv"],IQ:["iraq","baghdad"],AF:["afghanistan","kabul"],KZ:["kazakhstan"],UZ:["uzbekistan"],GH:["ghana","accra"],KE:["kenya","nairobi"],ET:["ethiopia","addis ababa"],TZ:["tanzania","dar es salaam"],UG:["uganda","kampala"],RW:["rwanda","kigali"],MA:["morocco","marrakech","casablanca"],DZ:["algeria","algiers"],TN:["tunisia","tunis"],LY:["libya","tripoli"],SD:["sudan","khartoum"],CM:["cameroon"],SN:["senegal","dakar"],MG:["madagascar"],MZ:["mozambique","maputo"],ZM:["zambia","lusaka"],ZW:["zimbabwe","harare"],PE:["peru","lima"],CO:["colombia","bogota"],VE:["venezuela","caracas"],CL:["chile","santiago"],EC:["ecuador","quito"],GR:["greece","athens"],HU:["hungary","budapest"],RO:["romania","bucharest"],BG:["bulgaria","sofia"],HR:["croatia","zagreb"],IE:["ireland","dublin"],IS:["iceland","reykjavik"]},Xe=()=>{const[e,a]=n.useState(""),X=n.useMemo(()=>{const i=e.trim().toLowerCase();return i?w.filter(m=>{if(m.name.toLowerCase().includes(i)||m.code.toLowerCase().includes(i)||m.dialCode.includes(i))return!0;const s=ae[m.code];return!!(s!=null&&s.some(g=>g.includes(i)))}):w},[e]),d=n.useCallback(()=>a(""),[]);return{query:e,setQuery:a,filtered:X,clearSearch:d}},H=({selected:e,onChange:a,disabled:X=!1})=>{const[d,i]=n.useState(!1),[m,s]=n.useState(-1),{query:g,setQuery:$,filtered:t,clearSearch:b}=Xe(),p=n.useRef(null),f=n.useRef(null),k=n.useRef(null),u=n.useCallback(()=>{i(!1),s(-1),b()},[b]);n.useEffect(()=>{s(-1)},[t]);const S=n.useCallback(o=>{if(!k.current)return;const c=k.current.querySelectorAll('[role="option"]')[o];c==null||c.scrollIntoView({block:"nearest"})},[]),l=n.useCallback(o=>{a(o),u()},[a,u]);n.useEffect(()=>{if(!d)return;const o=setTimeout(()=>{var C;return(C=f.current)==null?void 0:C.focus()},50),x=C=>{p.current&&!p.current.contains(C.target)&&u()},c=C=>{switch(C.key){case"Escape":u();break;case"ArrowDown":C.preventDefault(),s(h=>{const M=h<t.length-1?h+1:0;return S(M),M});break;case"ArrowUp":C.preventDefault(),s(h=>{const M=h>0?h-1:t.length-1;return S(M),M});break;case"Home":C.preventDefault(),s(0),S(0);break;case"End":C.preventDefault(),s(t.length-1),S(t.length-1);break;case"Enter":m>=0&&m<t.length&&(C.preventDefault(),l(t[m]));break}};return document.addEventListener("mousedown",x),document.addEventListener("keydown",c),()=>{clearTimeout(o),document.removeEventListener("mousedown",x),document.removeEventListener("keydown",c)}},[d,u,t,m,S,l]);const N=()=>{X||i(!0)};return n.useEffect(()=>{if(d&&k.current){const o=k.current.querySelector('[aria-selected="true"]');o==null||o.scrollIntoView({block:"nearest"})}},[d]),r.jsxs("div",{className:"rpi-dropdown",ref:p,children:[r.jsxs("button",{type:"button",className:`rpi-dropdown__trigger ${X?"rpi-dropdown__trigger--disabled":""}`,onClick:N,disabled:X,"aria-haspopup":"listbox","aria-expanded":d,"aria-label":`Country: ${e.name}, dial code ${e.dialCode}`,children:[r.jsx("span",{className:"rpi-dropdown__flag","aria-hidden":"true",children:r.jsx("img",{src:`https://flagcdn.com/w20/${e.code.toLowerCase()}.png`,srcSet:`https://flagcdn.com/w40/${e.code.toLowerCase()}.png 2x`,width:"20",alt:e.code,loading:"lazy"})}),r.jsx("span",{className:"rpi-dropdown__dialcode",children:e.dialCode}),r.jsx("span",{className:`rpi-dropdown__arrow ${d?"rpi-dropdown__arrow--open":""}`,"aria-hidden":"true",children:"▾"})]}),d&&r.jsxs("div",{className:"rpi-dropdown__panel",role:"dialog","aria-label":"Select country",children:[r.jsxs("div",{className:"rpi-dropdown__search-wrap",children:[r.jsx("span",{className:"rpi-dropdown__search-icon","aria-hidden":"true",children:"🔍"}),r.jsx("input",{ref:f,type:"text",className:"rpi-dropdown__search",placeholder:"Search country...",value:g,onChange:o=>$(o.target.value),"aria-label":"Search countries",autoComplete:"off"}),g&&r.jsx("button",{type:"button",className:"rpi-dropdown__search-clear",onClick:b,"aria-label":"Clear search",children:"×"})]}),r.jsx("ul",{ref:k,className:"rpi-dropdown__list",role:"listbox","aria-label":"Countries","aria-activedescendant":m>=0&&t[m]?`rpi-country-${t[m].code}`:void 0,children:t.length===0?r.jsx("li",{className:"rpi-dropdown__empty",children:"No countries found"}):t.map((o,x)=>{const c=o.code===e.code,C=x===m;return r.jsxs("li",{id:`rpi-country-${o.code}`,role:"option","aria-selected":c,className:["rpi-dropdown__item",c?"rpi-dropdown__item--selected":"",C?"rpi-dropdown__item--focused":""].filter(Boolean).join(" "),onClick:()=>l(o),onKeyDown:h=>{(h.key==="Enter"||h.key===" ")&&l(o)},children:[r.jsx("span",{className:"rpi-dropdown__item-flag","aria-hidden":"true",children:r.jsx("img",{src:`https://flagcdn.com/w20/${o.code.toLowerCase()}.png`,srcSet:`https://flagcdn.com/w40/${o.code.toLowerCase()}.png 2x`,width:"20",alt:o.code,loading:"lazy"})}),r.jsx("span",{className:"rpi-dropdown__item-name",children:o.name}),r.jsx("span",{className:"rpi-dropdown__item-code",children:o.dialCode})]},o.code)})})]})]})},G=n.forwardRef(({value:e,onChange:a,placeholder:X="Phone number",disabled:d=!1,isValid:i,hasError:m,hasValue:s,name:g,id:$,required:t,onBlur:b,onFocus:p},f)=>{const k=()=>s?i?"rpi-input--valid":m?"rpi-input--error":"":"";return r.jsx("input",{ref:f,type:"tel",inputMode:"numeric",className:`rpi-number-input ${k()}`,value:e,onChange:u=>a(u.target.value),placeholder:X,disabled:d,name:g,id:$,required:t,onBlur:b,onFocus:p,autoComplete:"tel-national","aria-label":"Phone number"})});G.displayName="NumberInput";const de=({value:e,onChange:a,defaultCountry:X="auto",placeholder:d="Phone number",disabled:i=!1,className:m="",style:s,name:g,id:$,required:t,error:b,onBlur:p,onFocus:f})=>{const k=n.useRef(null),{country:u,setCountry:S,nationalNumber:l,setNationalNumber:N,formatted:o,isValid:x,fullNumber:c}=_({defaultCountry:X,initialValue:e}),[C,h]=n.useState(!1),M=l.length>0,L=b||C&&!x&&M,P=n.useRef(!1),R=n.useRef(a);n.useEffect(()=>{R.current=a},[a]);const T=n.useRef({fullNumber:c,country:u.code,formatted:o});n.useEffect(()=>{if(!P.current){P.current=!0;return}T.current&&T.current.fullNumber===c&&T.current.country===u.code&&T.current.formatted===o||(T.current={fullNumber:c,country:u.code,formatted:o},R.current&&R.current(c,{country:u.code,dialCode:u.dialCode,nationalNumber:o,rawNumber:l,isValid:x}))},[u,c,o,l,x]);const O=W=>{S(W),setTimeout(()=>{var v;return(v=k.current)==null?void 0:v.focus()},50)},z=["rpi-wrapper",i?"rpi-wrapper--disabled":"",L?"rpi-wrapper--error":"",M&&x?"rpi-wrapper--valid":"",m].filter(Boolean).join(" ");return r.jsxs("div",{className:"rpi-root",children:[r.jsxs("div",{className:z,style:s,role:"group","aria-label":"Phone number input",children:[r.jsx(H,{selected:u,onChange:O,disabled:i}),r.jsx("div",{className:"rpi-divider","aria-hidden":"true"}),r.jsx(G,{ref:k,value:o,onChange:N,placeholder:d,disabled:i,isValid:x,hasError:L,hasValue:M,id:$,required:t,onBlur:()=>{h(!0),p&&p()},onFocus:()=>{f&&f()}})]}),r.jsx("input",{type:"hidden",value:c,name:g,id:$?`${$}-hidden`:void 0})]})};exports.CountryDropdown=H;exports.NumberInput=G;exports.PhoneInput=de;exports.applyMask=U;exports.buildFullNumber=Z;exports.countries=w;exports.defaultRule=V;exports.getCountriesByDialCode=J;exports.getCountryByCode=A;exports.getPhoneRule=y;exports.parseInternationalNumber=E;exports.phoneRules=j;exports.stripNonDigits=I;exports.usePhoneInput=_;exports.validatePhone=F;
|
|
2
|
+
//# sourceMappingURL=index.cjs.map
|