react-country-kit-ui 1.2.0 → 2.0.0

package/dist/index.mjs

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