react-country-kit 1.1.0 β 1.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +59 -14
- package/dist/components/CountryMultiSelect/CountryMultiSelect.d.ts +1 -1
- package/dist/components/CountryPicker/CountryPicker.d.ts +1 -1
- package/dist/components/CurrencyMultiSelect/CurrencyMultiSelect.d.ts +1 -1
- package/dist/components/CurrencyPicker/CurrencyPicker.d.ts +1 -1
- package/dist/components/DivisionPicker/DivisionPicker.d.ts +1 -1
- package/dist/components/LanguagePicker/LanguagePicker.d.ts +1 -1
- package/dist/components/PhoneInput/PhoneInput.d.ts +1 -1
- package/dist/components/TimezonePicker/TimezonePicker.d.ts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/react-country-kit.cjs.js +1 -1
- package/package.json +2 -2
- package/dist/ui/components/CountryMultiSelect.d.ts +0 -3
- package/dist/ui/components/CountryPicker.d.ts +0 -3
- package/dist/ui/components/CurrencyMultiSelect.d.ts +0 -3
- package/dist/ui/components/CurrencyPicker.d.ts +0 -3
- package/dist/ui/components/DivisionPicker.d.ts +0 -3
- package/dist/ui/components/LanguagePicker.d.ts +0 -3
- package/dist/ui/components/PhoneInput.d.ts +0 -3
- package/dist/ui/components/TimezonePicker.d.ts +0 -3
- package/dist/ui/components/primitives.d.ts +0 -83
- package/dist/ui/index.d.ts +0 -38
- package/dist/ui/lib/utils.d.ts +0 -7
- package/dist/ui.cjs.js +0 -2
- package/dist/ui.cjs.js.map +0 -1
- package/dist/ui.d.ts +0 -1
- package/dist/ui.es.js +0 -1161
- package/dist/ui.es.js.map +0 -1
package/README.md
CHANGED
|
@@ -1,43 +1,88 @@
|
|
|
1
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
|
-
- **Standard
|
|
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
|
## Installation
|
|
13
14
|
|
|
14
15
|
```bash
|
|
15
|
-
npm install react-country-kit
|
|
16
|
+
npm install react-country-kit react-country-kit-core
|
|
16
17
|
```
|
|
17
18
|
|
|
18
19
|
## Usage
|
|
19
20
|
|
|
20
|
-
### Standard
|
|
21
|
+
### 1. Standard UI (Vanilla CSS)
|
|
22
|
+
|
|
23
|
+
Simple, clean components with no external styling dependencies.
|
|
21
24
|
|
|
22
25
|
```tsx
|
|
23
|
-
import { CountryPicker } from 'react-country-kit';
|
|
24
|
-
import 'react-country-kit/styles';
|
|
26
|
+
import { CountryPicker, PhoneInput } from 'react-country-kit';
|
|
27
|
+
import 'react-country-kit/styles'; // Don't forget the CSS!
|
|
25
28
|
|
|
26
|
-
function
|
|
27
|
-
return
|
|
29
|
+
function StandardApp() {
|
|
30
|
+
return (
|
|
31
|
+
<div className="space-y-4">
|
|
32
|
+
<CountryPicker onChange={console.log} label="Select Country" />
|
|
33
|
+
<PhoneInput onChange={console.log} label="Phone Number" />
|
|
34
|
+
</div>
|
|
35
|
+
);
|
|
28
36
|
}
|
|
29
37
|
```
|
|
30
38
|
|
|
31
|
-
### Shadcn Variant
|
|
39
|
+
### 2. Shadcn/UI Variant (Tailwind + Radix)
|
|
40
|
+
|
|
41
|
+
Premium, modern components that blend perfectly with your Shadcn/UI project.
|
|
32
42
|
|
|
33
43
|
```tsx
|
|
34
44
|
import { CountryPicker } from 'react-country-kit/ui';
|
|
35
45
|
|
|
36
|
-
function
|
|
37
|
-
return
|
|
46
|
+
function ShadcnApp() {
|
|
47
|
+
return (
|
|
48
|
+
<div className="p-10 max-w-md">
|
|
49
|
+
<CountryPicker
|
|
50
|
+
onChange={console.log}
|
|
51
|
+
label="Destination"
|
|
52
|
+
showFlag={true}
|
|
53
|
+
showPhoneCode={true}
|
|
54
|
+
/>
|
|
55
|
+
</div>
|
|
56
|
+
);
|
|
38
57
|
}
|
|
39
58
|
```
|
|
40
59
|
|
|
60
|
+
> **Note**: The Shadcn variant requires `tailwindcss`, `clsx`, `tailwind-merge`, and `@radix-ui/react-popover` as peer dependencies.
|
|
61
|
+
|
|
62
|
+
## Components List
|
|
63
|
+
|
|
64
|
+
- `CountryPicker`
|
|
65
|
+
- `CountryMultiSelect`
|
|
66
|
+
- `PhoneInput`
|
|
67
|
+
- `CurrencyPicker`
|
|
68
|
+
- `CurrencyMultiSelect`
|
|
69
|
+
- `TimezonePicker`
|
|
70
|
+
- `LanguagePicker`
|
|
71
|
+
- `DivisionPicker`
|
|
72
|
+
|
|
73
|
+
## Props
|
|
74
|
+
|
|
75
|
+
Most components share a similar API:
|
|
76
|
+
|
|
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. |
|
|
85
|
+
|
|
41
86
|
## License
|
|
42
87
|
|
|
43
88
|
MIT
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { CountryMultiSelectProps } from '
|
|
1
|
+
import { CountryMultiSelectProps } from '../../../../core/src/index.ts';
|
|
2
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 { CountryPickerProps } from '
|
|
1
|
+
import { CountryPickerProps } from '../../../../core/src/index.ts';
|
|
2
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 { CurrencyMultiSelectProps } from '
|
|
1
|
+
import { CurrencyMultiSelectProps } from '../../../../core/src/index.ts';
|
|
2
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 { CurrencyPickerProps } from '
|
|
1
|
+
import { CurrencyPickerProps } from '../../../../core/src/index.ts';
|
|
2
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 { DivisionPickerProps } from '
|
|
1
|
+
import { DivisionPickerProps } from '../../../../core/src/index.ts';
|
|
2
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 { LanguagePickerProps } from '
|
|
1
|
+
import { LanguagePickerProps } from '../../../../core/src/index.ts';
|
|
2
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 { PhoneInputProps } from '
|
|
1
|
+
import { PhoneInputProps } from '../../../../core/src/index.ts';
|
|
2
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 { TimezonePickerProps } from '
|
|
1
|
+
import { TimezonePickerProps } from '../../../../core/src/index.ts';
|
|
2
2
|
|
|
3
3
|
export declare function TimezonePicker({ value, onChange, placeholder, searchable, countryIso2, disabled, className, label, }: TimezonePickerProps): import("react/jsx-runtime").JSX.Element;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export * from '
|
|
1
|
+
export * from '../../core/src/index.ts';
|
|
2
2
|
export { CountryMultiSelect } from './components/CountryMultiSelect/CountryMultiSelect';
|
|
3
3
|
export { CountryPicker } from './components/CountryPicker/CountryPicker';
|
|
4
4
|
export { CurrencyMultiSelect } from './components/CurrencyMultiSelect/CurrencyMultiSelect';
|
|
@@ -1,2 +1,2 @@
|
|
|
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]})});
|
|
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 D({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 M=()=>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 R({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(M,{})]})]},c.name)})})]})}exports.CountryMultiSelect=w;exports.CountryPicker=L;exports.CurrencyMultiSelect=$;exports.CurrencyPicker=P;exports.DivisionPicker=B;exports.LanguagePicker=Q;exports.PhoneInput=D;exports.TimezonePicker=R;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
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-country-kit",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.2",
|
|
4
4
|
"description": "A comprehensive React component library for country, currency, timezone, language, and division picking. Supports both vanilla CSS and shadcn/Tailwind CSS variants.",
|
|
5
5
|
"author": "Kishor Mainali",
|
|
6
6
|
"license": "MIT",
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
"vite-plugin-dts": "^3.7.0"
|
|
84
84
|
},
|
|
85
85
|
"dependencies": {
|
|
86
|
-
"react-country-kit-core": "^1.1.
|
|
86
|
+
"react-country-kit-core": "^1.1.2",
|
|
87
87
|
"libphonenumber-js": "^1.12.42"
|
|
88
88
|
},
|
|
89
89
|
"repository": {
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import { CurrencyMultiSelectProps } from 'react-country-kit-core';
|
|
2
|
-
|
|
3
|
-
export declare function CurrencyMultiSelect({ value, onChange, placeholder, maxItems, showSymbol, searchable, disabled, className, label, }: CurrencyMultiSelectProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import { CurrencyPickerProps } from 'react-country-kit-core';
|
|
2
|
-
|
|
3
|
-
export declare function CurrencyPicker({ value, onChange, placeholder, searchable, showSymbol, countryIso2, autoSelect, disabled, className, label, }: CurrencyPickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
|
-
|
|
3
|
-
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
4
|
-
export declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
|
|
5
|
-
export declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
6
|
-
export declare const CheckIcon: {
|
|
7
|
-
({ className }: {
|
|
8
|
-
className?: string;
|
|
9
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
10
|
-
displayName: string;
|
|
11
|
-
};
|
|
12
|
-
export declare const FieldLabel: {
|
|
13
|
-
({ children, className, }: {
|
|
14
|
-
children: React.ReactNode;
|
|
15
|
-
className?: string;
|
|
16
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
17
|
-
displayName: string;
|
|
18
|
-
};
|
|
19
|
-
export declare const Badge: {
|
|
20
|
-
({ children, className }: {
|
|
21
|
-
children: React.ReactNode;
|
|
22
|
-
className?: string;
|
|
23
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
24
|
-
displayName: string;
|
|
25
|
-
};
|
|
26
|
-
export declare const Flag: {
|
|
27
|
-
({ iso2, flag, flagUrl, className }: {
|
|
28
|
-
iso2: string;
|
|
29
|
-
flag: string;
|
|
30
|
-
flagUrl: string;
|
|
31
|
-
className?: string;
|
|
32
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
33
|
-
displayName: string;
|
|
34
|
-
};
|
|
35
|
-
export interface PopoverContentProps extends React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content> {
|
|
36
|
-
}
|
|
37
|
-
export declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
38
|
-
/** Wrapper that groups search input + scrollable list. */
|
|
39
|
-
export declare const CommandRoot: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
40
|
-
export interface CommandInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
|
|
41
|
-
onValueChange?: (value: string) => void;
|
|
42
|
-
}
|
|
43
|
-
export declare const CommandInput: React.ForwardRefExoticComponent<CommandInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
44
|
-
export declare const CommandList: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
45
|
-
export declare const CommandEmpty: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
46
|
-
export interface CommandItemProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
47
|
-
/** Called when the item is clicked or activated via keyboard Enter. */
|
|
48
|
-
onSelect?: () => void;
|
|
49
|
-
disabled?: boolean;
|
|
50
|
-
selected?: boolean;
|
|
51
|
-
/** Kept for API compatibility; not used internally. */
|
|
52
|
-
value?: string;
|
|
53
|
-
}
|
|
54
|
-
export declare const CommandItem: React.ForwardRefExoticComponent<CommandItemProps & React.RefAttributes<HTMLDivElement>>;
|
|
55
|
-
export interface PickerTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
56
|
-
isOpen?: boolean;
|
|
57
|
-
hasValue?: boolean;
|
|
58
|
-
placeholder?: string;
|
|
59
|
-
}
|
|
60
|
-
export declare const PickerTrigger: React.ForwardRefExoticComponent<PickerTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
61
|
-
export interface BasePickerProps {
|
|
62
|
-
label?: string;
|
|
63
|
-
trigger: React.ReactNode;
|
|
64
|
-
children: React.ReactNode;
|
|
65
|
-
open: boolean;
|
|
66
|
-
onOpenChange: (open: boolean) => void;
|
|
67
|
-
className?: string;
|
|
68
|
-
}
|
|
69
|
-
export declare const BasePicker: React.ForwardRefExoticComponent<BasePickerProps & React.RefAttributes<HTMLDivElement>>;
|
|
70
|
-
export interface MultiSelectTriggerProps<T> extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value'> {
|
|
71
|
-
value: T[];
|
|
72
|
-
onRemove: (item: T, e: React.MouseEvent) => void;
|
|
73
|
-
onClear: (e: React.MouseEvent) => void;
|
|
74
|
-
isOpen: boolean;
|
|
75
|
-
placeholder?: string;
|
|
76
|
-
renderChip: (item: T) => React.ReactNode;
|
|
77
|
-
maxVisible?: number;
|
|
78
|
-
}
|
|
79
|
-
export declare const MultiSelectTrigger: (<T>(props: MultiSelectTriggerProps<T> & {
|
|
80
|
-
ref?: React.Ref<HTMLButtonElement>;
|
|
81
|
-
}) => React.ReactElement) & {
|
|
82
|
-
displayName?: string;
|
|
83
|
-
};
|
package/dist/ui/index.d.ts
DELETED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* react-country-kit/ui
|
|
3
|
-
*
|
|
4
|
-
* shadcn/Tailwind CSS variants of all pickers.
|
|
5
|
-
* Built on @radix-ui/react-popover with native search/list primitives (no cmdk).
|
|
6
|
-
*
|
|
7
|
-
* Requirements:
|
|
8
|
-
* - Tailwind CSS configured in your project
|
|
9
|
-
* - CSS variables from shadcn/ui (or compatible theme):
|
|
10
|
-
* --background, --foreground, --primary, --border, --input,
|
|
11
|
-
* --accent, --accent-foreground, --muted, --muted-foreground,
|
|
12
|
-
* --popover, --popover-foreground, --ring, --radius
|
|
13
|
-
*
|
|
14
|
-
* Peer dependencies:
|
|
15
|
-
* @radix-ui/react-popover, tailwind-merge, clsx, class-variance-authority
|
|
16
|
-
*/
|
|
17
|
-
export { CountryPicker } from './components/CountryPicker';
|
|
18
|
-
export { CurrencyPicker } from './components/CurrencyPicker';
|
|
19
|
-
export { TimezonePicker } from './components/TimezonePicker';
|
|
20
|
-
export { LanguagePicker } from './components/LanguagePicker';
|
|
21
|
-
export { DivisionPicker } from './components/DivisionPicker';
|
|
22
|
-
export { PhoneInput } from './components/PhoneInput';
|
|
23
|
-
export { CountryMultiSelect } from './components/CountryMultiSelect';
|
|
24
|
-
export { CurrencyMultiSelect } from './components/CurrencyMultiSelect';
|
|
25
|
-
export { Popover, PopoverTrigger, PopoverContent, CommandRoot, CommandInput, CommandList, CommandEmpty, CommandItem, PickerTrigger, CheckIcon, Badge, } from './components/primitives';
|
|
26
|
-
export { cn } from './lib/utils';
|
|
27
|
-
export { useCountryPicker } from 'react-country-kit-core';
|
|
28
|
-
export { useCurrencyPicker } from 'react-country-kit-core';
|
|
29
|
-
export { useTimezonePicker } from 'react-country-kit-core';
|
|
30
|
-
export { useLanguagePicker } from 'react-country-kit-core';
|
|
31
|
-
export { useDivisionPicker } from 'react-country-kit-core';
|
|
32
|
-
export { usePhoneInput } from 'react-country-kit-core';
|
|
33
|
-
export { useMultiSelect } from 'react-country-kit-core';
|
|
34
|
-
export { getAllCountries, getCountryByIso2, getCountryByIso3, getCountryByName, searchCountries, getDivisionsByCountry, getTimezonesByCountry, getCurrencyByCountry, iso2ToFlag, } from 'react-country-kit-core';
|
|
35
|
-
export { getAllCurrencies, getCurrencyByCode, searchCurrencies, } from 'react-country-kit-core';
|
|
36
|
-
export { getAllTimezones, getTimezoneByName, searchTimezones, } from 'react-country-kit-core';
|
|
37
|
-
export { getAllLanguages, getLanguageByCode, searchLanguages, } from 'react-country-kit-core';
|
|
38
|
-
export type { Country, Currency, Timezone, Division, Language, PhoneFormat, PhoneValue, PhoneInputProps, CountryPickerProps, CurrencyPickerProps, TimezonePickerProps, LanguagePickerProps, DivisionPickerProps, CountryMultiSelectProps, CurrencyMultiSelectProps, UsePickerReturn, UseMultiSelectReturn, } from 'react-country-kit-core';
|
package/dist/ui/lib/utils.d.ts
DELETED
package/dist/ui.cjs.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("react"),W=require("@radix-ui/react-popover"),U=require("clsx"),$=require("tailwind-merge"),o=require("react-country-kit-core");function X(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const c in t)if(c!=="default"){const a=Object.getOwnPropertyDescriptor(t,c);Object.defineProperty(r,c,a.get?a:{enumerable:!0,get:()=>t[c]})}}return r.default=t,Object.freeze(r)}const A=X(W);function N(...t){return $.twMerge(U.clsx(t))}const q=A.Root,M=A.Trigger,T=({className:t})=>e.jsx("svg",{className:N("h-4 w-4 text-primary",t),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"})});T.displayName="CheckIcon";const D=({children:t,className:r})=>e.jsx("label",{className:N("text-[0.65rem] font-bold uppercase tracking-[0.12em] text-muted-foreground/80 ml-1 mb-1.5 block",r),children:t});D.displayName="FieldLabel";const w=({children:t,className:r})=>e.jsx("span",{className:N("inline-flex items-center rounded-full bg-primary/20 px-2.5 py-0.5 text-[0.7rem] font-bold text-primary tracking-tight",r),children:t});w.displayName="Badge";const _=({iso2:t,flag:r,flagUrl:c,className:a})=>e.jsx("span",{className:N("inline-flex items-center justify-center shrink-0 overflow-hidden",a),children:e.jsx("img",{src:c,alt:t,className:"h-[1em] w-[1.5em] object-cover rounded-[1px] shadow-[0_0_0_1px_rgba(0,0,0,0.05)]",onError:i=>{if(i.target.style.display="none",i.target.parentElement){const d=document.createElement("span");d.textContent=r,i.target.parentElement.appendChild(d)}}})});_.displayName="Flag";const R=y.forwardRef(({className:t,align:r="start",sideOffset:c=6,onCloseAutoFocus:a,...i},d)=>e.jsx(A.Portal,{children:e.jsx(A.Content,{ref:d,align:r,sideOffset:c,onCloseAutoFocus:g=>{g.preventDefault(),a==null||a(g)},className:N("z-50 w-[var(--radix-popover-trigger-width)] rounded-xl border border-border bg-popover p-0 shadow-lg","data-[state=open]:animate-in data-[state=closed]:animate-out","data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0","data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95","data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2",t),...i})}));R.displayName="PopoverContent";const P=y.forwardRef(({className:t,...r},c)=>e.jsx("div",{ref:c,className:N("flex h-full w-full flex-col overflow-hidden rounded-xl bg-popover text-popover-foreground",t),...r}));P.displayName="CommandRoot";const S=y.forwardRef(({className:t,onValueChange:r,...c},a)=>e.jsx("div",{className:"px-3 pt-3 pb-2 border-b border-border",children:e.jsxs("div",{className:N("flex items-center gap-2 px-3 py-1.5 rounded-lg border border-border bg-muted/40 transition-colors","focus-within:border-primary/50 focus-within:ring-2 focus-within:ring-primary/10"),children:[e.jsxs("svg",{className:"h-3.5 w-3.5 shrink-0 text-muted-foreground",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",autoComplete:"off",autoCorrect:"off",spellCheck:!1,className:N("flex h-8 w-full bg-transparent text-sm outline-none","placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",t),onChange:i=>r==null?void 0:r(i.target.value),...c})]})}));S.displayName="CommandInput";const O=y.forwardRef(({className:t,...r},c)=>e.jsx("div",{ref:c,role:"listbox",className:N("max-h-72 overflow-y-auto overflow-x-hidden p-1",t),...r}));O.displayName="CommandList";const v=y.forwardRef((t,r)=>e.jsx("div",{ref:r,className:"flex flex-col items-center justify-center gap-1 py-8 text-sm text-muted-foreground",...t}));v.displayName="CommandEmpty";const L=y.forwardRef(({className:t,onSelect:r,onMouseDown:c,onKeyDown:a,disabled:i,selected:d,value:g,...k},h)=>e.jsx("div",{ref:h,role:"option","aria-disabled":i||void 0,"aria-selected":d,"data-disabled":i||void 0,"data-selected":d||void 0,tabIndex:i?void 0:0,className:N("relative flex cursor-pointer select-none items-center gap-2 rounded-lg px-2 py-2 text-sm outline-none","focus:bg-accent focus:text-accent-foreground","data-[disabled]:pointer-events-none data-[disabled]:opacity-50","hover:bg-accent/50 transition-colors",d&&"bg-accent text-accent-foreground font-semibold",t),onMouseDown:n=>{n.preventDefault(),c==null||c(n)},onClick:i?void 0:()=>r==null?void 0:r(),onKeyDown:n=>{!i&&n.key==="Enter"&&(n.preventDefault(),r==null||r()),a==null||a(n)},...k}));L.displayName="CommandItem";const z=y.forwardRef(({className:t,isOpen:r,children:c,placeholder:a,hasValue:i,...d},g)=>e.jsxs("button",{ref:g,type:"button",role:"combobox","aria-expanded":r,"aria-haspopup":"listbox",className:N("flex h-12 w-full items-center justify-between gap-3 rounded-xl border border-input bg-background px-4 py-2 text-sm ring-offset-background","placeholder:text-muted-foreground","focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2","disabled:cursor-not-allowed disabled:opacity-50","hover:bg-accent/10 transition-all",!i&&"text-muted-foreground",t),...d,children:[e.jsx("span",{className:"flex min-w-0 flex-1 items-center gap-2 truncate",children:c||e.jsx("span",{children:a})}),e.jsx("svg",{className:N("h-4 w-4 shrink-0 text-muted-foreground/60 transition-transform duration-200",r&&"rotate-180"),viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"6 8 10 12 14 8"})})]}));z.displayName="PickerTrigger";const B=y.forwardRef(({label:t,trigger:r,children:c,open:a,onOpenChange:i,className:d},g)=>e.jsxs("div",{ref:g,className:N("flex flex-col gap-0",d),children:[t&&e.jsx(D,{children:t}),e.jsxs(q,{open:a,onOpenChange:i,children:[e.jsx(M,{asChild:!0,children:r}),e.jsx(R,{className:"p-0",children:c})]})]}));B.displayName="BasePicker";const F=y.forwardRef(({value:t,onRemove:r,onClear:c,isOpen:a,placeholder:i,renderChip:d,maxVisible:g=3,className:k,disabled:h,...n},m)=>{const f=t.slice(0,g),j=t.length-g;return e.jsxs("button",{ref:m,type:"button","aria-haspopup":"listbox","aria-expanded":a,disabled:h,className:N("flex min-h-[3rem] w-full items-center gap-3 rounded-xl border border-input bg-background px-4 py-2","text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2","disabled:cursor-not-allowed disabled:opacity-50 hover:bg-accent/10 transition-all text-start",a&&"ring-2 ring-ring ring-offset-2",k),...n,children:[e.jsx("div",{className:"flex flex-1 flex-wrap gap-1.5 min-w-0 items-center",children:t.length===0?e.jsx("span",{className:"text-muted-foreground",children:i}):e.jsxs(e.Fragment,{children:[f.map((x,b)=>e.jsxs("span",{className:"inline-flex items-center gap-1 rounded-full bg-primary/10 px-2 py-0.5 text-[0.75rem] font-semibold text-primary",children:[d(x),e.jsx("span",{role:"button",tabIndex:h?-1:0,onClick:u=>{u.stopPropagation(),h||r(x,u)},onKeyDown:u=>{(u.key==="Enter"||u.key===" ")&&(u.preventDefault(),u.stopPropagation(),h||r(x,u))},className:"ml-0.5 rounded-full text-primary/60 hover:text-primary transition-colors cursor-pointer","aria-label":"Remove",children:e.jsxs("svg",{width:"9",height:"9",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"})]})})]},b)),j>0&&e.jsxs(w,{className:"bg-muted text-muted-foreground/80 px-2",children:["+",j]})]})}),e.jsxs("div",{className:"flex shrink-0 items-center gap-1 ml-auto",children:[t.length>0&&e.jsx("span",{role:"button",tabIndex:h?-1:0,onClick:x=>{x.stopPropagation(),h||c(x)},onKeyDown:x=>{(x.key==="Enter"||x.key===" ")&&(x.preventDefault(),x.stopPropagation(),h||c(x))},className:"rounded p-0.5 text-muted-foreground hover:text-foreground hover:bg-accent/30 transition-colors cursor-pointer","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:N("h-4 w-4 text-muted-foreground/60 transition-transform duration-200",a&&"rotate-180"),viewBox:"0 0 20 20",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"6 8 10 12 14 8"})})]})]})});F.displayName="MultiSelectTrigger";function G({value:t,onChange:r,placeholder:c="Select a country...",searchable:a=!0,showFlag:i=!0,showPhoneCode:d=!1,disabled:g=!1,className:k,label:h}){const[n,m]=y.useState(!1),[f,j]=y.useState(""),x=f?o.searchCountries(f):o.getAllCountries(),b=u=>{const l=o.getAllCountries().find(p=>p.iso2.toLowerCase()===u.toLowerCase());l&&(r(l),m(!1),j(""))};return e.jsx(B,{label:h,className:k,open:n,onOpenChange:m,trigger:e.jsx(z,{isOpen:n,hasValue:!!t,placeholder:c,disabled:g,children:t&&e.jsxs(e.Fragment,{children:[i&&e.jsx(_,{iso2:t.iso2,flag:t.flag,flagUrl:t.flag_url}),e.jsx("span",{className:"flex-1 text-start truncate",children:t.name}),d&&e.jsxs(w,{children:["+",t.phone_code]})]})}),children:e.jsxs(P,{children:[a&&e.jsx(S,{placeholder:"Search country...",value:f,onValueChange:j}),e.jsxs(O,{children:[x.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π"}),e.jsx("span",{children:"No countries found"})]}),x.map(u=>{const l=(t==null?void 0:t.iso2)===u.iso2;return e.jsxs(L,{onSelect:()=>b(u.iso2),selected:l,children:[i&&e.jsx(_,{iso2:u.iso2,flag:u.flag,flagUrl:u.flag_url}),e.jsxs("div",{className:"flex flex-1 flex-col gap-0 min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:u.name}),e.jsxs("span",{className:"text-[0.7rem] text-muted-foreground",children:[u.iso3," Β· ",u.division_type]})]}),e.jsxs("div",{className:"flex items-center gap-1.5 ml-auto shrink-0",children:[d&&e.jsxs("span",{className:"text-[0.7rem] text-muted-foreground tabular-nums bg-muted px-1.5 py-0.5 rounded",children:["+",u.phone_code]}),l&&e.jsx(T,{})]})]},u.iso2)})]})]})})}function H({value:t,onChange:r,placeholder:c="Select a currency...",searchable:a=!0,showSymbol:i=!0,countryIso2:d,autoSelect:g=!0,disabled:k=!1,className:h,label:n}){const[m,f]=y.useState(!1),[j,x]=y.useState("");y.useEffect(()=>{if(d&&g&&!t){const p=o.getCurrencyByCountry(d);p&&r(p)}},[d,g,t,r]);const u=j?o.searchCurrencies(j,d):(()=>{if(d){const p=o.getCurrencyByCountry(d);return p?[p]:[]}return o.getAllCurrencies()})(),l=p=>{const s=o.getAllCurrencies().find(C=>C.code.toLowerCase()===p.toLowerCase());s&&(r(s),f(!1),x(""))};return e.jsx(B,{label:n,className:h,open:m,onOpenChange:f,trigger:e.jsx(z,{isOpen:m,hasValue:!!t,placeholder:c,disabled:k,children:t&&e.jsxs(e.Fragment,{children:[i&&e.jsx("span",{className:"min-w-[1.5rem] text-center font-bold text-primary text-base",children:t.symbol}),e.jsxs("span",{className:"flex-1 text-start truncate",children:[t.code," β ",t.name]})]})}),children:e.jsxs(P,{children:[a&&e.jsx(S,{placeholder:"Search currency...",value:j,onValueChange:x}),e.jsxs(O,{children:[u.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π°"}),e.jsx("span",{children:"No currencies found"})]}),u.map(p=>{const s=(t==null?void 0:t.code)===p.code;return e.jsxs(L,{onSelect:()=>l(p.code),selected:s,children:[i&&e.jsx("span",{className:"min-w-[1.5rem] text-center font-bold text-primary",children:p.symbol}),e.jsxs("div",{className:"flex flex-1 flex-col gap-0 min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:p.name}),e.jsx("span",{className:"text-[0.7rem] text-muted-foreground",children:p.code})]}),s&&e.jsx(T,{className:"ml-auto shrink-0"})]},p.code)})]})]})})}function J({value:t,onChange:r,placeholder:c="Select a timezone...",searchable:a=!0,countryIso2:i,autoSelect:d=!0,disabled:g=!1,className:k,label:h}){const[n,m]=y.useState(!1),[f,j]=y.useState("");y.useEffect(()=>{if(i&&d&&!t){const l=o.getTimezonesByCountry(i);l&&l.length>0&&r(l[0])}},[i,d,t,r]);const x=i?o.getTimezonesByCountry(i):o.getAllTimezones(),b=f?o.searchTimezones(f,i):x,u=l=>{const p=x.find(s=>s.name===l);p&&(r(p),m(!1),j(""))};return e.jsx(B,{label:h,className:k,open:n,onOpenChange:m,trigger:e.jsx(z,{isOpen:n,hasValue:!!t,placeholder:c,disabled:g,children:t&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"flex-1 text-start truncate",children:t.name}),e.jsx(w,{children:t.offset_name})]})}),children:e.jsxs(P,{children:[a&&e.jsx(S,{placeholder:"Search timezone...",value:f,onValueChange:j}),e.jsxs(O,{children:[b.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π"}),e.jsx("span",{children:"No timezones found"})]}),b.map(l=>{const p=(t==null?void 0:t.name)===l.name;return e.jsxs(L,{onSelect:()=>u(l.name),selected:p,children:[e.jsxs("div",{className:"flex flex-1 flex-col gap-0 min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:l.name}),e.jsxs("span",{className:"text-[0.7rem] text-muted-foreground",children:[l.tzName," Β· ",l.abbreviation]})]}),e.jsxs("div",{className:"flex items-center gap-1.5 ml-auto shrink-0",children:[e.jsx(w,{className:"tabular-nums text-[0.65rem]",children:l.offset_name}),p&&e.jsx(T,{})]})]},l.name)})]})]})})}function K({value:t,onChange:r,placeholder:c="Select a language...",searchable:a=!0,showNativeName:i=!0,disabled:d=!1,className:g,label:k}){const[h,n]=y.useState(!1),[m,f]=y.useState(""),j=m?o.searchLanguages(m):o.getAllLanguages(),x=b=>{const u=o.getAllLanguages().find(l=>l.code.toLowerCase()===b.toLowerCase());u&&(r(u),n(!1),f(""))};return e.jsx(B,{label:k,className:g,open:h,onOpenChange:n,trigger:e.jsx(z,{isOpen:h,hasValue:!!t,placeholder:c,disabled:d,children:t&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"flex-1 text-start truncate",children:t.english_name}),i&&t.native_name!==t.english_name&&e.jsx("span",{className:"text-xs italic text-muted-foreground shrink-0",children:t.native_name})]})}),children:e.jsxs(P,{children:[a&&e.jsx(S,{placeholder:"Search language...",value:m,onValueChange:f}),e.jsxs(O,{children:[j.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π"}),e.jsx("span",{children:"No languages found"})]}),j.map(b=>{const u=(t==null?void 0:t.code)===b.code;return e.jsxs(L,{onSelect:()=>x(b.code),selected:u,children:[e.jsxs("div",{className:"flex flex-1 flex-col gap-0 min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:b.english_name}),i&&b.native_name!==b.english_name&&e.jsx("span",{className:"text-[0.7rem] text-muted-foreground italic",children:b.native_name})]}),e.jsxs("div",{className:"flex items-center gap-1.5 ml-auto shrink-0",children:[e.jsx(w,{className:"text-[0.6rem]",children:b.code}),u&&e.jsx(T,{})]})]},b.code)})]})]})})}function Y({countryIso2:t,value:r,onChange:c,placeholder:a="Select a division...",searchable:i=!0,disabled:d=!1,className:g,label:k}){const[h,n]=y.useState(!1),[m,f]=y.useState(""),j=o.getDivisionsByCountry(t),x=m?j.filter(l=>l.name.toLowerCase().includes(m.toLowerCase())||l.iso2.toLowerCase().includes(m.toLowerCase())||l.timezone.toLowerCase().includes(m.toLowerCase())):j,b=d||!t||j.length===0,u=l=>{const p=j.find(s=>s.name===l);p&&(c(p),n(!1),f(""))};return e.jsx(B,{label:k,className:g,open:h,onOpenChange:l=>!b&&n(l),trigger:e.jsx(z,{isOpen:h,hasValue:!!r,placeholder:t?a:"Select a country first",disabled:b,children:r&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"flex-1 text-start truncate",children:r.name}),e.jsx(w,{children:r.iso2})]})}),children:e.jsxs(P,{children:[i&&e.jsx(S,{placeholder:"Search division...",value:m,onValueChange:f}),e.jsxs(O,{children:[x.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"πΊοΈ"}),e.jsx("span",{children:"No divisions found"})]}),x.map(l=>{const p=(r==null?void 0:r.iso2)===l.iso2&&(r==null?void 0:r.name)===l.name;return e.jsxs(L,{onSelect:()=>u(l.name),selected:p,children:[e.jsxs("div",{className:"flex flex-1 flex-col gap-0 min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:l.name}),e.jsx("span",{className:"text-[0.7rem] text-muted-foreground truncate",children:l.timezone})]}),e.jsxs("div",{className:"flex items-center gap-1.5 ml-auto shrink-0",children:[e.jsx(w,{children:l.iso2}),p&&e.jsx(T,{})]})]},`${l.iso2}-${l.name}`)})]})]})})}const Q=y.forwardRef(({value:t,onChange:r,defaultCountryIso2:c="US",placeholder:a="Phone number",showFlag:i=!0,disabled:d=!1,className:g,label:k},h)=>{const n=o.usePhoneInput(t,r,c);return e.jsxs("div",{ref:h,className:N("flex flex-col gap-0",g),children:[k&&e.jsx(D,{children:k}),e.jsxs("div",{className:N("flex h-12 items-stretch overflow-hidden rounded-xl border border-input bg-background ring-offset-background","focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2","transition-shadow",d&&"opacity-50 pointer-events-none"),children:[e.jsxs(q,{open:n.isOpen,onOpenChange:m=>m?n.toggle():n.close(),children:[e.jsx(M,{asChild:!0,children:e.jsxs("button",{type:"button",disabled:d,className:N("flex h-full shrink-0 items-center gap-1.5 border-r border-input bg-muted px-3","text-sm font-semibold text-foreground transition-colors outline-none","hover:bg-accent/30 focus-visible:bg-accent/30"),children:[i&&n.country&&e.jsx(_,{iso2:n.country.iso2,flag:n.country.flag,flagUrl:n.country.flag_url}),e.jsx("span",{className:"tabular-nums text-primary",children:n.country?`+${n.country.phone_code}`:"+?"}),e.jsx("svg",{className:N("h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform duration-200",n.isOpen&&"rotate-180"),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(R,{align:"start",side:"bottom",sideOffset:4,className:"w-72",children:e.jsxs(P,{children:[e.jsx(S,{placeholder:"Search country or code...",value:n.searchQuery,onValueChange:n.setSearchQuery}),e.jsxs(O,{children:[n.filteredCountries.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π"}),e.jsx("span",{children:"No countries found"})]}),n.filteredCountries.map(m=>{var j;const f=((j=n.country)==null?void 0:j.iso2)===m.iso2;return e.jsxs(L,{onSelect:()=>n.selectCountry(m),selected:f,children:[e.jsx(_,{iso2:m.iso2,flag:m.flag,flagUrl:m.flag_url}),e.jsx("div",{className:"flex flex-1 flex-col min-w-0",children:e.jsx("span",{className:"truncate font-medium text-sm",children:m.name})}),e.jsxs(w,{className:"ml-auto tabular-nums text-[0.7rem]",children:["+",m.phone_code]})]},m.iso2)})]})]})})]}),e.jsx("input",{type:"tel",value:n.number,onChange:m=>n.setNumber(m.target.value),placeholder:a,disabled:d,minLength:n.minLength,maxLength:n.maxLength,inputMode:"numeric",autoComplete:"tel-national",className:N("flex-1 min-w-0 bg-transparent px-3 text-sm text-foreground","placeholder:text-muted-foreground","focus:outline-none")})]}),n.value&&e.jsxs("p",{className:"text-[0.7rem] text-muted-foreground tabular-nums pl-0.5",children:["Full:"," ",e.jsx("span",{className:"font-mono text-primary",children:n.value.full})]})]})});Q.displayName="PhoneInput";const I=3;function Z({value:t,onChange:r,placeholder:c="Select countries...",maxItems:a,showFlags:i=!0,searchable:d=!0,disabled:g=!1,className:k,label:h}){const[n,m]=y.useState(!1),[f,j]=y.useState(""),x=f?o.searchCountries(f):o.getAllCountries(),b=s=>t.some(C=>C.iso2===s.iso2),u=s=>{if(b(s))r(t.filter(C=>C.iso2!==s.iso2));else{if(a!==void 0&&t.length>=a)return;r([...t,s])}},l=(s,C)=>{C.stopPropagation(),r(t.filter(E=>E.iso2!==s.iso2))},p=s=>{s.stopPropagation(),r([])};return t.slice(0,I),t.length-I,e.jsxs(B,{label:h,className:k,open:n,onOpenChange:m,trigger:e.jsx(F,{value:t,onRemove:l,onClear:p,isOpen:n,placeholder:c,disabled:g,renderChip:s=>e.jsxs(e.Fragment,{children:[i&&e.jsx(_,{iso2:s.iso2,flag:s.flag,flagUrl:s.flag_url}),e.jsx("span",{className:"max-w-[80px] truncate",children:s.name})]})}),children:[e.jsxs(P,{children:[d&&e.jsx(S,{placeholder:"Search countries...",value:f,onValueChange:j}),e.jsxs(O,{children:[x.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π"}),e.jsx("span",{children:"No countries found"})]}),x.map(s=>{const C=b(s);return e.jsxs(L,{onSelect:()=>u(s),selected:C,children:[e.jsx("div",{className:N("h-4 w-4 shrink-0 rounded-full border border-border flex items-center justify-center",C&&"bg-primary border-primary"),children:C&&e.jsx("svg",{className:"h-2.5 w-2.5 stroke-white",viewBox:"0 0 20 20",fill:"none",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})})}),i&&e.jsx(_,{iso2:s.iso2,flag:s.flag,flagUrl:s.flag_url}),e.jsxs("div",{className:"flex flex-1 flex-col min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:s.name}),e.jsxs("span",{className:"text-[0.7rem] text-muted-foreground",children:[s.iso3," Β· +",s.phone_code]})]})]},s.iso2)})]})]}),t.length>0&&e.jsxs("div",{className:"flex items-center justify-between border-t border-border px-3 py-2 text-xs text-muted-foreground",children:[e.jsxs("span",{children:[t.length," selected",a?` / ${a}`:""]}),e.jsx("button",{type:"button",onClick:()=>{r([]),m(!1)},className:"text-destructive hover:underline font-medium",children:"Clear all"})]})]})}const V=3;function ee({value:t,onChange:r,placeholder:c="Select currencies...",maxItems:a,showSymbol:i=!0,searchable:d=!0,disabled:g=!1,className:k,label:h}){const[n,m]=y.useState(!1),[f,j]=y.useState(""),x=f?o.searchCurrencies(f):o.getAllCurrencies(),b=s=>t.some(C=>C.code===s.code),u=s=>{if(b(s))r(t.filter(C=>C.code!==s.code));else{if(a!==void 0&&t.length>=a)return;r([...t,s])}},l=(s,C)=>{C.stopPropagation(),r(t.filter(E=>E.code!==s.code))},p=s=>{s.stopPropagation(),r([])};return t.slice(0,V),t.length-V,e.jsxs(B,{label:h,className:k,open:n,onOpenChange:m,trigger:e.jsx(F,{value:t,onRemove:l,onClear:p,isOpen:n,placeholder:c,disabled:g,renderChip:s=>e.jsxs(e.Fragment,{children:[i&&e.jsx("span",{className:"font-bold",children:s.symbol}),e.jsx("span",{children:s.code})]})}),children:[e.jsxs(P,{children:[d&&e.jsx(S,{placeholder:"Search currencies...",value:f,onValueChange:j}),e.jsxs(O,{children:[x.length===0&&e.jsxs(v,{children:[e.jsx("span",{className:"text-2xl opacity-40",children:"π°"}),e.jsx("span",{children:"No currencies found"})]}),x.map(s=>{const C=b(s);return e.jsxs(L,{onSelect:()=>u(s),selected:C,children:[e.jsx("div",{className:N("h-4 w-4 shrink-0 rounded-full border border-border flex items-center justify-center",C&&"bg-primary border-primary"),children:C&&e.jsx("svg",{className:"h-2.5 w-2.5 stroke-white",viewBox:"0 0 20 20",fill:"none",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("polyline",{points:"4 10 8 14 16 6"})})}),i&&e.jsx("span",{className:"min-w-[1.5rem] text-center font-bold text-primary",children:s.symbol}),e.jsxs("div",{className:"flex flex-1 flex-col min-w-0",children:[e.jsx("span",{className:"truncate font-medium",children:s.name}),e.jsx("span",{className:"text-[0.7rem] text-muted-foreground",children:s.code})]})]},s.code)})]})]}),t.length>0&&e.jsxs("div",{className:"flex items-center justify-between border-t border-border px-3 py-2 text-xs text-muted-foreground",children:[e.jsxs("span",{children:[t.length," selected",a?` / ${a}`:""]}),e.jsx("button",{type:"button",onClick:()=>{r([]),m(!1)},className:"text-destructive hover:underline font-medium",children:"Clear all"})]})]})}Object.defineProperty(exports,"getAllCountries",{enumerable:!0,get:()=>o.getAllCountries});Object.defineProperty(exports,"getAllCurrencies",{enumerable:!0,get:()=>o.getAllCurrencies});Object.defineProperty(exports,"getAllLanguages",{enumerable:!0,get:()=>o.getAllLanguages});Object.defineProperty(exports,"getAllTimezones",{enumerable:!0,get:()=>o.getAllTimezones});Object.defineProperty(exports,"getCountryByIso2",{enumerable:!0,get:()=>o.getCountryByIso2});Object.defineProperty(exports,"getCountryByIso3",{enumerable:!0,get:()=>o.getCountryByIso3});Object.defineProperty(exports,"getCountryByName",{enumerable:!0,get:()=>o.getCountryByName});Object.defineProperty(exports,"getCurrencyByCode",{enumerable:!0,get:()=>o.getCurrencyByCode});Object.defineProperty(exports,"getCurrencyByCountry",{enumerable:!0,get:()=>o.getCurrencyByCountry});Object.defineProperty(exports,"getDivisionsByCountry",{enumerable:!0,get:()=>o.getDivisionsByCountry});Object.defineProperty(exports,"getLanguageByCode",{enumerable:!0,get:()=>o.getLanguageByCode});Object.defineProperty(exports,"getTimezoneByName",{enumerable:!0,get:()=>o.getTimezoneByName});Object.defineProperty(exports,"getTimezonesByCountry",{enumerable:!0,get:()=>o.getTimezonesByCountry});Object.defineProperty(exports,"iso2ToFlag",{enumerable:!0,get:()=>o.iso2ToFlag});Object.defineProperty(exports,"searchCountries",{enumerable:!0,get:()=>o.searchCountries});Object.defineProperty(exports,"searchCurrencies",{enumerable:!0,get:()=>o.searchCurrencies});Object.defineProperty(exports,"searchLanguages",{enumerable:!0,get:()=>o.searchLanguages});Object.defineProperty(exports,"searchTimezones",{enumerable:!0,get:()=>o.searchTimezones});Object.defineProperty(exports,"useCountryPicker",{enumerable:!0,get:()=>o.useCountryPicker});Object.defineProperty(exports,"useCurrencyPicker",{enumerable:!0,get:()=>o.useCurrencyPicker});Object.defineProperty(exports,"useDivisionPicker",{enumerable:!0,get:()=>o.useDivisionPicker});Object.defineProperty(exports,"useLanguagePicker",{enumerable:!0,get:()=>o.useLanguagePicker});Object.defineProperty(exports,"useMultiSelect",{enumerable:!0,get:()=>o.useMultiSelect});Object.defineProperty(exports,"usePhoneInput",{enumerable:!0,get:()=>o.usePhoneInput});Object.defineProperty(exports,"useTimezonePicker",{enumerable:!0,get:()=>o.useTimezonePicker});exports.Badge=w;exports.CheckIcon=T;exports.CommandEmpty=v;exports.CommandInput=S;exports.CommandItem=L;exports.CommandList=O;exports.CommandRoot=P;exports.CountryMultiSelect=Z;exports.CountryPicker=G;exports.CurrencyMultiSelect=ee;exports.CurrencyPicker=H;exports.DivisionPicker=Y;exports.LanguagePicker=K;exports.PhoneInput=Q;exports.PickerTrigger=z;exports.Popover=q;exports.PopoverContent=R;exports.PopoverTrigger=M;exports.TimezonePicker=J;exports.cn=N;
|
|
2
|
-
//# sourceMappingURL=ui.cjs.js.map
|