@kopexa/sight
Version:
Kopexa Sight Design System — React component library for GRC applications
489 lines (483 loc) • 13.4 kB
JavaScript
"use client";
;
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/components/country-picker/index.ts
var country_picker_exports = {};
__export(country_picker_exports, {
ALPHA2_TO_ALPHA3: () => ALPHA2_TO_ALPHA3,
ALPHA3_TO_ALPHA2: () => ALPHA3_TO_ALPHA2,
COUNTRY_ALPHA2: () => COUNTRY_ALPHA2,
CountryPicker: () => CountryPicker,
FlagIcon: () => FlagIcon,
getCountries: () => getCountries,
getCountryName: () => getCountryName,
toAlpha2: () => toAlpha2,
toAlpha3: () => toAlpha3,
toFormat: () => toFormat
});
module.exports = __toCommonJS(country_picker_exports);
// src/components/country-picker/countries.ts
var ALPHA2_TO_ALPHA3 = {
AD: "AND",
AE: "ARE",
AF: "AFG",
AG: "ATG",
AI: "AIA",
AL: "ALB",
AM: "ARM",
AO: "AGO",
AQ: "ATA",
AR: "ARG",
AS: "ASM",
AT: "AUT",
AU: "AUS",
AW: "ABW",
AX: "ALA",
AZ: "AZE",
BA: "BIH",
BB: "BRB",
BD: "BGD",
BE: "BEL",
BF: "BFA",
BG: "BGR",
BH: "BHR",
BI: "BDI",
BJ: "BEN",
BL: "BLM",
BM: "BMU",
BN: "BRN",
BO: "BOL",
BQ: "BES",
BR: "BRA",
BS: "BHS",
BT: "BTN",
BV: "BVT",
BW: "BWA",
BY: "BLR",
BZ: "BLZ",
CA: "CAN",
CC: "CCK",
CD: "COD",
CF: "CAF",
CG: "COG",
CH: "CHE",
CI: "CIV",
CK: "COK",
CL: "CHL",
CM: "CMR",
CN: "CHN",
CO: "COL",
CR: "CRI",
CU: "CUB",
CV: "CPV",
CW: "CUW",
CX: "CXR",
CY: "CYP",
CZ: "CZE",
DE: "DEU",
DJ: "DJI",
DK: "DNK",
DM: "DMA",
DO: "DOM",
DZ: "DZA",
EC: "ECU",
EE: "EST",
EG: "EGY",
EH: "ESH",
ER: "ERI",
ES: "ESP",
ET: "ETH",
FI: "FIN",
FJ: "FJI",
FK: "FLK",
FM: "FSM",
FO: "FRO",
FR: "FRA",
GA: "GAB",
GB: "GBR",
GD: "GRD",
GE: "GEO",
GF: "GUF",
GG: "GGY",
GH: "GHA",
GI: "GIB",
GL: "GRL",
GM: "GMB",
GN: "GIN",
GP: "GLP",
GQ: "GNQ",
GR: "GRC",
GS: "SGS",
GT: "GTM",
GU: "GUM",
GW: "GNB",
GY: "GUY",
HK: "HKG",
HM: "HMD",
HN: "HND",
HR: "HRV",
HT: "HTI",
HU: "HUN",
ID: "IDN",
IE: "IRL",
IL: "ISR",
IM: "IMN",
IN: "IND",
IO: "IOT",
IQ: "IRQ",
IR: "IRN",
IS: "ISL",
IT: "ITA",
JE: "JEY",
JM: "JAM",
JO: "JOR",
JP: "JPN",
KE: "KEN",
KG: "KGZ",
KH: "KHM",
KI: "KIR",
KM: "COM",
KN: "KNA",
KP: "PRK",
KR: "KOR",
KW: "KWT",
KY: "CYM",
KZ: "KAZ",
LA: "LAO",
LB: "LBN",
LC: "LCA",
LI: "LIE",
LK: "LKA",
LR: "LBR",
LS: "LSO",
LT: "LTU",
LU: "LUX",
LV: "LVA",
LY: "LBY",
MA: "MAR",
MC: "MCO",
MD: "MDA",
ME: "MNE",
MF: "MAF",
MG: "MDG",
MH: "MHL",
MK: "MKD",
ML: "MLI",
MM: "MMR",
MN: "MNG",
MO: "MAC",
MP: "MNP",
MQ: "MTQ",
MR: "MRT",
MS: "MSR",
MT: "MLT",
MU: "MUS",
MV: "MDV",
MW: "MWI",
MX: "MEX",
MY: "MYS",
MZ: "MOZ",
NA: "NAM",
NC: "NCL",
NE: "NER",
NF: "NFK",
NG: "NGA",
NI: "NIC",
NL: "NLD",
NO: "NOR",
NP: "NPL",
NR: "NRU",
NU: "NIU",
NZ: "NZL",
OM: "OMN",
PA: "PAN",
PE: "PER",
PF: "PYF",
PG: "PNG",
PH: "PHL",
PK: "PAK",
PL: "POL",
PM: "SPM",
PN: "PCN",
PR: "PRI",
PS: "PSE",
PT: "PRT",
PW: "PLW",
PY: "PRY",
QA: "QAT",
RE: "REU",
RO: "ROU",
RS: "SRB",
RU: "RUS",
RW: "RWA",
SA: "SAU",
SB: "SLB",
SC: "SYC",
SD: "SDN",
SE: "SWE",
SG: "SGP",
SH: "SHN",
SI: "SVN",
SJ: "SJM",
SK: "SVK",
SL: "SLE",
SM: "SMR",
SN: "SEN",
SO: "SOM",
SR: "SUR",
SS: "SSD",
ST: "STP",
SV: "SLV",
SX: "SXM",
SY: "SYR",
SZ: "SWZ",
TC: "TCA",
TD: "TCD",
TF: "ATF",
TG: "TGO",
TH: "THA",
TJ: "TJK",
TK: "TKL",
TL: "TLS",
TM: "TKM",
TN: "TUN",
TO: "TON",
TR: "TUR",
TT: "TTO",
TV: "TUV",
TW: "TWN",
TZ: "TZA",
UA: "UKR",
UG: "UGA",
UM: "UMI",
US: "USA",
UY: "URY",
UZ: "UZB",
VA: "VAT",
VC: "VCT",
VE: "VEN",
VG: "VGB",
VI: "VIR",
VN: "VNM",
VU: "VUT",
WF: "WLF",
WS: "WSM",
YE: "YEM",
YT: "MYT",
ZA: "ZAF",
ZM: "ZMB",
ZW: "ZWE"
};
var ALPHA3_TO_ALPHA2 = Object.fromEntries(
Object.entries(ALPHA2_TO_ALPHA3).map(([a2, a3]) => [a3, a2])
);
var COUNTRY_ALPHA2 = Object.keys(ALPHA2_TO_ALPHA3).sort();
function toAlpha2(code) {
if (!code) return void 0;
const c = code.trim().toUpperCase();
if (c.length === 2) return ALPHA2_TO_ALPHA3[c] ? c : void 0;
if (c.length === 3) return ALPHA3_TO_ALPHA2[c];
return void 0;
}
function toAlpha3(code) {
const a2 = toAlpha2(code);
return a2 ? ALPHA2_TO_ALPHA3[a2] : void 0;
}
function toFormat(code, format) {
return format === "alpha3" ? toAlpha3(code) : toAlpha2(code);
}
var nameFormatters = /* @__PURE__ */ new Map();
function getCountryName(code, locale = "en") {
var _a;
const a2 = toAlpha2(code);
if (!a2) return void 0;
let fmt = nameFormatters.get(locale);
if (!fmt) {
fmt = new Intl.DisplayNames([locale], { type: "region" });
nameFormatters.set(locale, fmt);
}
try {
return (_a = fmt.of(a2)) != null ? _a : a2;
} catch {
return a2;
}
}
function getCountries(locale = "en") {
const collator = new Intl.Collator(locale);
return COUNTRY_ALPHA2.map((alpha2) => {
var _a;
return {
alpha2,
alpha3: ALPHA2_TO_ALPHA3[alpha2],
name: (_a = getCountryName(alpha2, locale)) != null ? _a : alpha2
};
}).sort((a, b) => collator.compare(a.name, b.name));
}
// src/components/country-picker/country-picker.tsx
var import_button = require("@kopexa/button");
var import_combobox = require("@kopexa/combobox");
var import_i18n2 = require("@kopexa/i18n");
var import_shared_utils2 = require("@kopexa/shared-utils");
var import_theme2 = require("@kopexa/theme");
var import_react = require("react");
// src/components/country-picker/flag-icon.tsx
var import_i18n = require("@kopexa/i18n");
var import_shared_utils = require("@kopexa/shared-utils");
var import_theme = require("@kopexa/theme");
var import_tooltip = require("@kopexa/tooltip");
var FlagComponents = __toESM(require("country-flag-icons/react/3x2"));
var import_jsx_runtime = require("react/jsx-runtime");
var flags = FlagComponents;
function FlagIcon({
code,
size,
tooltip,
locale,
className,
"aria-label": ariaLabel,
"aria-hidden": ariaHidden
}) {
var _a;
const intl = (0, import_i18n.useSafeIntl)();
const resolvedLocale = locale != null ? locale : intl.locale;
const a2 = toAlpha2(code);
const name = getCountryName(code, resolvedLocale);
const label = (_a = ariaLabel != null ? ariaLabel : name) != null ? _a : code;
const Flag = a2 ? flags[a2] : void 0;
const classes = (0, import_shared_utils.cn)((0, import_theme.flagIcon)({ size }), className);
if (ariaHidden) {
return Flag ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Flag, { className: classes, "aria-hidden": true }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: classes, "aria-hidden": true });
}
const flag = Flag ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Flag, { className: classes, role: "img", "aria-label": label }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: classes, role: "img", "aria-label": label });
if (!tooltip || !name) return flag;
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.Tooltip, { content: name, children: flag });
}
// src/components/country-picker/country-picker.tsx
var import_jsx_runtime2 = require("react/jsx-runtime");
function norm(s) {
return s.normalize("NFD").replace(/\p{Diacritic}/gu, "").toLowerCase().trim();
}
function CountryPicker({
value,
defaultValue,
onChange,
valueFormat = "alpha2",
locale,
placeholder = "Select country",
searchPlaceholder = "Search countries\u2026",
emptyMessage = "No countries found.",
showCode = true,
disabled,
className,
id
}) {
var _a, _b, _c, _d;
const intl = (0, import_i18n2.useSafeIntl)();
const resolvedLocale = locale != null ? locale : intl.locale;
const s = (0, import_theme2.countryPicker)();
const items = (0, import_react.useMemo)(() => getCountries(resolvedLocale), [resolvedLocale]);
const byA2 = (0, import_react.useMemo)(() => {
const m = /* @__PURE__ */ new Map();
for (const c of items) m.set(c.alpha2, c);
return m;
}, [items]);
const selected = value != null ? (_b = byA2.get((_a = toAlpha2(value)) != null ? _a : "")) != null ? _b : null : void 0;
const defaultSelected = defaultValue != null ? (_d = byA2.get((_c = toAlpha2(defaultValue)) != null ? _c : "")) != null ? _d : null : void 0;
const filter = (item, query) => {
const country = item;
const q = norm(query);
if (!q) return true;
return norm(country.name).includes(q) || country.alpha2.toLowerCase().startsWith(q) || country.alpha3.toLowerCase().startsWith(q);
};
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
import_combobox.Combobox,
{
items,
value: selected,
defaultValue: defaultSelected,
onValueChange: (value2) => {
var _a2;
const country = value2;
onChange == null ? void 0 : onChange(
country ? (_a2 = toFormat(country.alpha2, valueFormat)) != null ? _a2 : null : null
);
},
itemToStringLabel: (value2) => {
var _a2;
return (_a2 = value2 == null ? void 0 : value2.name) != null ? _a2 : "";
},
isItemEqualToValue: (a, b) => (a == null ? void 0 : a.alpha2) === (b == null ? void 0 : b.alpha2),
filter,
disabled,
variant: "inside",
children: [
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
import_combobox.Combobox.Trigger,
{
id,
className: (0, import_shared_utils2.cn)("w-full border-input bg-background px-3", className),
render: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_button.Button, { variant: "outline", mode: "input" }),
children: [
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Value, { children: (country) => country ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: s.value(), children: [
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(FlagIcon, { code: country.alpha2, "aria-hidden": true }),
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: s.valueName(), children: country.name })
] }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: s.valuePlaceholder(), children: placeholder }) }),
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Icon, {})
]
}
),
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_combobox.Combobox.Content, { className: "pt-0", children: [
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "p-2", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Input, { placeholder: searchPlaceholder }) }),
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Empty, { children: emptyMessage }),
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.List, { maxHeight: 320, children: (country) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_combobox.Combobox.Item, { value: country, children: [
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: s.item(), children: [
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(FlagIcon, { code: country.alpha2, "aria-hidden": true }),
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: s.itemName(), children: country.name }),
showCode && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: s.itemCode(), children: toFormat(country.alpha2, valueFormat) })
] }),
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.ItemIndicator, {})
] }, country.alpha2) })
] })
]
}
);
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
ALPHA2_TO_ALPHA3,
ALPHA3_TO_ALPHA2,
COUNTRY_ALPHA2,
CountryPicker,
FlagIcon,
getCountries,
getCountryName,
toAlpha2,
toAlpha3,
toFormat
});