react-country-kit 1.0.0 β 1.1.1
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/LICENSE +21 -0
- package/README.md +51 -221
- package/dist/components/CountryMultiSelect/CountryMultiSelect.d.ts +2 -2
- package/dist/components/CountryPicker/CountryPicker.d.ts +2 -2
- package/dist/components/CurrencyMultiSelect/CurrencyMultiSelect.d.ts +2 -2
- package/dist/components/CurrencyPicker/CurrencyPicker.d.ts +2 -2
- package/dist/components/DivisionPicker/DivisionPicker.d.ts +2 -2
- package/dist/components/LanguagePicker/LanguagePicker.d.ts +2 -2
- package/dist/components/PhoneInput/PhoneInput.d.ts +2 -2
- package/dist/components/TimezonePicker/TimezonePicker.d.ts +2 -2
- package/dist/components/shared/Flag.d.ts +15 -0
- package/dist/components/shared/PickerBase.d.ts +2 -1
- package/dist/index.d.ts +1 -13
- package/dist/react-country-kit.cjs.js +1 -1
- package/dist/react-country-kit.cjs.js.map +1 -1
- package/dist/react-country-kit.d.ts +1 -354
- package/dist/react-country-kit.es.js +354 -362
- package/dist/react-country-kit.es.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/ui/components/CountryMultiSelect.d.ts +2 -1
- package/dist/ui/components/CountryPicker.d.ts +2 -1
- package/dist/ui/components/CurrencyMultiSelect.d.ts +2 -1
- package/dist/ui/components/CurrencyPicker.d.ts +2 -1
- package/dist/ui/components/DivisionPicker.d.ts +2 -1
- package/dist/ui/components/LanguagePicker.d.ts +2 -1
- package/dist/ui/components/PhoneInput.d.ts +3 -3
- package/dist/ui/components/TimezonePicker.d.ts +2 -1
- package/dist/ui/components/primitives.d.ts +11 -1
- package/dist/ui/index.d.ts +12 -12
- package/dist/ui/lib/utils.d.ts +2 -1
- package/dist/ui.cjs.js +1 -1
- package/dist/ui.cjs.js.map +1 -1
- package/dist/ui.d.ts +1 -413
- package/dist/ui.es.js +370 -350
- package/dist/ui.es.js.map +1 -1
- package/package.json +11 -2
- package/dist/data/countries.d.ts +0 -10
- package/dist/data/languages.d.ts +0 -3
- package/dist/hooks/useBasePicker.d.ts +0 -6
- package/dist/hooks/useCountryPicker.d.ts +0 -2
- package/dist/hooks/useCurrencyPicker.d.ts +0 -2
- package/dist/hooks/useDivisionPicker.d.ts +0 -2
- package/dist/hooks/useLanguagePicker.d.ts +0 -2
- package/dist/hooks/useMultiSelect.d.ts +0 -6
- package/dist/hooks/usePhoneInput.d.ts +0 -17
- package/dist/hooks/useTimezonePicker.d.ts +0 -2
- package/dist/types/index.d.ts +0 -185
- package/dist/useTimezonePicker-BMFPsn3E.mjs +0 -36086
- package/dist/useTimezonePicker-BMFPsn3E.mjs.map +0 -1
- package/dist/useTimezonePicker-zHCM2pUC.js +0 -2
- package/dist/useTimezonePicker-zHCM2pUC.js.map +0 -1
- package/dist/utils/countries.d.ts +0 -46
- package/dist/utils/currencies.d.ts +0 -13
- package/dist/utils/languages.d.ts +0 -13
- package/dist/utils/timezones.d.ts +0 -13
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Kishor Mainali
|
|
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
CHANGED
|
@@ -1,258 +1,88 @@
|
|
|
1
|
-
# react-country-kit
|
|
1
|
+
# react-country-kit
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Beautiful, accessible, and performant React components for choosing countries, currencies, timezones, and more.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## Features
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
- **Standard & Shadcn Variants**: Comes with two pre-built styles.
|
|
8
|
+
- **Accessible**: Built with accessibility in mind (ARIA roles, keyboard navigation).
|
|
9
|
+
- **Responsive**: Works perfectly on mobile and desktop.
|
|
10
|
+
- **Reliable Flags**: Automatic image fallback for Windows users.
|
|
11
|
+
- **Tree-shakeable**: Only bundle what you use.
|
|
11
12
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
## β¨ Features
|
|
15
|
-
|
|
16
|
-
- π― **8+ Premium Pickers** β Country, Currency, Timezone, Language, Division, PhoneInput, and Multi-select.
|
|
17
|
-
- π **Global Database** β 250 countries with ISO data, flags, phone formats, and localized divisions.
|
|
18
|
-
- π¨ **Dual-Path Styling**:
|
|
19
|
-
- **Vanilla Path** (`react-country-kit`): Zero-config, self-contained CSS.
|
|
20
|
-
- **shadcn/UI Path** (`react-country-kit/ui`): Radix-powered, fully Tailwind-driven.
|
|
21
|
-
- π **Smart PhoneInput**: Automatic validation, dial code sync, and standard formatting.
|
|
22
|
-
- π **MultiSelect**: High-performance multi-selection with smart overflow management.
|
|
23
|
-
- β‘ **Auto-Selection**: Intelligent dependent fields (select country β auto-select currency/timezone).
|
|
24
|
-
- π **Fuzzy Search**: Blazing fast search across all pickers (names, codes, symbols).
|
|
25
|
-
- π£ **Headless Hooks**: Logic-only hooks to build your own unique UI.
|
|
26
|
-
- π **Theme Ready**: Native dark mode support for both CSS and Tailwind.
|
|
27
|
-
- βΏ **A11y**: Fully keyboard navigable and ARIA-compliant.
|
|
28
|
-
|
|
29
|
-
---
|
|
30
|
-
|
|
31
|
-
## π¦ Installation
|
|
32
|
-
|
|
33
|
-
```bash
|
|
34
|
-
npm install react-country-kit
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
### Choose Your Style
|
|
38
|
-
|
|
39
|
-
#### 1. The Vanilla Path (Quickest)
|
|
40
|
-
Best for projects without Tailwind or when you want our curated design.
|
|
41
|
-
|
|
42
|
-
```ts
|
|
43
|
-
import 'react-country-kit/styles';
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
#### 2. The shadcn/Tailwind Path (Full Control)
|
|
47
|
-
Best for projects using Tailwind CSS. It integrates seamlessly with your existing shadcn/ui tokens.
|
|
13
|
+
## Installation
|
|
48
14
|
|
|
49
15
|
```bash
|
|
50
|
-
npm install
|
|
16
|
+
npm install react-country-kit react-country-kit-core
|
|
51
17
|
```
|
|
52
|
-
*No CSS import required for the `/ui` path.*
|
|
53
18
|
|
|
54
|
-
|
|
19
|
+
## Usage
|
|
55
20
|
|
|
56
|
-
|
|
21
|
+
### 1. Standard UI (Vanilla CSS)
|
|
57
22
|
|
|
58
|
-
|
|
59
|
-
Select a country and watch the currency and timezone pickers update automatically.
|
|
23
|
+
Simple, clean components with no external styling dependencies.
|
|
60
24
|
|
|
61
25
|
```tsx
|
|
62
|
-
import {
|
|
63
|
-
import
|
|
64
|
-
import 'react-country-kit/styles';
|
|
65
|
-
|
|
66
|
-
function RegistrationForm() {
|
|
67
|
-
const [country, setCountry] = useState(null);
|
|
68
|
-
const [currency, setCurrency] = useState(null);
|
|
69
|
-
const [timezone, setTimezone] = useState(null);
|
|
26
|
+
import { CountryPicker, PhoneInput } from 'react-country-kit';
|
|
27
|
+
import 'react-country-kit/styles'; // Don't forget the CSS!
|
|
70
28
|
|
|
29
|
+
function StandardApp() {
|
|
71
30
|
return (
|
|
72
31
|
<div className="space-y-4">
|
|
73
|
-
<CountryPicker
|
|
74
|
-
|
|
75
|
-
value={country}
|
|
76
|
-
onChange={(c) => {
|
|
77
|
-
setCountry(c);
|
|
78
|
-
setCurrency(null); // Triggers auto-select
|
|
79
|
-
setTimezone(null); // Triggers auto-select
|
|
80
|
-
}}
|
|
81
|
-
/>
|
|
82
|
-
|
|
83
|
-
<CurrencyPicker
|
|
84
|
-
label="Preferred Currency"
|
|
85
|
-
countryIso2={country?.iso2}
|
|
86
|
-
value={currency}
|
|
87
|
-
onChange={setCurrency}
|
|
88
|
-
/>
|
|
89
|
-
|
|
90
|
-
<TimezonePicker
|
|
91
|
-
label="Local Timezone"
|
|
92
|
-
countryIso2={country?.iso2}
|
|
93
|
-
value={timezone}
|
|
94
|
-
onChange={setTimezone}
|
|
95
|
-
/>
|
|
32
|
+
<CountryPicker onChange={console.log} label="Select Country" />
|
|
33
|
+
<PhoneInput onChange={console.log} label="Phone Number" />
|
|
96
34
|
</div>
|
|
97
35
|
);
|
|
98
36
|
}
|
|
99
37
|
```
|
|
100
38
|
|
|
101
|
-
###
|
|
102
|
-
Includes country selection, dial code prefix, and number input with standard patterns.
|
|
103
|
-
|
|
104
|
-
```tsx
|
|
105
|
-
import { PhoneInput } from 'react-country-kit/ui';
|
|
106
|
-
|
|
107
|
-
function ContactForm() {
|
|
108
|
-
const [phone, setPhone] = useState(null);
|
|
109
|
-
|
|
110
|
-
return (
|
|
111
|
-
<PhoneInput
|
|
112
|
-
value={phone}
|
|
113
|
-
onChange={setPhone}
|
|
114
|
-
defaultCountryIso2="US"
|
|
115
|
-
label="Mobile Number"
|
|
116
|
-
className="w-full"
|
|
117
|
-
/>
|
|
118
|
-
);
|
|
119
|
-
}
|
|
120
|
-
// phone value: { country, dialCode: "+1", number: "5550123", full: "+15550123" }
|
|
121
|
-
```
|
|
122
|
-
|
|
123
|
-
---
|
|
124
|
-
|
|
125
|
-
## π Component API
|
|
126
|
-
|
|
127
|
-
### Common Props
|
|
128
|
-
All pickers share these core props:
|
|
129
|
-
- `value`: Current selection object (see [Interfaces](#π-typescript-interfaces)).
|
|
130
|
-
- `onChange`: Callback function when a selection is made.
|
|
131
|
-
- `label`: Optional floating/field label.
|
|
132
|
-
- `placeholder`: Custom placeholder text.
|
|
133
|
-
- `disabled`: Boolean to disable interactions.
|
|
134
|
-
- `searchable`: Enable/disable the search input (default: `true`).
|
|
135
|
-
|
|
136
|
-
### Picker-Specific Props
|
|
137
|
-
|
|
138
|
-
| Component | Unique Props | Description |
|
|
139
|
-
|---|---|---|
|
|
140
|
-
| `<CountryPicker />` | `showFlag`, `showPhoneCode` | Toggle flag and dial code visibility. |
|
|
141
|
-
| `<CurrencyPicker />` | `countryIso2`, `autoSelect`, `showSymbol` | Filters by country and auto-selects primary currency. |
|
|
142
|
-
| `<TimezonePicker />` | `countryIso2`, `autoSelect` | Filters by country and auto-selects primary timezone. |
|
|
143
|
-
| `<LanguagePicker />` | `showNativeName` | Display "EspaΓ±ol" alongside "Spanish". |
|
|
144
|
-
| `<DivisionPicker />` | `countryIso2` (Required) | Dynamically loads states/provinces for the country. |
|
|
145
|
-
|
|
146
|
-
---
|
|
147
|
-
|
|
148
|
-
## π£ Headless Hooks
|
|
39
|
+
### 2. Shadcn/UI Variant (Tailwind + Radix)
|
|
149
40
|
|
|
150
|
-
|
|
41
|
+
Premium, modern components that blend perfectly with your Shadcn/UI project.
|
|
151
42
|
|
|
152
43
|
```tsx
|
|
153
|
-
import {
|
|
154
|
-
|
|
155
|
-
function MyCustomPicker() {
|
|
156
|
-
const {
|
|
157
|
-
isOpen, toggle,
|
|
158
|
-
filteredItems, searchQuery,
|
|
159
|
-
setSearchQuery, selectItem
|
|
160
|
-
} = useCountryPicker();
|
|
44
|
+
import { CountryPicker } from 'react-country-kit/ui';
|
|
161
45
|
|
|
46
|
+
function ShadcnApp() {
|
|
162
47
|
return (
|
|
163
|
-
<div>
|
|
164
|
-
<
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
</li>
|
|
171
|
-
))}
|
|
172
|
-
</ul>
|
|
173
|
-
)}
|
|
48
|
+
<div className="p-10 max-w-md">
|
|
49
|
+
<CountryPicker
|
|
50
|
+
onChange={console.log}
|
|
51
|
+
label="Destination"
|
|
52
|
+
showFlag={true}
|
|
53
|
+
showPhoneCode={true}
|
|
54
|
+
/>
|
|
174
55
|
</div>
|
|
175
56
|
);
|
|
176
57
|
}
|
|
177
58
|
```
|
|
178
59
|
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
## π TypeScript Interfaces
|
|
60
|
+
> **Note**: The Shadcn variant requires `tailwindcss`, `clsx`, `tailwind-merge`, and `@radix-ui/react-popover` as peer dependencies.
|
|
182
61
|
|
|
183
|
-
|
|
184
|
-
export interface Country {
|
|
185
|
-
name: string;
|
|
186
|
-
iso2: string;
|
|
187
|
-
iso3: string;
|
|
188
|
-
phone_code: string;
|
|
189
|
-
flag: string;
|
|
190
|
-
currency: Currency;
|
|
191
|
-
timezones: Timezone[];
|
|
192
|
-
division_type: string;
|
|
193
|
-
divisions: Division[];
|
|
194
|
-
}
|
|
195
|
-
|
|
196
|
-
export interface Currency {
|
|
197
|
-
code: string;
|
|
198
|
-
name: string;
|
|
199
|
-
symbol: string;
|
|
200
|
-
}
|
|
62
|
+
## Components List
|
|
201
63
|
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
---
|
|
212
|
-
|
|
213
|
-
## π οΈ Utility Functions
|
|
214
|
-
|
|
215
|
-
We export several helper functions for data manipulation:
|
|
216
|
-
|
|
217
|
-
```ts
|
|
218
|
-
import {
|
|
219
|
-
getCountryByIso2,
|
|
220
|
-
getAllCurrencies,
|
|
221
|
-
getTimezonesByCountry,
|
|
222
|
-
iso2ToFlag
|
|
223
|
-
} from 'react-country-kit';
|
|
224
|
-
|
|
225
|
-
const uk = getCountryByIso2('GB');
|
|
226
|
-
const flag = iso2ToFlag('CA'); // π¨π¦
|
|
227
|
-
const timezones = getTimezonesByCountry('US');
|
|
228
|
-
```
|
|
229
|
-
|
|
230
|
-
---
|
|
231
|
-
|
|
232
|
-
## π Customization & Theming
|
|
233
|
-
|
|
234
|
-
### Vanilla CSS
|
|
235
|
-
Target the CSS variables in your global stylesheet:
|
|
236
|
-
```css
|
|
237
|
-
:root {
|
|
238
|
-
--rck-primary: #6366f1;
|
|
239
|
-
--rck-background: #ffffff;
|
|
240
|
-
--rck-foreground: #0f172a;
|
|
241
|
-
--rck-radius: 0.75rem;
|
|
242
|
-
}
|
|
243
|
-
```
|
|
64
|
+
- `CountryPicker`
|
|
65
|
+
- `CountryMultiSelect`
|
|
66
|
+
- `PhoneInput`
|
|
67
|
+
- `CurrencyPicker`
|
|
68
|
+
- `CurrencyMultiSelect`
|
|
69
|
+
- `TimezonePicker`
|
|
70
|
+
- `LanguagePicker`
|
|
71
|
+
- `DivisionPicker`
|
|
244
72
|
|
|
245
|
-
|
|
246
|
-
The components automatically use your `tailwind.config.js` and CSS variables:
|
|
247
|
-
- `bg-background` / `text-foreground`
|
|
248
|
-
- `border-input`
|
|
249
|
-
- `bg-primary` / `text-primary-foreground`
|
|
250
|
-
- `bg-accent` / `text-accent-foreground`
|
|
73
|
+
## Props
|
|
251
74
|
|
|
252
|
-
|
|
75
|
+
Most components share a similar API:
|
|
253
76
|
|
|
254
|
-
|
|
77
|
+
| Prop | Type | Description |
|
|
78
|
+
| :--- | :--- | :--- |
|
|
79
|
+
| `value` | `T` | The current selected value. |
|
|
80
|
+
| `onChange` | `(val: T) => void` | Callback when value changes. |
|
|
81
|
+
| `label` | `string` | Optional field label. |
|
|
82
|
+
| `placeholder` | `string` | Input placeholder. |
|
|
83
|
+
| `showFlag` | `boolean` | Whether to show the country flag (default: true). |
|
|
84
|
+
| `disabled` | `boolean` | Disable the component. |
|
|
255
85
|
|
|
256
|
-
|
|
86
|
+
## License
|
|
257
87
|
|
|
258
|
-
|
|
88
|
+
MIT
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { CountryMultiSelectProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function CountryMultiSelect({ value, onChange, placeholder, maxItems, showFlags, searchable, disabled, className, label, }: CountryMultiSelectProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { CountryPickerProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function CountryPicker({ value, onChange, placeholder, searchable, showFlag, showPhoneCode, disabled, className, label, }: CountryPickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { CurrencyMultiSelectProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function CurrencyMultiSelect({ value, onChange, placeholder, maxItems, showSymbol, searchable, disabled, className, label, }: CurrencyMultiSelectProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { CurrencyPickerProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function CurrencyPicker({ value, onChange, placeholder, searchable, showSymbol, disabled, className, label, }: CurrencyPickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { DivisionPickerProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function DivisionPicker({ countryIso2, value, onChange, placeholder, searchable, disabled, className, label, }: DivisionPickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { LanguagePickerProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function LanguagePicker({ value, onChange, placeholder, searchable, showNativeName, disabled, className, label, }: LanguagePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { PhoneInputProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function PhoneInput({ value, onChange, defaultCountryIso2, placeholder, showFlag, disabled, className, label, }: PhoneInputProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { TimezonePickerProps } from 'react-country-kit-core';
|
|
2
|
+
|
|
3
3
|
export declare function TimezonePicker({ value, onChange, placeholder, searchable, countryIso2, disabled, className, label, }: TimezonePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
|
|
3
|
+
export interface FlagProps {
|
|
4
|
+
iso2: string;
|
|
5
|
+
flag?: string;
|
|
6
|
+
flagUrl?: string;
|
|
7
|
+
className?: string;
|
|
8
|
+
alt?: string;
|
|
9
|
+
mode?: 'emoji' | 'image' | 'auto';
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Flag component that handles both emoji and image flags.
|
|
13
|
+
* 'auto' mode uses emoji by default but provides image as an alternative.
|
|
14
|
+
*/
|
|
15
|
+
export declare const Flag: React.FC<FlagProps>;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
export * from 'react-country-kit-core';
|
|
1
2
|
export { CountryMultiSelect } from './components/CountryMultiSelect/CountryMultiSelect';
|
|
2
3
|
export { CountryPicker } from './components/CountryPicker/CountryPicker';
|
|
3
4
|
export { CurrencyMultiSelect } from './components/CurrencyMultiSelect/CurrencyMultiSelect';
|
|
@@ -6,16 +7,3 @@ export { DivisionPicker } from './components/DivisionPicker/DivisionPicker';
|
|
|
6
7
|
export { LanguagePicker } from './components/LanguagePicker/LanguagePicker';
|
|
7
8
|
export { PhoneInput } from './components/PhoneInput/PhoneInput';
|
|
8
9
|
export { TimezonePicker } from './components/TimezonePicker/TimezonePicker';
|
|
9
|
-
export { useBasePicker } from './hooks/useBasePicker';
|
|
10
|
-
export { useCountryPicker } from './hooks/useCountryPicker';
|
|
11
|
-
export { useCurrencyPicker } from './hooks/useCurrencyPicker';
|
|
12
|
-
export { useDivisionPicker } from './hooks/useDivisionPicker';
|
|
13
|
-
export { useLanguagePicker } from './hooks/useLanguagePicker';
|
|
14
|
-
export { useMultiSelect } from './hooks/useMultiSelect';
|
|
15
|
-
export { usePhoneInput } from './hooks/usePhoneInput';
|
|
16
|
-
export { useTimezonePicker } from './hooks/useTimezonePicker';
|
|
17
|
-
export { getAllCountries, getCountryByIso2, getCountryByIso3, getCountryByName, getCurrencyByCountry, getDivisionsByCountry, getTimezonesByCountry, iso2ToFlag, searchCountries } from './utils/countries';
|
|
18
|
-
export { getAllCurrencies, getCurrencyByCode, searchCurrencies } from './utils/currencies';
|
|
19
|
-
export { getAllTimezones, getTimezoneByName, searchTimezones } from './utils/timezones';
|
|
20
|
-
export { getAllLanguages, getLanguageByCode, searchLanguages } from './utils/languages';
|
|
21
|
-
export type { Country, CountryMultiSelectProps, CountryPickerProps, Currency, CurrencyMultiSelectProps, CurrencyPickerProps, Division, DivisionPickerProps, Language, LanguagePickerProps, PhoneFormat, PhoneInputProps, PhoneValue, Timezone, TimezonePickerProps, UseMultiSelectReturn, UsePickerReturn } from './types';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),l=require("./useTimezonePicker-zHCM2pUC.js");function j({value:n,onChange:o,placeholder:u="Search...",autoFocus:h=!0}){const m=g.useRef(null);return g.useEffect(()=>{h&&setTimeout(()=>{var d;return(d=m.current)==null?void 0:d.focus()},50)},[h]),e.jsx("div",{className:"rck-search-wrapper",children:e.jsxs("div",{className:"rck-search",children:[e.jsxs("svg",{className:"rck-search-icon",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("circle",{cx:"8.5",cy:"8.5",r:"5.5"}),e.jsx("path",{d:"M17 17l-4-4",strokeLinecap:"round"})]}),e.jsx("input",{ref:m,type:"text",value:n,onChange:d=>o(d.target.value),placeholder:u,"aria-label":"Search"}),n&&e.jsx("button",{style:{background:"none",border:"none",cursor:"pointer",color:"var(--rck-text-placeholder)",padding:0,display:"flex"},onClick:()=>o(""),"aria-label":"Clear search",type:"button",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{d:"M6 6l8 8M14 6l-8 8",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",fill:"none"})})})]})})}const f=3;function b(){return e.jsx("svg",{viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})})}function v({value:n,onChange:o,placeholder:u="Select countries...",maxItems:h,showFlags:m=!0,searchable:d=!0,disabled:x=!1,className:p,label:s}){const r=l.useMultiSelect(l.getAllCountries(),(i,a)=>a?l.searchCountries(a):i,i=>i.iso2,n,o,h),c=g.useRef(null);g.useEffect(()=>{if(!r.isOpen)return;const i=a=>{c.current&&!c.current.contains(a.target)&&r.close()};return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[r.isOpen,r.close]),g.useEffect(()=>{if(!r.isOpen)return;const i=a=>{a.key==="Escape"&&r.close()};return document.addEventListener("keydown",i),()=>document.removeEventListener("keydown",i)},[r.isOpen,r.close]);const t=n.slice(0,f),k=n.length-f;return e.jsxs("div",{ref:c,className:`rck-picker${p?` ${p}`:""}`,children:[s&&e.jsx("span",{className:"rck-label",children:s}),e.jsxs("button",{type:"button",className:`rck-multiselect-trigger${r.isOpen?" rck-open":""}`,disabled:x,onClick:r.toggle,"aria-haspopup":"listbox","aria-expanded":r.isOpen,children:[e.jsx("div",{className:"rck-chips-area",children:n.length===0?e.jsx("span",{style:{color:"var(--rck-text-placeholder)",fontSize:"0.9375rem"},children:u}):e.jsxs(e.Fragment,{children:[t.map(i=>e.jsxs("span",{className:"rck-chip",children:[m&&e.jsx("span",{children:i.flag}),e.jsx("span",{className:"rck-chip-label",children:i.name}),e.jsx("button",{type:"button",className:"rck-chip-remove",onClick:a=>{a.stopPropagation(),r.removeItem(i),o(n.filter(N=>N.iso2!==i.iso2))},"aria-label":`Remove ${i.name}`,children:e.jsxs("svg",{width:"10",height:"10",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})})]},i.iso2)),k>0&&e.jsxs("span",{className:"rck-chip-overflow",children:["+",k," more"]})]})}),n.length>0&&e.jsx("button",{type:"button",className:"rck-multiselect-clear",onClick:i=>{i.stopPropagation(),r.clearAll(),o([])},"aria-label":"Clear all",children:e.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})}),e.jsx("svg",{className:"rck-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})})]}),r.isOpen&&e.jsxs("div",{className:"rck-dropdown",role:"listbox","aria-multiselectable":"true",children:[d&&e.jsx(j,{value:r.searchQuery,onChange:r.setSearchQuery,placeholder:"Search countries..."}),e.jsx("ul",{className:"rck-list",children:r.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No countries found"})]}):r.filteredItems.map(i=>{const a=r.isSelected(i);return e.jsxs("li",{role:"option","aria-selected":a,className:`rck-item${a?" rck-item-selected":""}`,onClick:()=>r.toggleItem(i),tabIndex:0,onKeyDown:N=>N.key==="Enter"&&r.toggleItem(i),children:[e.jsx("div",{className:a?"rck-item-check-multi":"rck-item-check-empty",children:a&&e.jsx(b,{})}),m&&e.jsx("span",{className:"rck-item-flag",children:i.flag}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:i.name}),e.jsxs("span",{className:"rck-item-sub",children:[i.iso3," Β· +",i.phone_code]})]})]},i.iso2)})})]})]})}const I=()=>e.jsx("svg",{className:"rck-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})});function y({isOpen:n,onClose:o,onToggle:u,label:h,disabled:m,className:d,triggerContent:x,children:p,id:s}){const r=g.useRef(null);return g.useEffect(()=>{if(!n)return;const c=t=>{r.current&&!r.current.contains(t.target)&&o()};return document.addEventListener("mousedown",c),()=>document.removeEventListener("mousedown",c)},[n,o]),g.useEffect(()=>{if(!n)return;const c=t=>{t.key==="Escape"&&o()};return document.addEventListener("keydown",c),()=>document.removeEventListener("keydown",c)},[n,o]),e.jsxs("div",{ref:r,className:`rck-picker${d?` ${d}`:""}`,children:[h&&e.jsx("span",{className:"rck-label",id:s?`${s}-label`:void 0,children:h}),e.jsxs("button",{type:"button",className:`rck-trigger${n?" rck-open":""}`,disabled:m,"aria-haspopup":"listbox","aria-expanded":n,"aria-labelledby":s&&h?`${s}-label`:void 0,id:s,onClick:u,children:[x,e.jsx(I,{})]}),n&&e.jsx("div",{className:"rck-dropdown",role:"listbox",children:p})]})}const L=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function w({value:n,onChange:o,placeholder:u="Select a country",searchable:h=!0,showFlag:m=!0,showPhoneCode:d=!1,disabled:x=!1,className:p,label:s}){const r=l.useCountryPicker(n,o),c=e.jsx("div",{className:"rck-trigger-content",children:n?e.jsxs(e.Fragment,{children:[m&&e.jsx("span",{className:"rck-flag",children:n.flag}),e.jsx("span",{className:"rck-trigger-text",children:n.name}),d&&e.jsxs("span",{className:"rck-badge",children:["+",n.phone_code]})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:u})});return e.jsxs(y,{isOpen:r.isOpen,onClose:r.close,onToggle:r.toggle,label:s,disabled:x,className:p,triggerContent:c,id:"rck-country-picker",children:[h&&e.jsx(j,{value:r.searchQuery,onChange:r.setSearchQuery,placeholder:"Search country..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Countries",children:r.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No countries found"})]}):r.filteredItems.map(t=>{const k=(n==null?void 0:n.iso2)===t.iso2;return e.jsxs("li",{role:"option","aria-selected":k,className:`rck-item${k?" rck-item-selected":""}`,onClick:()=>r.selectItem(t),tabIndex:0,onKeyDown:i=>i.key==="Enter"&&r.selectItem(t),children:[m&&e.jsx("span",{className:"rck-item-flag",children:t.flag}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:t.name}),e.jsxs("span",{className:"rck-item-sub",children:[t.iso3," Β· ",t.division_type]})]}),e.jsxs("div",{className:"rck-item-right",children:[d&&e.jsxs("span",{className:"rck-item-phone",children:["+",t.phone_code]}),k&&e.jsx(L,{})]})]},t.iso2)})})]})}const C=3;function S(){return e.jsx("svg",{viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})})}function P({value:n,onChange:o,placeholder:u="Select currencies...",maxItems:h,showSymbol:m=!0,searchable:d=!0,disabled:x=!1,className:p,label:s}){const r=l.useMultiSelect(l.getAllCurrencies(),(i,a)=>a?l.searchCurrencies(a):i,i=>i.code,n,o,h),c=g.useRef(null);g.useEffect(()=>{if(!r.isOpen)return;const i=a=>{c.current&&!c.current.contains(a.target)&&r.close()};return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[r.isOpen,r.close]),g.useEffect(()=>{if(!r.isOpen)return;const i=a=>{a.key==="Escape"&&r.close()};return document.addEventListener("keydown",i),()=>document.removeEventListener("keydown",i)},[r.isOpen,r.close]);const t=n.slice(0,C),k=n.length-C;return e.jsxs("div",{ref:c,className:`rck-picker${p?` ${p}`:""}`,children:[s&&e.jsx("span",{className:"rck-label",children:s}),e.jsxs("button",{type:"button",className:`rck-multiselect-trigger${r.isOpen?" rck-open":""}`,disabled:x,onClick:r.toggle,"aria-haspopup":"listbox","aria-expanded":r.isOpen,children:[e.jsx("div",{className:"rck-chips-area",children:n.length===0?e.jsx("span",{style:{color:"var(--rck-text-placeholder)",fontSize:"0.9375rem"},children:u}):e.jsxs(e.Fragment,{children:[t.map(i=>e.jsxs("span",{className:"rck-chip",children:[m&&e.jsx("span",{children:i.symbol}),e.jsx("span",{className:"rck-chip-label",children:i.code}),e.jsx("button",{type:"button",className:"rck-chip-remove",onClick:a=>{a.stopPropagation(),o(n.filter(N=>N.code!==i.code))},"aria-label":`Remove ${i.code}`,children:e.jsxs("svg",{width:"10",height:"10",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})})]},i.code)),k>0&&e.jsxs("span",{className:"rck-chip-overflow",children:["+",k," more"]})]})}),n.length>0&&e.jsx("button",{type:"button",className:"rck-multiselect-clear",onClick:i=>{i.stopPropagation(),r.clearAll(),o([])},"aria-label":"Clear all",children:e.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})}),e.jsx("svg",{className:"rck-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})})]}),r.isOpen&&e.jsxs("div",{className:"rck-dropdown",role:"listbox","aria-multiselectable":"true",children:[d&&e.jsx(j,{value:r.searchQuery,onChange:r.setSearchQuery,placeholder:"Search currencies..."}),e.jsx("ul",{className:"rck-list",children:r.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π°"}),e.jsx("span",{children:"No currencies found"})]}):r.filteredItems.map(i=>{const a=r.isSelected(i);return e.jsxs("li",{role:"option","aria-selected":a,className:`rck-item${a?" rck-item-selected":""}`,onClick:()=>r.toggleItem(i),tabIndex:0,onKeyDown:N=>N.key==="Enter"&&r.toggleItem(i),children:[e.jsx("div",{className:a?"rck-item-check-multi":"rck-item-check-empty",children:a&&e.jsx(S,{})}),m&&e.jsx("span",{className:"rck-item-symbol",children:i.symbol}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:i.name}),e.jsx("span",{className:"rck-item-sub",children:i.code})]})]},i.code)})})]})]})}const B=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function E({value:n,onChange:o,placeholder:u="Select a currency",searchable:h=!0,showSymbol:m=!0,disabled:d=!1,className:x,label:p}){const s=l.useCurrencyPicker(n,o),r=e.jsx("div",{className:"rck-trigger-content",children:n?e.jsxs(e.Fragment,{children:[m&&e.jsx("span",{className:"rck-item-symbol",children:n.symbol}),e.jsxs("span",{className:"rck-trigger-text",children:[n.code," β ",n.name]})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:u})});return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:p,disabled:d,className:x,triggerContent:r,id:"rck-currency-picker",children:[h&&e.jsx(j,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search currency..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Currencies",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π°"}),e.jsx("span",{children:"No currencies found"})]}):s.filteredItems.map(c=>{const t=(n==null?void 0:n.code)===c.code;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectItem(c),tabIndex:0,onKeyDown:k=>k.key==="Enter"&&s.selectItem(c),children:[m&&e.jsx("span",{className:"rck-item-symbol",children:c.symbol}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.name}),e.jsx("span",{className:"rck-item-sub",children:c.code})]}),t&&e.jsx(B,{})]},c.code)})})]})}const $=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function O({countryIso2:n,value:o,onChange:u,placeholder:h="Select a division",searchable:m=!0,disabled:d=!1,className:x,label:p}){const s=l.useDivisionPicker(n,o,u),r=e.jsx("div",{className:"rck-trigger-content",children:o?e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"rck-trigger-text",children:o.name}),e.jsx("span",{className:"rck-badge",children:o.iso2})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:h})}),c=d||!n;return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:p,disabled:c,className:x,triggerContent:r,id:"rck-division-picker",children:[m&&e.jsx(j,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search division..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Divisions",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"πΊοΈ"}),e.jsx("span",{children:"No divisions found"})]}):s.filteredItems.map(t=>{const k=(o==null?void 0:o.iso2)===t.iso2&&(o==null?void 0:o.name)===t.name;return e.jsxs("li",{role:"option","aria-selected":k,className:`rck-item${k?" rck-item-selected":""}`,onClick:()=>s.selectItem(t),tabIndex:0,onKeyDown:i=>i.key==="Enter"&&s.selectItem(t),children:[e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:t.name}),e.jsx("span",{className:"rck-item-sub",children:t.timezone})]}),e.jsxs("div",{className:"rck-item-right",children:[e.jsx("span",{className:"rck-badge",children:t.iso2}),k&&e.jsx($,{})]})]},`${t.iso2}-${t.name}`)})})]})}const T=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function _({value:n,onChange:o,placeholder:u="Select a language",searchable:h=!0,showNativeName:m=!0,disabled:d=!1,className:x,label:p}){const s=l.useLanguagePicker(n,o),r=e.jsx("div",{className:"rck-trigger-content",children:n?e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"rck-trigger-text",children:n.english_name}),m&&n.native_name!==n.english_name&&e.jsx("span",{className:"rck-native-name",children:n.native_name})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:u})});return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:p,disabled:d,className:x,triggerContent:r,id:"rck-language-picker",children:[h&&e.jsx(j,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search language..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Languages",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No languages found"})]}):s.filteredItems.map(c=>{const t=(n==null?void 0:n.code)===c.code;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectItem(c),tabIndex:0,onKeyDown:k=>k.key==="Enter"&&s.selectItem(c),children:[e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.english_name}),m&&c.native_name!==c.english_name&&e.jsx("span",{className:"rck-item-sub",children:c.native_name})]}),e.jsxs("div",{className:"rck-item-right",children:[e.jsx("span",{className:"rck-badge",style:{fontSize:"0.68rem"},children:c.code}),t&&e.jsx(T,{})]})]},c.code)})})]})}function z({value:n,onChange:o,defaultCountryIso2:u="US",placeholder:h="Phone number",showFlag:m=!0,disabled:d=!1,className:x,label:p}){const s=l.usePhoneInput(n,o,u),r=g.useRef(null);return g.useEffect(()=>{if(!s.isOpen)return;const c=t=>{r.current&&!r.current.contains(t.target)&&s.close()};return document.addEventListener("mousedown",c),()=>document.removeEventListener("mousedown",c)},[s.isOpen,s.close]),g.useEffect(()=>{if(!s.isOpen)return;const c=t=>{t.key==="Escape"&&s.close()};return document.addEventListener("keydown",c),()=>document.removeEventListener("keydown",c)},[s.isOpen,s.close]),e.jsxs("div",{ref:r,className:`rck-phone-wrapper${x?` ${x}`:""}`,children:[p&&e.jsx("span",{className:"rck-label",children:p}),e.jsxs("div",{className:`rck-phone-field${d?" rck-phone-disabled":""}`,children:[e.jsxs("button",{type:"button",className:"rck-phone-country-btn",onClick:s.toggle,"aria-expanded":s.isOpen,"aria-label":"Select country code",disabled:d,children:[m&&s.country&&e.jsx("span",{className:"rck-phone-flag",children:s.country.flag}),e.jsx("span",{className:"rck-phone-dial",children:s.country?`+${s.country.phone_code}`:"+?"}),e.jsx("svg",{className:"rck-phone-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})})]}),e.jsx("input",{type:"tel",className:"rck-phone-input",value:s.number,onChange:c=>s.setNumber(c.target.value),placeholder:h,disabled:d,inputMode:"numeric",autoComplete:"tel-national"}),s.isOpen&&e.jsxs("div",{className:"rck-phone-dropdown",children:[e.jsx(j,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search country or dial code..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Countries",children:s.filteredCountries.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No countries found"})]}):s.filteredCountries.map(c=>{var k;const t=((k=s.country)==null?void 0:k.iso2)===c.iso2;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectCountry(c),tabIndex:0,onKeyDown:i=>i.key==="Enter"&&s.selectCountry(c),children:[e.jsx("span",{className:"rck-item-flag",children:c.flag}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.name}),e.jsx("span",{className:"rck-item-sub",children:c.iso2})]}),e.jsxs("span",{className:"rck-item-phone",children:["+",c.phone_code]})]},c.iso2)})})]})]})]})}const D=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function W({value:n,onChange:o,placeholder:u="Select a timezone",searchable:h=!0,countryIso2:m,disabled:d=!1,className:x,label:p}){const s=l.useTimezonePicker(n,o,m),r=e.jsx("div",{className:"rck-trigger-content",children:n?e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"rck-trigger-text",children:n.name}),e.jsx("span",{className:"rck-badge",children:n.offset_name})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:u})});return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:p,disabled:d,className:x,triggerContent:r,id:"rck-timezone-picker",children:[h&&e.jsx(j,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search timezone..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Timezones",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No timezones found"})]}):s.filteredItems.map(c=>{const t=(n==null?void 0:n.name)===c.name;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectItem(c),tabIndex:0,onKeyDown:k=>k.key==="Enter"&&s.selectItem(c),children:[e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.name}),e.jsxs("span",{className:"rck-item-sub",children:[c.tzName," Β· ",c.abbreviation]})]}),e.jsxs("div",{className:"rck-item-right",children:[e.jsx("span",{className:"rck-offset-badge",children:c.offset_name}),t&&e.jsx(D,{})]})]},c.name)})})]})}exports.getAllCountries=l.getAllCountries;exports.getAllCurrencies=l.getAllCurrencies;exports.getAllLanguages=l.getAllLanguages;exports.getAllTimezones=l.getAllTimezones;exports.getCountryByIso2=l.getCountryByIso2;exports.getCountryByIso3=l.getCountryByIso3;exports.getCountryByName=l.getCountryByName;exports.getCurrencyByCode=l.getCurrencyByCode;exports.getCurrencyByCountry=l.getCurrencyByCountry;exports.getDivisionsByCountry=l.getDivisionsByCountry;exports.getLanguageByCode=l.getLanguageByCode;exports.getTimezoneByName=l.getTimezoneByName;exports.getTimezonesByCountry=l.getTimezonesByCountry;exports.iso2ToFlag=l.iso2ToFlag;exports.searchCountries=l.searchCountries;exports.searchCurrencies=l.searchCurrencies;exports.searchLanguages=l.searchLanguages;exports.searchTimezones=l.searchTimezones;exports.useBasePicker=l.useBasePicker;exports.useCountryPicker=l.useCountryPicker;exports.useCurrencyPicker=l.useCurrencyPicker;exports.useDivisionPicker=l.useDivisionPicker;exports.useLanguagePicker=l.useLanguagePicker;exports.useMultiSelect=l.useMultiSelect;exports.usePhoneInput=l.usePhoneInput;exports.useTimezonePicker=l.useTimezonePicker;exports.CountryMultiSelect=v;exports.CountryPicker=w;exports.CurrencyMultiSelect=P;exports.CurrencyPicker=E;exports.DivisionPicker=O;exports.LanguagePicker=_;exports.PhoneInput=z;exports.TimezonePicker=W;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react-country-kit-core"),e=require("react/jsx-runtime"),j=require("react");function g({value:r,onChange:l,placeholder:p="Search...",autoFocus:m=!0}){const a=j.useRef(null);return j.useEffect(()=>{m&&setTimeout(()=>{var o;return(o=a.current)==null?void 0:o.focus()},50)},[m]),e.jsx("div",{className:"rck-search-wrapper",children:e.jsxs("div",{className:"rck-search",children:[e.jsxs("svg",{className:"rck-search-icon",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("circle",{cx:"8.5",cy:"8.5",r:"5.5"}),e.jsx("path",{d:"M17 17l-4-4",strokeLinecap:"round"})]}),e.jsx("input",{ref:a,type:"text",value:r,onChange:o=>l(o.target.value),placeholder:p,"aria-label":"Search"}),r&&e.jsx("button",{style:{background:"none",border:"none",cursor:"pointer",color:"var(--rck-text-placeholder)",padding:0,display:"flex"},onClick:()=>l(""),"aria-label":"Clear search",type:"button",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{d:"M6 6l8 8M14 6l-8 8",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",fill:"none"})})})]})})}const N=({iso2:r,flag:l,flagUrl:p,className:m="",alt:a="",mode:o="auto"})=>{const k=p||`https://flagcdn.com/w320/${r.toLowerCase()}.png`;return o==="image"?e.jsx("img",{src:k,alt:a||r,className:`rck-flag-img ${m}`,loading:"lazy"}):e.jsx("span",{className:`rck-flag-wrapper ${m}`,title:a||r,children:l||r})},b=3;function v(){return e.jsx("svg",{viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})})}function w({value:r,onChange:l,placeholder:p="Select countries...",maxItems:m,showFlags:a=!0,searchable:o=!0,disabled:k=!1,className:x,label:s}){const n=u.useMultiSelect(u.getAllCountries(),(i,d)=>d?u.searchCountries(d):i,i=>i.iso2,r,l,m),c=j.useRef(null);j.useEffect(()=>{if(!n.isOpen)return;const i=d=>{c.current&&!c.current.contains(d.target)&&n.close()};return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[n.isOpen,n.close]),j.useEffect(()=>{if(!n.isOpen)return;const i=d=>{d.key==="Escape"&&n.close()};return document.addEventListener("keydown",i),()=>document.removeEventListener("keydown",i)},[n.isOpen,n.close]);const t=r.slice(0,b),h=r.length-b;return e.jsxs("div",{ref:c,className:`rck-picker${x?` ${x}`:""}`,children:[s&&e.jsx("span",{className:"rck-label",children:s}),e.jsxs("button",{type:"button",className:`rck-multiselect-trigger${n.isOpen?" rck-open":""}`,disabled:k,onClick:n.toggle,"aria-haspopup":"listbox","aria-expanded":n.isOpen,children:[e.jsx("div",{className:"rck-chips-area",children:r.length===0?e.jsx("span",{style:{color:"var(--rck-text-placeholder)",fontSize:"0.9375rem"},children:p}):e.jsxs(e.Fragment,{children:[t.map(i=>e.jsxs("span",{className:"rck-chip",children:[a&&e.jsx("span",{className:"rck-flag",children:e.jsx(N,{iso2:i.iso2,flag:i.flag,flagUrl:i.flag_url})}),e.jsx("span",{className:"rck-chip-label",children:i.name}),e.jsx("button",{type:"button",className:"rck-chip-remove",onClick:d=>{d.stopPropagation(),n.removeItem(i),l(r.filter(f=>f.iso2!==i.iso2))},"aria-label":`Remove ${i.name}`,children:e.jsxs("svg",{width:"10",height:"10",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})})]},i.iso2)),h>0&&e.jsxs("span",{className:"rck-chip-overflow",children:["+",h," more"]})]})}),r.length>0&&e.jsx("button",{type:"button",className:"rck-multiselect-clear",onClick:i=>{i.stopPropagation(),n.clearAll(),l([])},"aria-label":"Clear all",children:e.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})}),e.jsx("svg",{className:"rck-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})})]}),n.isOpen&&e.jsxs("div",{className:"rck-dropdown",role:"listbox","aria-multiselectable":"true",children:[o&&e.jsx(g,{value:n.searchQuery,onChange:n.setSearchQuery,placeholder:"Search countries..."}),e.jsx("ul",{className:"rck-list",children:n.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No countries found"})]}):n.filteredItems.map(i=>{const d=n.isSelected(i);return e.jsxs("li",{role:"option","aria-selected":d,className:`rck-item${d?" rck-item-selected":""}`,onClick:()=>n.toggleItem(i),tabIndex:0,onKeyDown:f=>f.key==="Enter"&&n.toggleItem(i),children:[e.jsx("div",{className:d?"rck-item-check-multi":"rck-item-check-empty",children:d&&e.jsx(v,{})}),a&&e.jsx("span",{className:"rck-item-flag",children:e.jsx(N,{iso2:i.iso2,flag:i.flag,flagUrl:i.flag_url})}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:i.name}),e.jsxs("span",{className:"rck-item-sub",children:[i.iso3," Β· +",i.phone_code]})]})]},i.iso2)})})]})]})}const I=()=>e.jsx("svg",{className:"rck-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})});function y({isOpen:r,onClose:l,onToggle:p,label:m,disabled:a,className:o,triggerContent:k,children:x,id:s}){const n=j.useRef(null);return j.useEffect(()=>{if(!r)return;const c=t=>{n.current&&!n.current.contains(t.target)&&l()};return document.addEventListener("mousedown",c),()=>document.removeEventListener("mousedown",c)},[r,l]),j.useEffect(()=>{if(!r)return;const c=t=>{t.key==="Escape"&&l()};return document.addEventListener("keydown",c),()=>document.removeEventListener("keydown",c)},[r,l]),e.jsxs("div",{ref:n,className:`rck-picker${o?` ${o}`:""}`,children:[m&&e.jsx("span",{className:"rck-label",id:s?`${s}-label`:void 0,children:m}),e.jsxs("button",{type:"button",className:`rck-trigger${r?" rck-open":""}`,disabled:a,"aria-haspopup":"listbox","aria-expanded":r,"aria-labelledby":s&&m?`${s}-label`:void 0,id:s,onClick:p,children:[k,e.jsx(I,{})]}),r&&e.jsx("div",{className:"rck-dropdown",role:"listbox",children:x})]})}const S=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function L({value:r,onChange:l,placeholder:p="Select a country",searchable:m=!0,showFlag:a=!0,showPhoneCode:o=!1,disabled:k=!1,className:x,label:s}){const n=u.useCountryPicker(r,l),c=e.jsx("div",{className:"rck-trigger-content",children:r?e.jsxs(e.Fragment,{children:[a&&e.jsx("span",{className:"rck-flag",children:e.jsx(N,{iso2:r.iso2,flag:r.flag,flagUrl:r.flag_url})}),e.jsx("span",{className:"rck-trigger-text",children:r.name}),o&&e.jsxs("span",{className:"rck-badge",children:["+",r.phone_code]})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:p})});return e.jsxs(y,{isOpen:n.isOpen,onClose:n.close,onToggle:n.toggle,label:s,disabled:k,className:x,triggerContent:c,id:"rck-country-picker",children:[m&&e.jsx(g,{value:n.searchQuery,onChange:n.setSearchQuery,placeholder:"Search country..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Countries",children:n.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No countries found"})]}):n.filteredItems.map(t=>{const h=(r==null?void 0:r.iso2)===t.iso2;return e.jsxs("li",{role:"option","aria-selected":h,className:`rck-item${h?" rck-item-selected":""}`,onClick:()=>n.selectItem(t),tabIndex:0,onKeyDown:i=>i.key==="Enter"&&n.selectItem(t),children:[a&&e.jsx("span",{className:"rck-item-flag",children:e.jsx(N,{iso2:t.iso2,flag:t.flag,flagUrl:t.flag_url})}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:t.name}),e.jsxs("span",{className:"rck-item-sub",children:[t.iso3," Β· ",t.division_type]})]}),e.jsxs("div",{className:"rck-item-right",children:[o&&e.jsxs("span",{className:"rck-item-phone",children:["+",t.phone_code]}),h&&e.jsx(S,{})]})]},t.iso2)})})]})}const C=3;function E(){return e.jsx("svg",{viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})})}function $({value:r,onChange:l,placeholder:p="Select currencies...",maxItems:m,showSymbol:a=!0,searchable:o=!0,disabled:k=!1,className:x,label:s}){const n=u.useMultiSelect(u.getAllCurrencies(),(i,d)=>d?u.searchCurrencies(d):i,i=>i.code,r,l,m),c=j.useRef(null);j.useEffect(()=>{if(!n.isOpen)return;const i=d=>{c.current&&!c.current.contains(d.target)&&n.close()};return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[n.isOpen,n.close]),j.useEffect(()=>{if(!n.isOpen)return;const i=d=>{d.key==="Escape"&&n.close()};return document.addEventListener("keydown",i),()=>document.removeEventListener("keydown",i)},[n.isOpen,n.close]);const t=r.slice(0,C),h=r.length-C;return e.jsxs("div",{ref:c,className:`rck-picker${x?` ${x}`:""}`,children:[s&&e.jsx("span",{className:"rck-label",children:s}),e.jsxs("button",{type:"button",className:`rck-multiselect-trigger${n.isOpen?" rck-open":""}`,disabled:k,onClick:n.toggle,"aria-haspopup":"listbox","aria-expanded":n.isOpen,children:[e.jsx("div",{className:"rck-chips-area",children:r.length===0?e.jsx("span",{style:{color:"var(--rck-text-placeholder)",fontSize:"0.9375rem"},children:p}):e.jsxs(e.Fragment,{children:[t.map(i=>e.jsxs("span",{className:"rck-chip",children:[a&&e.jsx("span",{children:i.symbol}),e.jsx("span",{className:"rck-chip-label",children:i.code}),e.jsx("button",{type:"button",className:"rck-chip-remove",onClick:d=>{d.stopPropagation(),l(r.filter(f=>f.code!==i.code))},"aria-label":`Remove ${i.code}`,children:e.jsxs("svg",{width:"10",height:"10",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})})]},i.code)),h>0&&e.jsxs("span",{className:"rck-chip-overflow",children:["+",h," more"]})]})}),r.length>0&&e.jsx("button",{type:"button",className:"rck-multiselect-clear",onClick:i=>{i.stopPropagation(),n.clearAll(),l([])},"aria-label":"Clear all",children:e.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:[e.jsx("line",{x1:"5",y1:"5",x2:"15",y2:"15"}),e.jsx("line",{x1:"15",y1:"5",x2:"5",y2:"15"})]})}),e.jsx("svg",{className:"rck-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})})]}),n.isOpen&&e.jsxs("div",{className:"rck-dropdown",role:"listbox","aria-multiselectable":"true",children:[o&&e.jsx(g,{value:n.searchQuery,onChange:n.setSearchQuery,placeholder:"Search currencies..."}),e.jsx("ul",{className:"rck-list",children:n.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π°"}),e.jsx("span",{children:"No currencies found"})]}):n.filteredItems.map(i=>{const d=n.isSelected(i);return e.jsxs("li",{role:"option","aria-selected":d,className:`rck-item${d?" rck-item-selected":""}`,onClick:()=>n.toggleItem(i),tabIndex:0,onKeyDown:f=>f.key==="Enter"&&n.toggleItem(i),children:[e.jsx("div",{className:d?"rck-item-check-multi":"rck-item-check-empty",children:d&&e.jsx(E,{})}),a&&e.jsx("span",{className:"rck-item-symbol",children:i.symbol}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:i.name}),e.jsx("span",{className:"rck-item-sub",children:i.code})]})]},i.code)})})]})]})}const O=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function P({value:r,onChange:l,placeholder:p="Select a currency",searchable:m=!0,showSymbol:a=!0,disabled:o=!1,className:k,label:x}){const s=u.useCurrencyPicker(r,l),n=e.jsx("div",{className:"rck-trigger-content",children:r?e.jsxs(e.Fragment,{children:[a&&e.jsx("span",{className:"rck-item-symbol",children:r.symbol}),e.jsxs("span",{className:"rck-trigger-text",children:[r.code," β ",r.name]})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:p})});return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:x,disabled:o,className:k,triggerContent:n,id:"rck-currency-picker",children:[m&&e.jsx(g,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search currency..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Currencies",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π°"}),e.jsx("span",{children:"No currencies found"})]}):s.filteredItems.map(c=>{const t=(r==null?void 0:r.code)===c.code;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectItem(c),tabIndex:0,onKeyDown:h=>h.key==="Enter"&&s.selectItem(c),children:[a&&e.jsx("span",{className:"rck-item-symbol",children:c.symbol}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.name}),e.jsx("span",{className:"rck-item-sub",children:c.code})]}),t&&e.jsx(O,{})]},c.code)})})]})}const _=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function B({countryIso2:r,value:l,onChange:p,placeholder:m="Select a division",searchable:a=!0,disabled:o=!1,className:k,label:x}){const s=u.useDivisionPicker(r,l,p),n=e.jsx("div",{className:"rck-trigger-content",children:l?e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"rck-trigger-text",children:l.name}),e.jsx("span",{className:"rck-badge",children:l.iso2})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:m})}),c=o||!r;return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:x,disabled:c,className:k,triggerContent:n,id:"rck-division-picker",children:[a&&e.jsx(g,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search division..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Divisions",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"πΊοΈ"}),e.jsx("span",{children:"No divisions found"})]}):s.filteredItems.map(t=>{const h=(l==null?void 0:l.iso2)===t.iso2&&(l==null?void 0:l.name)===t.name;return e.jsxs("li",{role:"option","aria-selected":h,className:`rck-item${h?" rck-item-selected":""}`,onClick:()=>s.selectItem(t),tabIndex:0,onKeyDown:i=>i.key==="Enter"&&s.selectItem(t),children:[e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:t.name}),e.jsx("span",{className:"rck-item-sub",children:t.timezone})]}),e.jsxs("div",{className:"rck-item-right",children:[e.jsx("span",{className:"rck-badge",children:t.iso2}),h&&e.jsx(_,{})]})]},`${t.iso2}-${t.name}`)})})]})}const W=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function Q({value:r,onChange:l,placeholder:p="Select a language",searchable:m=!0,showNativeName:a=!0,disabled:o=!1,className:k,label:x}){const s=u.useLanguagePicker(r,l),n=e.jsx("div",{className:"rck-trigger-content",children:r?e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"rck-trigger-text",children:r.english_name}),a&&r.native_name!==r.english_name&&e.jsx("span",{className:"rck-native-name",children:r.native_name})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:p})});return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:x,disabled:o,className:k,triggerContent:n,id:"rck-language-picker",children:[m&&e.jsx(g,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search language..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Languages",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No languages found"})]}):s.filteredItems.map(c=>{const t=(r==null?void 0:r.code)===c.code;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectItem(c),tabIndex:0,onKeyDown:h=>h.key==="Enter"&&s.selectItem(c),children:[e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.english_name}),a&&c.native_name!==c.english_name&&e.jsx("span",{className:"rck-item-sub",children:c.native_name})]}),e.jsxs("div",{className:"rck-item-right",children:[e.jsx("span",{className:"rck-badge",style:{fontSize:"0.68rem"},children:c.code}),t&&e.jsx(W,{})]})]},c.code)})})]})}function R({value:r,onChange:l,defaultCountryIso2:p="US",placeholder:m="Phone number",showFlag:a=!0,disabled:o=!1,className:k,label:x}){const s=u.usePhoneInput(r,l,p),n=j.useRef(null);return j.useEffect(()=>{if(!s.isOpen)return;const c=t=>{n.current&&!n.current.contains(t.target)&&s.close()};return document.addEventListener("mousedown",c),()=>document.removeEventListener("mousedown",c)},[s.isOpen,s.close]),j.useEffect(()=>{if(!s.isOpen)return;const c=t=>{t.key==="Escape"&&s.close()};return document.addEventListener("keydown",c),()=>document.removeEventListener("keydown",c)},[s.isOpen,s.close]),e.jsxs("div",{ref:n,className:`rck-phone-wrapper${k?` ${k}`:""}`,children:[x&&e.jsx("span",{className:"rck-label",children:x}),e.jsxs("div",{className:`rck-phone-field${o?" rck-phone-disabled":""}`,children:[e.jsxs("button",{type:"button",className:"rck-phone-country-btn",onClick:s.toggle,"aria-expanded":s.isOpen,"aria-label":"Select country code",disabled:o,children:[a&&s.country&&e.jsx("span",{className:"rck-phone-flag",children:e.jsx(N,{iso2:s.country.iso2,flag:s.country.flag,flagUrl:s.country.flag_url})}),e.jsx("span",{className:"rck-phone-dial",children:s.country?`+${s.country.phone_code}`:"+?"}),e.jsx("svg",{className:"rck-phone-chevron",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:e.jsx("polyline",{points:"5 8 10 13 15 8"})})]}),e.jsx("input",{type:"tel",className:"rck-phone-input",value:s.number,onChange:c=>s.setNumber(c.target.value),placeholder:m,disabled:o,inputMode:"numeric",autoComplete:"tel-national"}),s.isOpen&&e.jsxs("div",{className:"rck-phone-dropdown",children:[e.jsx(g,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search country or dial code..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Countries",children:s.filteredCountries.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No countries found"})]}):s.filteredCountries.map(c=>{var h;const t=((h=s.country)==null?void 0:h.iso2)===c.iso2;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectCountry(c),tabIndex:0,onKeyDown:i=>i.key==="Enter"&&s.selectCountry(c),children:[e.jsx("span",{className:"rck-item-flag",children:e.jsx(N,{iso2:c.iso2,flag:c.flag,flagUrl:c.flag_url})}),e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.name}),e.jsx("span",{className:"rck-item-sub",children:c.iso2})]}),e.jsxs("span",{className:"rck-item-phone",children:["+",c.phone_code]})]},c.iso2)})})]})]})]})}const D=()=>e.jsx("svg",{className:"rck-item-check",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})});function M({value:r,onChange:l,placeholder:p="Select a timezone",searchable:m=!0,countryIso2:a,disabled:o=!1,className:k,label:x}){const s=u.useTimezonePicker(r,l,a),n=e.jsx("div",{className:"rck-trigger-content",children:r?e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"rck-trigger-text",children:r.name}),e.jsx("span",{className:"rck-badge",children:r.offset_name})]}):e.jsx("span",{className:"rck-trigger-text rck-placeholder",children:p})});return e.jsxs(y,{isOpen:s.isOpen,onClose:s.close,onToggle:s.toggle,label:x,disabled:o,className:k,triggerContent:n,id:"rck-timezone-picker",children:[m&&e.jsx(g,{value:s.searchQuery,onChange:s.setSearchQuery,placeholder:"Search timezone..."}),e.jsx("ul",{className:"rck-list",role:"listbox","aria-label":"Timezones",children:s.filteredItems.length===0?e.jsxs("li",{className:"rck-empty",children:[e.jsx("span",{className:"rck-empty-icon",children:"π"}),e.jsx("span",{children:"No timezones found"})]}):s.filteredItems.map(c=>{const t=(r==null?void 0:r.name)===c.name;return e.jsxs("li",{role:"option","aria-selected":t,className:`rck-item${t?" rck-item-selected":""}`,onClick:()=>s.selectItem(c),tabIndex:0,onKeyDown:h=>h.key==="Enter"&&s.selectItem(c),children:[e.jsxs("div",{className:"rck-item-main",children:[e.jsx("span",{className:"rck-item-name",children:c.name}),e.jsxs("span",{className:"rck-item-sub",children:[c.tzName," Β· ",c.abbreviation]})]}),e.jsxs("div",{className:"rck-item-right",children:[e.jsx("span",{className:"rck-offset-badge",children:c.offset_name}),t&&e.jsx(D,{})]})]},c.name)})})]})}exports.CountryMultiSelect=w;exports.CountryPicker=L;exports.CurrencyMultiSelect=$;exports.CurrencyPicker=P;exports.DivisionPicker=B;exports.LanguagePicker=Q;exports.PhoneInput=R;exports.TimezonePicker=M;Object.keys(u).forEach(r=>{r!=="default"&&!Object.prototype.hasOwnProperty.call(exports,r)&&Object.defineProperty(exports,r,{enumerable:!0,get:()=>u[r]})});
|
|
2
2
|
//# sourceMappingURL=react-country-kit.cjs.js.map
|