react-country-kit 1.0.0

package/dist/ui.es.js

@@ -0,0 +1,1141 @@
+import { jsx as e, jsxs as n, Fragment as R } from "react/jsx-runtime";
+import v, { useState as C, useEffect as F } from "react";
+import * as V from "@radix-ui/react-popover";
+import { clsx as Z } from "clsx";
+import { twMerge as K } from "tailwind-merge";
+import { s as G, g as W, p as $, b as H, c as q, v as A, k as ee, y as te, x as ne, j as I, q as re, h as oe } from "./useTimezonePicker-BMFPsn3E.mjs";
+import { l as ye, m as ke, n as we, o as Ce, r as ve, t as Le, w as Pe, a as Se, d as Be, e as Oe, f as _e, u as Re, i as je } from "./useTimezonePicker-BMFPsn3E.mjs";
+function k(...t) {
+  return K(Z(t));
+}
+const J = V.Root, Y = V.Trigger, T = ({ className: t }) => /* @__PURE__ */ e(
+  "svg",
+  {
+    className: k("h-4 w-4 text-primary", t),
+    viewBox: "0 0 20 20",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    children: /* @__PURE__ */ e("polyline", { points: "4 10 8 14 16 6" })
+  }
+);
+T.displayName = "CheckIcon";
+const E = ({
+  children: t,
+  className: r
+}) => /* @__PURE__ */ e(
+  "label",
+  {
+    className: k(
+      "text-[0.65rem] font-bold uppercase tracking-[0.12em] text-muted-foreground/80 ml-1 mb-1.5 block",
+      r
+    ),
+    children: t
+  }
+);
+E.displayName = "FieldLabel";
+const L = ({ children: t, className: r }) => /* @__PURE__ */ e(
+  "span",
+  {
+    className: k(
+      "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
+  }
+);
+L.displayName = "Badge";
+const M = v.forwardRef(({ className: t, align: r = "start", sideOffset: p = 6, onCloseAutoFocus: l, ...a }, d) => /* @__PURE__ */ e(V.Portal, { children: /* @__PURE__ */ e(
+  V.Content,
+  {
+    ref: d,
+    align: r,
+    sideOffset: p,
+    onCloseAutoFocus: (g) => {
+      g.preventDefault(), l == null || l(g);
+    },
+    className: k(
+      "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
+    ),
+    ...a
+  }
+) }));
+M.displayName = "PopoverContent";
+const P = v.forwardRef(({ className: t, ...r }, p) => /* @__PURE__ */ e(
+  "div",
+  {
+    ref: p,
+    className: k(
+      "flex h-full w-full flex-col overflow-hidden rounded-xl bg-popover text-popover-foreground",
+      t
+    ),
+    ...r
+  }
+));
+P.displayName = "CommandRoot";
+const S = v.forwardRef(
+  ({ className: t, onValueChange: r, ...p }, l) => /* @__PURE__ */ e("div", { className: "px-3 pt-3 pb-2 border-b border-border", children: /* @__PURE__ */ n("div", { className: k(
+    "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: [
+    /* @__PURE__ */ n(
+      "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: [
+          /* @__PURE__ */ e("circle", { cx: "8.5", cy: "8.5", r: "5.5" }),
+          /* @__PURE__ */ e("path", { d: "M17 17l-4-4", strokeLinecap: "round" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(
+      "input",
+      {
+        ref: l,
+        type: "text",
+        autoComplete: "off",
+        autoCorrect: "off",
+        spellCheck: !1,
+        className: k(
+          "flex h-8 w-full bg-transparent text-sm outline-none",
+          "placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
+          t
+        ),
+        onChange: (a) => r == null ? void 0 : r(a.target.value),
+        ...p
+      }
+    )
+  ] }) })
+);
+S.displayName = "CommandInput";
+const B = v.forwardRef(({ className: t, ...r }, p) => /* @__PURE__ */ e(
+  "div",
+  {
+    ref: p,
+    role: "listbox",
+    className: k("max-h-72 overflow-y-auto overflow-x-hidden p-1", t),
+    ...r
+  }
+));
+B.displayName = "CommandList";
+const O = v.forwardRef((t, r) => /* @__PURE__ */ e(
+  "div",
+  {
+    ref: r,
+    className: "flex flex-col items-center justify-center gap-1 py-8 text-sm text-muted-foreground",
+    ...t
+  }
+));
+O.displayName = "CommandEmpty";
+const _ = v.forwardRef(
+  ({ className: t, onSelect: r, onMouseDown: p, onKeyDown: l, disabled: a, selected: d, value: g, ...w }, x) => /* @__PURE__ */ e(
+    "div",
+    {
+      ref: x,
+      role: "option",
+      "aria-disabled": a || void 0,
+      "aria-selected": d,
+      "data-disabled": a || void 0,
+      "data-selected": d || void 0,
+      tabIndex: a ? void 0 : 0,
+      className: k(
+        "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: (s) => {
+        s.preventDefault(), p == null || p(s);
+      },
+      onClick: a ? void 0 : () => r == null ? void 0 : r(),
+      onKeyDown: (s) => {
+        !a && s.key === "Enter" && (s.preventDefault(), r == null || r()), l == null || l(s);
+      },
+      ...w
+    }
+  )
+);
+_.displayName = "CommandItem";
+const z = v.forwardRef(
+  ({ className: t, isOpen: r, children: p, placeholder: l, hasValue: a, ...d }, g) => /* @__PURE__ */ n(
+    "button",
+    {
+      ref: g,
+      type: "button",
+      role: "combobox",
+      "aria-expanded": r,
+      "aria-haspopup": "listbox",
+      className: k(
+        "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",
+        !a && "text-muted-foreground",
+        t
+      ),
+      ...d,
+      children: [
+        /* @__PURE__ */ e("span", { className: "flex min-w-0 flex-1 items-center gap-2 truncate", children: p || /* @__PURE__ */ e("span", { children: l }) }),
+        /* @__PURE__ */ e(
+          "svg",
+          {
+            className: k(
+              "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: /* @__PURE__ */ e("polyline", { points: "6 8 10 12 14 8" })
+          }
+        )
+      ]
+    }
+  )
+);
+z.displayName = "PickerTrigger";
+const j = v.forwardRef(
+  ({ label: t, trigger: r, children: p, open: l, onOpenChange: a, className: d }, g) => /* @__PURE__ */ n("div", { ref: g, className: k("flex flex-col gap-0", d), children: [
+    t && /* @__PURE__ */ e(E, { children: t }),
+    /* @__PURE__ */ n(J, { open: l, onOpenChange: a, children: [
+      /* @__PURE__ */ e(Y, { asChild: !0, children: r }),
+      /* @__PURE__ */ e(M, { className: "p-0", children: p })
+    ] })
+  ] })
+);
+j.displayName = "BasePicker";
+const D = v.forwardRef(
+  ({
+    value: t,
+    onRemove: r,
+    onClear: p,
+    isOpen: l,
+    placeholder: a,
+    renderChip: d,
+    maxVisible: g = 3,
+    className: w,
+    disabled: x,
+    ...s
+  }, c) => {
+    const u = t.slice(0, g), N = t.length - g;
+    return /* @__PURE__ */ n(
+      "button",
+      {
+        ref: c,
+        type: "button",
+        "aria-haspopup": "listbox",
+        "aria-expanded": l,
+        disabled: x,
+        className: k(
+          "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",
+          l && "ring-2 ring-ring ring-offset-2",
+          w
+        ),
+        ...s,
+        children: [
+          /* @__PURE__ */ e("div", { className: "flex flex-1 flex-wrap gap-1.5 min-w-0 items-center", children: t.length === 0 ? /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: a }) : /* @__PURE__ */ n(R, { children: [
+            u.map((h, b) => /* @__PURE__ */ n(
+              "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(h),
+                  /* @__PURE__ */ e(
+                    "span",
+                    {
+                      role: "button",
+                      tabIndex: x ? -1 : 0,
+                      onClick: (m) => {
+                        m.stopPropagation(), x || r(h, m);
+                      },
+                      onKeyDown: (m) => {
+                        (m.key === "Enter" || m.key === " ") && (m.preventDefault(), m.stopPropagation(), x || r(h, m));
+                      },
+                      className: "ml-0.5 rounded-full text-primary/60 hover:text-primary transition-colors cursor-pointer",
+                      "aria-label": "Remove",
+                      children: /* @__PURE__ */ n("svg", { width: "9", height: "9", viewBox: "0 0 20 20", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", children: [
+                        /* @__PURE__ */ e("line", { x1: "5", y1: "5", x2: "15", y2: "15" }),
+                        /* @__PURE__ */ e("line", { x1: "15", y1: "5", x2: "5", y2: "15" })
+                      ] })
+                    }
+                  )
+                ]
+              },
+              b
+            )),
+            N > 0 && /* @__PURE__ */ n(L, { className: "bg-muted text-muted-foreground/80 px-2", children: [
+              "+",
+              N
+            ] })
+          ] }) }),
+          /* @__PURE__ */ n("div", { className: "flex shrink-0 items-center gap-1 ml-auto", children: [
+            t.length > 0 && /* @__PURE__ */ e(
+              "span",
+              {
+                role: "button",
+                tabIndex: x ? -1 : 0,
+                onClick: (h) => {
+                  h.stopPropagation(), x || p(h);
+                },
+                onKeyDown: (h) => {
+                  (h.key === "Enter" || h.key === " ") && (h.preventDefault(), h.stopPropagation(), x || p(h));
+                },
+                className: "rounded p-0.5 text-muted-foreground hover:text-foreground hover:bg-accent/30 transition-colors cursor-pointer",
+                "aria-label": "Clear all",
+                children: /* @__PURE__ */ n("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
+                  /* @__PURE__ */ e("line", { x1: "5", y1: "5", x2: "15", y2: "15" }),
+                  /* @__PURE__ */ e("line", { x1: "15", y1: "5", x2: "5", y2: "15" })
+                ] })
+              }
+            ),
+            /* @__PURE__ */ e(
+              "svg",
+              {
+                className: k("h-4 w-4 text-muted-foreground/60 transition-transform duration-200", l && "rotate-180"),
+                viewBox: "0 0 20 20",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2.5",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: /* @__PURE__ */ e("polyline", { points: "6 8 10 12 14 8" })
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+D.displayName = "MultiSelectTrigger";
+function me({
+  value: t,
+  onChange: r,
+  placeholder: p = "Select a country...",
+  searchable: l = !0,
+  showFlag: a = !0,
+  showPhoneCode: d = !1,
+  disabled: g = !1,
+  className: w,
+  label: x
+}) {
+  const [s, c] = C(!1), [u, N] = C(""), h = u ? G(u) : W(), b = (m) => {
+    const i = W().find(
+      (f) => f.iso2.toLowerCase() === m.toLowerCase()
+    );
+    i && (r(i), c(!1), N(""));
+  };
+  return /* @__PURE__ */ e(
+    j,
+    {
+      label: x,
+      className: w,
+      open: s,
+      onOpenChange: c,
+      trigger: /* @__PURE__ */ e(
+        z,
+        {
+          isOpen: s,
+          hasValue: !!t,
+          placeholder: p,
+          disabled: g,
+          children: t && /* @__PURE__ */ n(R, { children: [
+            a && /* @__PURE__ */ e("span", { className: "text-lg leading-none", children: t.flag }),
+            /* @__PURE__ */ e("span", { className: "flex-1 text-start truncate", children: t.name }),
+            d && /* @__PURE__ */ n(L, { children: [
+              "+",
+              t.phone_code
+            ] })
+          ] })
+        }
+      ),
+      children: /* @__PURE__ */ n(P, { children: [
+        l && /* @__PURE__ */ e(
+          S,
+          {
+            placeholder: "Search country...",
+            value: u,
+            onValueChange: N
+          }
+        ),
+        /* @__PURE__ */ n(B, { children: [
+          h.length === 0 && /* @__PURE__ */ n(O, { children: [
+            /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "🌍" }),
+            /* @__PURE__ */ e("span", { children: "No countries found" })
+          ] }),
+          h.map((m) => {
+            const i = (t == null ? void 0 : t.iso2) === m.iso2;
+            return /* @__PURE__ */ n(
+              _,
+              {
+                onSelect: () => b(m.iso2),
+                selected: i,
+                children: [
+                  a && /* @__PURE__ */ e("span", { className: "text-lg leading-none", children: m.flag }),
+                  /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col gap-0 min-w-0", children: [
+                    /* @__PURE__ */ e("span", { className: "truncate font-medium", children: m.name }),
+                    /* @__PURE__ */ n("span", { className: "text-[0.7rem] text-muted-foreground", children: [
+                      m.iso3,
+                      " · ",
+                      m.division_type
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ n("div", { className: "flex items-center gap-1.5 ml-auto shrink-0", children: [
+                    d && /* @__PURE__ */ n("span", { className: "text-[0.7rem] text-muted-foreground tabular-nums bg-muted px-1.5 py-0.5 rounded", children: [
+                      "+",
+                      m.phone_code
+                    ] }),
+                    i && /* @__PURE__ */ e(T, {})
+                  ] })
+                ]
+              },
+              m.iso2
+            );
+          })
+        ] })
+      ] })
+    }
+  );
+}
+function pe({
+  value: t,
+  onChange: r,
+  placeholder: p = "Select a currency...",
+  searchable: l = !0,
+  showSymbol: a = !0,
+  countryIso2: d,
+  autoSelect: g = !0,
+  disabled: w = !1,
+  className: x,
+  label: s
+}) {
+  const [c, u] = C(!1), [N, h] = C("");
+  F(() => {
+    if (d && g && !t) {
+      const f = $(d);
+      f && r(f);
+    }
+  }, [d, g, t, r]);
+  const m = N ? H(N, d) : (() => {
+    if (d) {
+      const f = $(d);
+      return f ? [f] : [];
+    }
+    return q();
+  })(), i = (f) => {
+    const o = q().find(
+      (y) => y.code.toLowerCase() === f.toLowerCase()
+    );
+    o && (r(o), u(!1), h(""));
+  };
+  return /* @__PURE__ */ e(
+    j,
+    {
+      label: s,
+      className: x,
+      open: c,
+      onOpenChange: u,
+      trigger: /* @__PURE__ */ e(
+        z,
+        {
+          isOpen: c,
+          hasValue: !!t,
+          placeholder: p,
+          disabled: w,
+          children: t && /* @__PURE__ */ n(R, { children: [
+            a && /* @__PURE__ */ e("span", { className: "min-w-[1.5rem] text-center font-bold text-primary text-base", children: t.symbol }),
+            /* @__PURE__ */ n("span", { className: "flex-1 text-start truncate", children: [
+              t.code,
+              " — ",
+              t.name
+            ] })
+          ] })
+        }
+      ),
+      children: /* @__PURE__ */ n(P, { children: [
+        l && /* @__PURE__ */ e(
+          S,
+          {
+            placeholder: "Search currency...",
+            value: N,
+            onValueChange: h
+          }
+        ),
+        /* @__PURE__ */ n(B, { children: [
+          m.length === 0 && /* @__PURE__ */ n(O, { children: [
+            /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "💰" }),
+            /* @__PURE__ */ e("span", { children: "No currencies found" })
+          ] }),
+          m.map((f) => {
+            const o = (t == null ? void 0 : t.code) === f.code;
+            return /* @__PURE__ */ n(
+              _,
+              {
+                onSelect: () => i(f.code),
+                selected: o,
+                children: [
+                  a && /* @__PURE__ */ e("span", { className: "min-w-[1.5rem] text-center font-bold text-primary", children: f.symbol }),
+                  /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col gap-0 min-w-0", children: [
+                    /* @__PURE__ */ e("span", { className: "truncate font-medium", children: f.name }),
+                    /* @__PURE__ */ e("span", { className: "text-[0.7rem] text-muted-foreground", children: f.code })
+                  ] }),
+                  o && /* @__PURE__ */ e(T, { className: "ml-auto shrink-0" })
+                ]
+              },
+              f.code
+            );
+          })
+        ] })
+      ] })
+    }
+  );
+}
+function he({
+  value: t,
+  onChange: r,
+  placeholder: p = "Select a timezone...",
+  searchable: l = !0,
+  countryIso2: a,
+  autoSelect: d = !0,
+  disabled: g = !1,
+  className: w,
+  label: x
+}) {
+  const [s, c] = C(!1), [u, N] = C("");
+  F(() => {
+    if (a && d && !t) {
+      const i = A(a);
+      i && i.length > 0 && r(i[0]);
+    }
+  }, [a, d, t, r]);
+  const h = a ? A(a) : ee(), b = u ? te(u, a) : h, m = (i) => {
+    const f = h.find((o) => o.name === i);
+    f && (r(f), c(!1), N(""));
+  };
+  return /* @__PURE__ */ e(
+    j,
+    {
+      label: x,
+      className: w,
+      open: s,
+      onOpenChange: c,
+      trigger: /* @__PURE__ */ e(
+        z,
+        {
+          isOpen: s,
+          hasValue: !!t,
+          placeholder: p,
+          disabled: g,
+          children: t && /* @__PURE__ */ n(R, { children: [
+            /* @__PURE__ */ e("span", { className: "flex-1 text-start truncate", children: t.name }),
+            /* @__PURE__ */ e(L, { children: t.offset_name })
+          ] })
+        }
+      ),
+      children: /* @__PURE__ */ n(P, { children: [
+        l && /* @__PURE__ */ e(
+          S,
+          {
+            placeholder: "Search timezone...",
+            value: u,
+            onValueChange: N
+          }
+        ),
+        /* @__PURE__ */ n(B, { children: [
+          b.length === 0 && /* @__PURE__ */ n(O, { children: [
+            /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "🕐" }),
+            /* @__PURE__ */ e("span", { children: "No timezones found" })
+          ] }),
+          b.map((i) => {
+            const f = (t == null ? void 0 : t.name) === i.name;
+            return /* @__PURE__ */ n(
+              _,
+              {
+                onSelect: () => m(i.name),
+                selected: f,
+                children: [
+                  /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col gap-0 min-w-0", children: [
+                    /* @__PURE__ */ e("span", { className: "truncate font-medium", children: i.name }),
+                    /* @__PURE__ */ n("span", { className: "text-[0.7rem] text-muted-foreground", children: [
+                      i.tzName,
+                      " · ",
+                      i.abbreviation
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ n("div", { className: "flex items-center gap-1.5 ml-auto shrink-0", children: [
+                    /* @__PURE__ */ e(L, { className: "tabular-nums text-[0.65rem]", children: i.offset_name }),
+                    f && /* @__PURE__ */ e(T, {})
+                  ] })
+                ]
+              },
+              i.name
+            );
+          })
+        ] })
+      ] })
+    }
+  );
+}
+function fe({
+  value: t,
+  onChange: r,
+  placeholder: p = "Select a language...",
+  searchable: l = !0,
+  showNativeName: a = !0,
+  disabled: d = !1,
+  className: g,
+  label: w
+}) {
+  const [x, s] = C(!1), [c, u] = C(""), N = c ? ne(c) : I(), h = (b) => {
+    const m = I().find(
+      (i) => i.code.toLowerCase() === b.toLowerCase()
+    );
+    m && (r(m), s(!1), u(""));
+  };
+  return /* @__PURE__ */ e(
+    j,
+    {
+      label: w,
+      className: g,
+      open: x,
+      onOpenChange: s,
+      trigger: /* @__PURE__ */ e(
+        z,
+        {
+          isOpen: x,
+          hasValue: !!t,
+          placeholder: p,
+          disabled: d,
+          children: t && /* @__PURE__ */ n(R, { children: [
+            /* @__PURE__ */ e("span", { className: "flex-1 text-start truncate", children: t.english_name }),
+            a && t.native_name !== t.english_name && /* @__PURE__ */ e("span", { className: "text-xs italic text-muted-foreground shrink-0", children: t.native_name })
+          ] })
+        }
+      ),
+      children: /* @__PURE__ */ n(P, { children: [
+        l && /* @__PURE__ */ e(
+          S,
+          {
+            placeholder: "Search language...",
+            value: c,
+            onValueChange: u
+          }
+        ),
+        /* @__PURE__ */ n(B, { children: [
+          N.length === 0 && /* @__PURE__ */ n(O, { children: [
+            /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "🌐" }),
+            /* @__PURE__ */ e("span", { children: "No languages found" })
+          ] }),
+          N.map((b) => {
+            const m = (t == null ? void 0 : t.code) === b.code;
+            return /* @__PURE__ */ n(
+              _,
+              {
+                onSelect: () => h(b.code),
+                selected: m,
+                children: [
+                  /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col gap-0 min-w-0", children: [
+                    /* @__PURE__ */ e("span", { className: "truncate font-medium", children: b.english_name }),
+                    a && b.native_name !== b.english_name && /* @__PURE__ */ e("span", { className: "text-[0.7rem] text-muted-foreground italic", children: b.native_name })
+                  ] }),
+                  /* @__PURE__ */ n("div", { className: "flex items-center gap-1.5 ml-auto shrink-0", children: [
+                    /* @__PURE__ */ e(L, { className: "text-[0.6rem]", children: b.code }),
+                    m && /* @__PURE__ */ e(T, {})
+                  ] })
+                ]
+              },
+              b.code
+            );
+          })
+        ] })
+      ] })
+    }
+  );
+}
+function ue({
+  countryIso2: t,
+  value: r,
+  onChange: p,
+  placeholder: l = "Select a division...",
+  searchable: a = !0,
+  disabled: d = !1,
+  className: g,
+  label: w
+}) {
+  const [x, s] = C(!1), [c, u] = C(""), N = re(t), h = c ? N.filter(
+    (i) => i.name.toLowerCase().includes(c.toLowerCase()) || i.iso2.toLowerCase().includes(c.toLowerCase()) || i.timezone.toLowerCase().includes(c.toLowerCase())
+  ) : N, b = d || !t || N.length === 0, m = (i) => {
+    const f = N.find((o) => o.name === i);
+    f && (p(f), s(!1), u(""));
+  };
+  return /* @__PURE__ */ e(
+    j,
+    {
+      label: w,
+      className: g,
+      open: x,
+      onOpenChange: (i) => !b && s(i),
+      trigger: /* @__PURE__ */ e(
+        z,
+        {
+          isOpen: x,
+          hasValue: !!r,
+          placeholder: t ? l : "Select a country first",
+          disabled: b,
+          children: r && /* @__PURE__ */ n(R, { children: [
+            /* @__PURE__ */ e("span", { className: "flex-1 text-start truncate", children: r.name }),
+            /* @__PURE__ */ e(L, { children: r.iso2 })
+          ] })
+        }
+      ),
+      children: /* @__PURE__ */ n(P, { children: [
+        a && /* @__PURE__ */ e(
+          S,
+          {
+            placeholder: "Search division...",
+            value: c,
+            onValueChange: u
+          }
+        ),
+        /* @__PURE__ */ n(B, { children: [
+          h.length === 0 && /* @__PURE__ */ n(O, { children: [
+            /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "🗺️" }),
+            /* @__PURE__ */ e("span", { children: "No divisions found" })
+          ] }),
+          h.map((i) => {
+            const f = (r == null ? void 0 : r.iso2) === i.iso2 && (r == null ? void 0 : r.name) === i.name;
+            return /* @__PURE__ */ n(
+              _,
+              {
+                onSelect: () => m(i.name),
+                selected: f,
+                children: [
+                  /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col gap-0 min-w-0", children: [
+                    /* @__PURE__ */ e("span", { className: "truncate font-medium", children: i.name }),
+                    /* @__PURE__ */ e("span", { className: "text-[0.7rem] text-muted-foreground truncate", children: i.timezone })
+                  ] }),
+                  /* @__PURE__ */ n("div", { className: "flex items-center gap-1.5 ml-auto shrink-0", children: [
+                    /* @__PURE__ */ e(L, { children: i.iso2 }),
+                    f && /* @__PURE__ */ e(T, {})
+                  ] })
+                ]
+              },
+              `${i.iso2}-${i.name}`
+            );
+          })
+        ] })
+      ] })
+    }
+  );
+}
+const se = v.forwardRef(
+  ({
+    value: t,
+    onChange: r,
+    defaultCountryIso2: p = "US",
+    placeholder: l = "Phone number",
+    showFlag: a = !0,
+    disabled: d = !1,
+    className: g,
+    label: w
+  }, x) => {
+    const s = oe(t, r, p);
+    return /* @__PURE__ */ n("div", { ref: x, className: k("flex flex-col gap-0", g), children: [
+      w && /* @__PURE__ */ e(E, { children: w }),
+      /* @__PURE__ */ n(
+        "div",
+        {
+          className: k(
+            "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: [
+            /* @__PURE__ */ n(
+              J,
+              {
+                open: s.isOpen,
+                onOpenChange: (c) => c ? s.toggle() : s.close(),
+                children: [
+                  /* @__PURE__ */ e(Y, { asChild: !0, children: /* @__PURE__ */ n(
+                    "button",
+                    {
+                      type: "button",
+                      disabled: d,
+                      className: k(
+                        "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: [
+                        a && s.country && /* @__PURE__ */ e("span", { className: "text-lg leading-none", children: s.country.flag }),
+                        /* @__PURE__ */ e("span", { className: "tabular-nums text-primary", children: s.country ? `+${s.country.phone_code}` : "+?" }),
+                        /* @__PURE__ */ e(
+                          "svg",
+                          {
+                            className: k(
+                              "h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform duration-200",
+                              s.isOpen && "rotate-180"
+                            ),
+                            viewBox: "0 0 20 20",
+                            fill: "none",
+                            stroke: "currentColor",
+                            strokeWidth: "2",
+                            strokeLinecap: "round",
+                            children: /* @__PURE__ */ e("polyline", { points: "5 8 10 13 15 8" })
+                          }
+                        )
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ e(
+                    M,
+                    {
+                      align: "start",
+                      side: "bottom",
+                      sideOffset: 4,
+                      className: "w-72",
+                      children: /* @__PURE__ */ n(P, { children: [
+                        /* @__PURE__ */ e(
+                          S,
+                          {
+                            placeholder: "Search country or code...",
+                            value: s.searchQuery,
+                            onValueChange: s.setSearchQuery
+                          }
+                        ),
+                        /* @__PURE__ */ n(B, { children: [
+                          s.filteredCountries.length === 0 && /* @__PURE__ */ n(O, { children: [
+                            /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "🌍" }),
+                            /* @__PURE__ */ e("span", { children: "No countries found" })
+                          ] }),
+                          s.filteredCountries.map((c) => {
+                            var N;
+                            const u = ((N = s.country) == null ? void 0 : N.iso2) === c.iso2;
+                            return /* @__PURE__ */ n(
+                              _,
+                              {
+                                onSelect: () => s.selectCountry(c),
+                                selected: u,
+                                children: [
+                                  /* @__PURE__ */ e("span", { className: "text-lg leading-none", children: c.flag }),
+                                  /* @__PURE__ */ e("div", { className: "flex flex-1 flex-col min-w-0", children: /* @__PURE__ */ e("span", { className: "truncate font-medium text-sm", children: c.name }) }),
+                                  /* @__PURE__ */ n(L, { className: "ml-auto tabular-nums text-[0.7rem]", children: [
+                                    "+",
+                                    c.phone_code
+                                  ] })
+                                ]
+                              },
+                              c.iso2
+                            );
+                          })
+                        ] })
+                      ] })
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ e(
+              "input",
+              {
+                type: "tel",
+                value: s.number,
+                onChange: (c) => s.setNumber(c.target.value),
+                placeholder: l,
+                disabled: d,
+                minLength: s.minLength,
+                maxLength: s.maxLength,
+                inputMode: "numeric",
+                autoComplete: "tel-national",
+                className: k(
+                  "flex-1 min-w-0 bg-transparent px-3 text-sm text-foreground",
+                  "placeholder:text-muted-foreground",
+                  "focus:outline-none"
+                )
+              }
+            )
+          ]
+        }
+      ),
+      s.value && /* @__PURE__ */ n("p", { className: "text-[0.7rem] text-muted-foreground tabular-nums pl-0.5", children: [
+        "Full:",
+        " ",
+        /* @__PURE__ */ e("span", { className: "font-mono text-primary", children: s.value.full })
+      ] })
+    ] });
+  }
+);
+se.displayName = "PhoneInput";
+const X = 3;
+function ge({
+  value: t,
+  onChange: r,
+  placeholder: p = "Select countries...",
+  maxItems: l,
+  showFlags: a = !0,
+  searchable: d = !0,
+  disabled: g = !1,
+  className: w,
+  label: x
+}) {
+  const [s, c] = C(!1), [u, N] = C(""), h = u ? G(u) : W(), b = (o) => t.some((y) => y.iso2 === o.iso2), m = (o) => {
+    if (b(o))
+      r(t.filter((y) => y.iso2 !== o.iso2));
+    else {
+      if (l !== void 0 && t.length >= l) return;
+      r([...t, o]);
+    }
+  }, i = (o, y) => {
+    y.stopPropagation(), r(t.filter((Q) => Q.iso2 !== o.iso2));
+  }, f = (o) => {
+    o.stopPropagation(), r([]);
+  };
+  return t.slice(0, X), t.length - X, /* @__PURE__ */ n(
+    j,
+    {
+      label: x,
+      className: w,
+      open: s,
+      onOpenChange: c,
+      trigger: /* @__PURE__ */ e(
+        D,
+        {
+          value: t,
+          onRemove: i,
+          onClear: f,
+          isOpen: s,
+          placeholder: p,
+          disabled: g,
+          renderChip: (o) => /* @__PURE__ */ n(R, { children: [
+            a && /* @__PURE__ */ e("span", { children: o.flag }),
+            /* @__PURE__ */ e("span", { className: "max-w-[80px] truncate", children: o.name })
+          ] })
+        }
+      ),
+      children: [
+        /* @__PURE__ */ n(P, { children: [
+          d && /* @__PURE__ */ e(S, { placeholder: "Search countries...", value: u, onValueChange: N }),
+          /* @__PURE__ */ n(B, { children: [
+            h.length === 0 && /* @__PURE__ */ n(O, { children: [
+              /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "🌍" }),
+              /* @__PURE__ */ e("span", { children: "No countries found" })
+            ] }),
+            h.map((o) => {
+              const y = b(o);
+              return /* @__PURE__ */ n(
+                _,
+                {
+                  onSelect: () => m(o),
+                  selected: y,
+                  children: [
+                    /* @__PURE__ */ e("div", { className: k(
+                      "h-4 w-4 shrink-0 rounded-full border border-border flex items-center justify-center",
+                      y && "bg-primary border-primary"
+                    ), children: y && /* @__PURE__ */ e("svg", { className: "h-2.5 w-2.5 stroke-white", viewBox: "0 0 20 20", fill: "none", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ e("polyline", { points: "4 10 8 14 16 6" }) }) }),
+                    a && /* @__PURE__ */ e("span", { className: "text-lg leading-none", children: o.flag }),
+                    /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col min-w-0", children: [
+                      /* @__PURE__ */ e("span", { className: "truncate font-medium", children: o.name }),
+                      /* @__PURE__ */ n("span", { className: "text-[0.7rem] text-muted-foreground", children: [
+                        o.iso3,
+                        " · +",
+                        o.phone_code
+                      ] })
+                    ] })
+                  ]
+                },
+                o.iso2
+              );
+            })
+          ] })
+        ] }),
+        t.length > 0 && /* @__PURE__ */ n("div", { className: "flex items-center justify-between border-t border-border px-3 py-2 text-xs text-muted-foreground", children: [
+          /* @__PURE__ */ n("span", { children: [
+            t.length,
+            " selected",
+            l ? ` / ${l}` : ""
+          ] }),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                r([]), c(!1);
+              },
+              className: "text-destructive hover:underline font-medium",
+              children: "Clear all"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+const U = 3;
+function xe({
+  value: t,
+  onChange: r,
+  placeholder: p = "Select currencies...",
+  maxItems: l,
+  showSymbol: a = !0,
+  searchable: d = !0,
+  disabled: g = !1,
+  className: w,
+  label: x
+}) {
+  const [s, c] = C(!1), [u, N] = C(""), h = u ? H(u) : q(), b = (o) => t.some((y) => y.code === o.code), m = (o) => {
+    if (b(o))
+      r(t.filter((y) => y.code !== o.code));
+    else {
+      if (l !== void 0 && t.length >= l) return;
+      r([...t, o]);
+    }
+  }, i = (o, y) => {
+    y.stopPropagation(), r(t.filter((Q) => Q.code !== o.code));
+  }, f = (o) => {
+    o.stopPropagation(), r([]);
+  };
+  return t.slice(0, U), t.length - U, /* @__PURE__ */ n(
+    j,
+    {
+      label: x,
+      className: w,
+      open: s,
+      onOpenChange: c,
+      trigger: /* @__PURE__ */ e(
+        D,
+        {
+          value: t,
+          onRemove: i,
+          onClear: f,
+          isOpen: s,
+          placeholder: p,
+          disabled: g,
+          renderChip: (o) => /* @__PURE__ */ n(R, { children: [
+            a && /* @__PURE__ */ e("span", { className: "font-bold", children: o.symbol }),
+            /* @__PURE__ */ e("span", { children: o.code })
+          ] })
+        }
+      ),
+      children: [
+        /* @__PURE__ */ n(P, { children: [
+          d && /* @__PURE__ */ e(S, { placeholder: "Search currencies...", value: u, onValueChange: N }),
+          /* @__PURE__ */ n(B, { children: [
+            h.length === 0 && /* @__PURE__ */ n(O, { children: [
+              /* @__PURE__ */ e("span", { className: "text-2xl opacity-40", children: "💰" }),
+              /* @__PURE__ */ e("span", { children: "No currencies found" })
+            ] }),
+            h.map((o) => {
+              const y = b(o);
+              return /* @__PURE__ */ n(
+                _,
+                {
+                  onSelect: () => m(o),
+                  selected: y,
+                  children: [
+                    /* @__PURE__ */ e("div", { className: k(
+                      "h-4 w-4 shrink-0 rounded-full border border-border flex items-center justify-center",
+                      y && "bg-primary border-primary"
+                    ), children: y && /* @__PURE__ */ e("svg", { className: "h-2.5 w-2.5 stroke-white", viewBox: "0 0 20 20", fill: "none", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ e("polyline", { points: "4 10 8 14 16 6" }) }) }),
+                    a && /* @__PURE__ */ e("span", { className: "min-w-[1.5rem] text-center font-bold text-primary", children: o.symbol }),
+                    /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col min-w-0", children: [
+                      /* @__PURE__ */ e("span", { className: "truncate font-medium", children: o.name }),
+                      /* @__PURE__ */ e("span", { className: "text-[0.7rem] text-muted-foreground", children: o.code })
+                    ] })
+                  ]
+                },
+                o.code
+              );
+            })
+          ] })
+        ] }),
+        t.length > 0 && /* @__PURE__ */ n("div", { className: "flex items-center justify-between border-t border-border px-3 py-2 text-xs text-muted-foreground", children: [
+          /* @__PURE__ */ n("span", { children: [
+            t.length,
+            " selected",
+            l ? ` / ${l}` : ""
+          ] }),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                r([]), c(!1);
+              },
+              className: "text-destructive hover:underline font-medium",
+              children: "Clear all"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+export {
+  L as Badge,
+  T as CheckIcon,
+  O as CommandEmpty,
+  S as CommandInput,
+  _ as CommandItem,
+  B as CommandList,
+  P as CommandRoot,
+  ge as CountryMultiSelect,
+  me as CountryPicker,
+  xe as CurrencyMultiSelect,
+  pe as CurrencyPicker,
+  ue as DivisionPicker,
+  fe as LanguagePicker,
+  se as PhoneInput,
+  z as PickerTrigger,
+  J as Popover,
+  M as PopoverContent,
+  Y as PopoverTrigger,
+  he as TimezonePicker,
+  k as cn,
+  W as getAllCountries,
+  q as getAllCurrencies,
+  I as getAllLanguages,
+  ee as getAllTimezones,
+  ye as getCountryByIso2,
+  ke as getCountryByIso3,
+  we as getCountryByName,
+  Ce as getCurrencyByCode,
+  $ as getCurrencyByCountry,
+  re as getDivisionsByCountry,
+  ve as getLanguageByCode,
+  Le as getTimezoneByName,
+  A as getTimezonesByCountry,
+  Pe as iso2ToFlag,
+  G as searchCountries,
+  H as searchCurrencies,
+  ne as searchLanguages,
+  te as searchTimezones,
+  Se as useCountryPicker,
+  Be as useCurrencyPicker,
+  Oe as useDivisionPicker,
+  _e as useLanguagePicker,
+  Re as useMultiSelect,
+  oe as usePhoneInput,
+  je as useTimezonePicker
+};
+//# sourceMappingURL=ui.es.js.map