docthub-core-components 3.3.10 → 3.3.11

package/dist/components/overrides/ui/inputs/otp-input.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as F, jsxs as Z } from "react/jsx-runtime";
+import { jsx as B, jsxs as Z } from "react/jsx-runtime";
 import { c as x } from "react-compiler-runtime";
 import { useRef as _, useId as G, useLayoutEffect as tt } from "react";
 import { Input as et } from "../../../ui/input.js";
@@ -10,46 +10,46 @@ const ut = (N) => {
     length: H,
     label: f,
     value: d,
-    onChange: j,
+    onChange: K,
     onComplete: g,
     className: C,
-    error: n,
+    error: a,
     inputClassName: J,
     autoFocus: Q,
     autoSubmit: U,
     secure: V
-  } = N, o = H === void 0 ? 6 : H, K = J === void 0 ? "h-10 w-10" : J, q = Q === void 0 ? !1 : Q, L = U === void 0 ? !1 : U, E = V === void 0 ? !1 : V;
+  } = N, o = H === void 0 ? 6 : H, F = J === void 0 ? "h-10 w-10" : J, j = Q === void 0 ? !1 : Q, q = U === void 0 ? !1 : U, E = V === void 0 ? !1 : V;
+  let L;
+  t[0] === Symbol.for("react.memo_cache_sentinel") ? (L = [], t[0] = L) : L = t[0];
+  const n = _(L), h = G(), y = G(), S = G();
   let M;
-  t[0] === Symbol.for("react.memo_cache_sentinel") ? (M = [], t[0] = M) : M = t[0];
-  const a = _(M), h = G(), v = G(), S = G();
-  let O;
   if (t[1] !== o || t[2] !== S) {
     let i;
-    t[4] !== S ? (i = (W, z) => `${S}-digit-${z + 1}`, t[4] = S, t[5] = i) : i = t[5], O = Array.from({
+    t[4] !== S ? (i = (W, z) => `${S}-digit-${z + 1}`, t[4] = S, t[5] = i) : i = t[5], M = Array.from({
       length: o
-    }, i), t[1] = o, t[2] = S, t[3] = O;
+    }, i), t[1] = o, t[2] = S, t[3] = M;
   } else
-    O = t[3];
-  const T = O;
-  let A, P;
-  t[6] !== q ? (A = () => {
+    M = t[3];
+  const T = M;
+  let O, A;
+  t[6] !== j ? (O = () => {
     var i;
-    q && ((i = a.current[0]) == null || i.focus({
+    j && ((i = n.current[0]) == null || i.focus({
       preventScroll: !0
     }));
-  }, P = [q], t[6] = q, t[7] = A, t[8] = P) : (A = t[7], P = t[8]), tt(A, P);
-  let b, y, D, I, u, m;
-  if (t[9] !== L || t[10] !== C || t[11] !== n || t[12] !== v || t[13] !== K || t[14] !== f || t[15] !== h || t[16] !== o || t[17] !== j || t[18] !== g || t[19] !== T || t[20] !== E || t[21] !== d) {
+  }, A = [j], t[6] = j, t[7] = O, t[8] = A) : (O = t[7], A = t[8]), tt(O, A);
+  let v, b, D, I, u, m;
+  if (t[9] !== q || t[10] !== C || t[11] !== a || t[12] !== y || t[13] !== F || t[14] !== f || t[15] !== h || t[16] !== o || t[17] !== K || t[18] !== g || t[19] !== T || t[20] !== E || t[21] !== d) {
     const i = (r, e) => {
       var c;
       const l = e.replace(/\D/g, "").slice(0, 1);
       if (e && !l || e.length > 1 && l.length <= 1)
         return;
       const s = [...d];
-      s[r] = l, j(s), l && r < o - 1 && ((c = a.current[r + 1]) == null || c.focus()), s.every(st) && (g && g(s.join("")), L && queueMicrotask(() => {
+      s[r] = l, K(s), l && r < o - 1 && ((c = n.current[r + 1]) == null || c.focus()), s.every(st) && (g && g(s.join("")), q && queueMicrotask(() => {
         var $;
-        const B = ($ = a.current[r]) == null ? void 0 : $.closest("form");
-        B && B.requestSubmit();
+        const R = ($ = n.current[r]) == null ? void 0 : $.closest("form");
+        R && R.requestSubmit();
       }));
     }, W = (r, e) => {
       var $;
@@ -60,35 +60,35 @@ const ut = (N) => {
       const c = [...d];
       for (let p = 0; p < s.length && r + p < o; p++)
         c[r + p] = s[p];
-      j(c);
-      const B = Math.min(r + s.length, o - 1);
-      ($ = a.current[B]) == null || $.focus(), c.every(ot) && (g && g(c.join("")), L && queueMicrotask(() => {
+      K(c);
+      const R = Math.min(r + s.length, o - 1);
+      ($ = n.current[R]) == null || $.focus(), c.every(ot) && (g && g(c.join("")), q && queueMicrotask(() => {
         var X;
-        const p = (X = a.current[r]) == null ? void 0 : X.closest("form");
+        const p = (X = n.current[r]) == null ? void 0 : X.closest("form");
         p && p.requestSubmit();
       }));
     }, z = (r, e) => {
       var l, s, c;
-      e.key.length === 1 && !/\d/.test(e.key) ? e.preventDefault() : e.key === "Backspace" && !d[r] && r > 0 ? (l = a.current[r - 1]) == null || l.focus() : e.key === "ArrowLeft" && r > 0 ? (e.preventDefault(), (s = a.current[r - 1]) == null || s.focus()) : e.key === "ArrowRight" && r < o - 1 && (e.preventDefault(), (c = a.current[r + 1]) == null || c.focus());
+      !e.ctrlKey && !e.metaKey && !e.altKey && e.key.length === 1 && !/\d/.test(e.key) ? e.preventDefault() : e.key === "Backspace" && !d[r] && r > 0 ? (l = n.current[r - 1]) == null || l.focus() : e.key === "ArrowLeft" && r > 0 ? (e.preventDefault(), (s = n.current[r - 1]) == null || s.focus()) : e.key === "ArrowRight" && r < o - 1 && (e.preventDefault(), (c = n.current[r + 1]) == null || c.focus());
     };
-    t[28] !== C ? (u = Y("space-y-2", C), t[28] = C, t[29] = u) : u = t[29], t[30] !== f || t[31] !== h ? (m = f && /* @__PURE__ */ F(rt, { id: h, className: "text-sm font-medium text-gray-700", children: f }), t[30] = f, t[31] = h, t[32] = m) : m = t[32], b = "flex gap-2 border-0 p-0 m-0", y = f ? h : void 0, D = n ? v : void 0, I = T.map((r, e) => {
+    t[28] !== C ? (u = Y("space-y-2", C), t[28] = C, t[29] = u) : u = t[29], t[30] !== f || t[31] !== h ? (m = f && /* @__PURE__ */ B(rt, { id: h, className: "text-sm font-medium text-gray-700", children: f }), t[30] = f, t[31] = h, t[32] = m) : m = t[32], v = "flex gap-2 border-0 p-0 m-0", b = f ? h : void 0, D = a ? y : void 0, I = T.map((r, e) => {
       const l = d[e] ?? "";
-      return /* @__PURE__ */ F(et, { ref: (s) => {
-        a.current[e] = s;
-      }, type: E ? "password" : "text", inputMode: "numeric", maxLength: 1, value: l, onChange: (s) => i(e, s.target.value), onKeyDown: (s) => z(e, s), onPaste: (s) => W(e, s), className: Y("text-center p-0 text-lg font-semibold", n && "border-destructive", K), "aria-label": `${f || "OTP"} digit ${e + 1} of ${o}`, "aria-invalid": n ? "true" : "false" }, r);
-    }), t[9] = L, t[10] = C, t[11] = n, t[12] = v, t[13] = K, t[14] = f, t[15] = h, t[16] = o, t[17] = j, t[18] = g, t[19] = T, t[20] = E, t[21] = d, t[22] = b, t[23] = y, t[24] = D, t[25] = I, t[26] = u, t[27] = m;
+      return /* @__PURE__ */ B(et, { ref: (s) => {
+        n.current[e] = s;
+      }, type: E ? "password" : "text", inputMode: "numeric", maxLength: 1, value: l, onChange: (s) => i(e, s.target.value), onKeyDown: (s) => z(e, s), onPaste: (s) => W(e, s), className: Y("text-center p-0 text-lg font-semibold", a && "border-destructive", F), "aria-label": `${f || "OTP"} digit ${e + 1} of ${o}`, "aria-invalid": a ? "true" : "false" }, r);
+    }), t[9] = q, t[10] = C, t[11] = a, t[12] = y, t[13] = F, t[14] = f, t[15] = h, t[16] = o, t[17] = K, t[18] = g, t[19] = T, t[20] = E, t[21] = d, t[22] = v, t[23] = b, t[24] = D, t[25] = I, t[26] = u, t[27] = m;
   } else
-    b = t[22], y = t[23], D = t[24], I = t[25], u = t[26], m = t[27];
+    v = t[22], b = t[23], D = t[24], I = t[25], u = t[26], m = t[27];
   let k;
-  t[33] !== b || t[34] !== y || t[35] !== D || t[36] !== I ? (k = /* @__PURE__ */ F("fieldset", { className: b, "aria-labelledby": y, "aria-describedby": D, children: I }), t[33] = b, t[34] = y, t[35] = D, t[36] = I, t[37] = k) : k = t[37];
+  t[33] !== v || t[34] !== b || t[35] !== D || t[36] !== I ? (k = /* @__PURE__ */ B("fieldset", { className: v, "aria-labelledby": b, "aria-describedby": D, children: I }), t[33] = v, t[34] = b, t[35] = D, t[36] = I, t[37] = k) : k = t[37];
   let w;
-  t[38] !== n || t[39] !== v ? (w = n && /* @__PURE__ */ F("p", { id: v, className: "text-xs text-destructive mt-1", role: "alert", children: n }), t[38] = n, t[39] = v, t[40] = w) : w = t[40];
-  let R;
-  return t[41] !== u || t[42] !== m || t[43] !== k || t[44] !== w ? (R = /* @__PURE__ */ Z("div", { className: u, children: [
+  t[38] !== a || t[39] !== y ? (w = a && /* @__PURE__ */ B("p", { id: y, className: "text-xs text-destructive mt-1", role: "alert", children: a }), t[38] = a, t[39] = y, t[40] = w) : w = t[40];
+  let P;
+  return t[41] !== u || t[42] !== m || t[43] !== k || t[44] !== w ? (P = /* @__PURE__ */ Z("div", { className: u, children: [
     m,
     k,
     w
-  ] }), t[41] = u, t[42] = m, t[43] = k, t[44] = w, t[45] = R) : R = t[45], R;
+  ] }), t[41] = u, t[42] = m, t[43] = k, t[44] = w, t[45] = P) : P = t[45], P;
 };
 function st(N) {
   return N !== "";

package/dist/components/overrides/ui/inputs/phone-input.js

@@ -1,205 +1,205 @@
 "use client";
-import { jsx as c, jsxs as T, Fragment as $e } from "react/jsx-runtime";
-import { c as he } from "react-compiler-runtime";
-import { ChevronsUpDown as Pe, CheckIcon as Te } from "lucide-react";
-import * as R from "react";
-import * as ke from "react-phone-number-input";
-import { isPossiblePhoneNumber as ut, isValidPhoneNumber as pt } from "react-phone-number-input";
-import Ae from "react-phone-number-input/flags";
-import { CommandInput as Be, CommandEmpty as Le, CommandList as Ve, CommandGroup as ze, Command as Ge, CommandItem as Ue } from "../../../ui/command.js";
-import { Input as qe } from "../../../ui/input.js";
-import { Label as Me } from "../../../ui/label.js";
-import { PopoverTrigger as Xe, PopoverContent as He, Popover as Je } from "../../../ui/popover.js";
-import { cn as ee } from "../../../../lib/utils.js";
-import { DoctTypography as Se } from "../../../ui/typography.js";
-const Ke = /\D/g, te = (r) => r.replace(Ke, ""), _e = (r) => {
+import { jsxs as j, jsx as i, Fragment as V } from "react/jsx-runtime";
+import { c as Z } from "react-compiler-runtime";
+import { ChevronsUpDown as se, CheckIcon as ie } from "lucide-react";
+import * as h from "react";
+import * as oe from "react-phone-number-input";
+import { isPossiblePhoneNumber as Te, isValidPhoneNumber as Be } from "react-phone-number-input";
+import ce from "react-phone-number-input/flags";
+import { CommandInput as ae, CommandEmpty as de, CommandList as me, CommandGroup as fe, Command as ue, CommandItem as pe } from "../../../ui/command.js";
+import { Input as ye } from "../../../ui/input.js";
+import { Label as he } from "../../../ui/label.js";
+import { PopoverTrigger as be, PopoverContent as ge, Popover as xe } from "../../../ui/popover.js";
+import { cn as H } from "../../../../lib/utils.js";
+import { DoctTypography as W } from "../../../ui/typography.js";
+const ve = /\D/g, J = (r) => r.replace(ve, ""), Y = (r) => {
   const e = r.match(/^\+\s*(\d+)\s*-\s*(\d*)\s*$/);
   return e ? {
     callingCode: e[1],
     national: e[2]
   } : null;
-}, De = (r) => {
+}, ee = (r) => {
   if (r == null) return "";
-  const e = String(r).trim(), t = _e(e);
-  return t ? t.national : te(e);
-}, U = (r) => {
+  const e = String(r).trim(), t = Y(e);
+  return t ? t.national : J(e);
+}, B = (r) => {
   if (!r) return "91";
   if (typeof r == "object" && "countryCode" in r)
-    return te(r.countryCode) || "91";
+    return J(r.countryCode) || "91";
   try {
-    return ke.getCountryCallingCode(r);
+    return oe.getCountryCallingCode(r);
   } catch {
     return "91";
   }
-}, je = (r, e) => {
+}, te = (r, e) => {
   if (r == null)
     return e && e.length > 0 ? e[0] : "IN";
   if (typeof r == "number" && (e != null && e.length)) {
     const t = e[0];
     if (t && typeof t == "object" && "countryId" in t) {
-      const o = e.find((n) => n.countryId === r);
+      const o = e.find((c) => c.countryId === r);
       if (o) return o;
     }
     return e[r];
   }
   return r;
-}, Oe = (r, e) => {
-  if (!e) return r ? `+${te(r)}` : "";
-  const t = U(e);
+}, re = (r, e) => {
+  if (!e) return r ? `+${J(r)}` : "";
+  const t = B(e);
   return r ? `+${t}-${r}` : `+${t}`;
-}, Fe = (r, e) => e ? typeof r == "object" && "countryId" in r && typeof e == "object" && "countryId" in e ? r.countryId === e.countryId : r === e : !1, Ie = (r, e, t) => {
-  const o = te(e), n = r.map((l) => l.value).filter((l) => !!l).filter((l) => U(l) === o);
-  if (n.length !== 0)
-    return t && n.some((l) => Fe(l, t)) ? t : n[0];
-}, Ee = (r) => {
-  const e = he(5), {
+}, K = (r, e) => e ? typeof r == "object" && "countryId" in r && typeof e == "object" && "countryId" in e ? r.countryId === e.countryId : r === e : !1, Q = (r, e, t) => {
+  const o = J(e), c = r.map((n) => n.value).filter((n) => !!n).filter((n) => B(n) === o);
+  if (c.length !== 0)
+    return t && c.some((n) => K(n, t)) ? t : c[0];
+}, ne = (r) => {
+  const e = Z(5), {
     country: t,
     countryName: o
-  } = r, n = Ae[t];
-  let l;
-  e[0] !== n || e[1] !== o ? (l = n && /* @__PURE__ */ c(n, { title: o }), e[0] = n, e[1] = o, e[2] = l) : l = e[2];
-  let s;
-  return e[3] !== l ? (s = /* @__PURE__ */ c("span", { className: "flex h-4 w-6 overflow-hidden rounded-sm bg-foreground/20 [&_svg:not([class*='size-'])]:size-full", children: l }), e[3] = l, e[4] = s) : s = e[4], s;
-}, Qe = (r) => {
-  const e = he(48), {
+  } = r, c = ce[t];
+  let n;
+  e[0] !== c || e[1] !== o ? (n = c && /* @__PURE__ */ i(c, { title: o }), e[0] = c, e[1] = o, e[2] = n) : n = e[2];
+  let a;
+  return e[3] !== n ? (a = /* @__PURE__ */ i("span", { className: "flex h-4 w-6 overflow-hidden rounded-sm bg-foreground/20 [&_svg:not([class*='size-'])]:size-full", children: n }), e[3] = n, e[4] = a) : a = e[4], a;
+}, we = (r) => {
+  const e = Z(48), {
     disabled: t,
     value: o,
-    options: n,
-    onChange: l,
-    showFlagVariant: s,
-    hasError: x,
-    popoverAnchorRef: f
-  } = r, C = R.useRef(null), [$, w] = R.useState(""), [h, m] = R.useState(!1);
-  let y;
-  e[0] !== o ? (y = o ? `+${U(o)}` : "+91", e[0] = o, e[1] = y) : y = e[1];
-  const d = y;
-  let a;
-  e[2] === Symbol.for("react.memo_cache_sentinel") ? (a = (F) => {
-    m(F), F && w("");
-  }, e[2] = a) : a = e[2];
-  const g = x ? "border-destructive" : "border-gray-300", v = h && "bg-gray-100";
-  let I;
-  e[3] !== g || e[4] !== v ? (I = ee("flex h-[40px] items-center gap-1.5 rounded-l-md rounded-r-none border-l-[1px] border-t-[1px] border-b-[1px] bg-white px-3 py-[1px] text-sm font-medium text-gray-900 transition-colors", g, "hover:bg-gray-100 focus:z-10 focus:outline-none", "disabled:cursor-not-allowed disabled:opacity-50", v), e[3] = g, e[4] = v, e[5] = I) : I = e[5];
+    options: c,
+    onChange: n,
+    showFlagVariant: a,
+    hasError: I,
+    popoverAnchorRef: u
+  } = r, w = h.useRef(null), [F, p] = h.useState(""), [N, b] = h.useState(!1);
+  let f;
+  e[0] !== o ? (f = o ? `+${B(o)}` : "+91", e[0] = o, e[1] = f) : f = e[1];
+  const m = f;
+  let g;
+  e[2] === Symbol.for("react.memo_cache_sentinel") ? (g = (_) => {
+    b(_), _ && p("");
+  }, e[2] = g) : g = e[2];
+  const x = I ? "border-destructive" : "border-gray-300", $ = N && "bg-gray-100";
+  let R;
+  e[3] !== x || e[4] !== $ ? (R = H("flex h-[40px] items-center gap-1.5 rounded-l-md rounded-r-none border-l-[1px] border-t-[1px] border-b-[1px] bg-white px-3 py-[1px] text-sm font-medium text-gray-900 transition-colors", x, "hover:bg-gray-100 focus:z-10 focus:outline-none", "disabled:cursor-not-allowed disabled:opacity-50", $), e[3] = x, e[4] = $, e[5] = R) : R = e[5];
+  let P;
+  e[6] !== o || e[7] !== a ? (P = a && o && typeof o == "string" && /* @__PURE__ */ i("span", { className: "mr-1 flex items-center", children: /* @__PURE__ */ i(ne, { country: o, countryName: o }) }), e[6] = o, e[7] = a, e[8] = P) : P = e[8];
   let D;
-  e[6] !== o || e[7] !== s ? (D = s && o && typeof o == "string" && /* @__PURE__ */ c("span", { className: "mr-1 flex items-center", children: /* @__PURE__ */ c(Ee, { country: o, countryName: o }) }), e[6] = o, e[7] = s, e[8] = D) : D = e[8];
-  let j;
-  e[9] !== d ? (j = /* @__PURE__ */ c(Se, { variant: "body2", weight: "regular", className: "text-gray-900", children: d }), e[9] = d, e[10] = j) : j = e[10];
-  const b = t && "hidden";
-  let V;
-  e[11] !== b ? (V = ee("h-4 w-4 text-gray-500 shrink-0", b), e[11] = b, e[12] = V) : V = e[12];
-  let z;
-  e[13] !== V ? (z = /* @__PURE__ */ c(Pe, { className: V }), e[13] = V, e[14] = z) : z = e[14];
-  let S;
-  e[15] !== t || e[16] !== z || e[17] !== I || e[18] !== D || e[19] !== j ? (S = /* @__PURE__ */ c(Xe, { asChild: !0, children: /* @__PURE__ */ T("button", { type: "button", disabled: t, className: I, children: [
+  e[9] !== m ? (D = /* @__PURE__ */ i(W, { variant: "body2", weight: "regular", className: "text-gray-900", children: m }), e[9] = m, e[10] = D) : D = e[10];
+  const G = t && "hidden";
+  let O;
+  e[11] !== G ? (O = H("h-4 w-4 text-gray-500 shrink-0", G), e[11] = G, e[12] = O) : O = e[12];
+  let k;
+  e[13] !== O ? (k = /* @__PURE__ */ i(se, { className: O }), e[13] = O, e[14] = k) : k = e[14];
+  let A;
+  e[15] !== t || e[16] !== k || e[17] !== R || e[18] !== P || e[19] !== D ? (A = /* @__PURE__ */ i(be, { asChild: !0, children: /* @__PURE__ */ j("button", { type: "button", disabled: t, className: R, children: [
+    P,
     D,
-    j,
-    z
-  ] }) }), e[15] = t, e[16] = z, e[17] = I, e[18] = D, e[19] = j, e[20] = S) : S = e[20];
-  let q;
-  e[21] === Symbol.for("react.memo_cache_sentinel") ? (q = {
+    k
+  ] }) }), e[15] = t, e[16] = k, e[17] = R, e[18] = P, e[19] = D, e[20] = A) : A = e[20];
+  let L;
+  e[21] === Symbol.for("react.memo_cache_sentinel") ? (L = {
     side: "flip",
     align: "shift",
     fallbackAxisSide: "none"
-  }, e[21] = q) : q = e[21];
-  let k;
-  e[22] === Symbol.for("react.memo_cache_sentinel") ? (k = (F) => {
-    w(F), window.setTimeout(() => {
-      const L = C.current;
-      L && (L.scrollTop = 0);
+  }, e[21] = L) : L = e[21];
+  let M;
+  e[22] === Symbol.for("react.memo_cache_sentinel") ? (M = (_) => {
+    p(_), window.setTimeout(() => {
+      const X = w.current;
+      X && (X.scrollTop = 0);
     }, 0);
-  }, e[22] = k) : k = e[22];
-  let _;
-  e[23] !== $ ? (_ = /* @__PURE__ */ c("div", { className: "mb-3 h-[32px] rounded-full border border-gray-300 bg-white overflow-hidden [&_[cmdk-input-wrapper]]:h-full [&_[cmdk-input-wrapper]]:px-3 [&_[cmdk-input-wrapper]_svg]:text-gray-500", children: /* @__PURE__ */ c(Be, { value: $, onValueChange: k, placeholder: "Search country..." }) }), e[23] = $, e[24] = _) : _ = e[24];
-  let A, G;
-  e[25] === Symbol.for("react.memo_cache_sentinel") ? (A = {
+  }, e[22] = M) : M = e[22];
+  let v;
+  e[23] !== F ? (v = /* @__PURE__ */ i("div", { className: "mb-3 h-[32px] rounded-full border border-gray-300 bg-white overflow-hidden [&_[cmdk-input-wrapper]]:h-full [&_[cmdk-input-wrapper]]:px-3 [&_[cmdk-input-wrapper]_svg]:text-gray-500", children: /* @__PURE__ */ i(ae, { value: F, onValueChange: M, placeholder: "Search country..." }) }), e[23] = F, e[24] = v) : v = e[24];
+  let U, d;
+  e[25] === Symbol.for("react.memo_cache_sentinel") ? (U = {
     msOverflowStyle: "none"
-  }, G = /* @__PURE__ */ c(Le, { children: "No country found." }), e[25] = A, e[26] = G) : (A = e[25], G = e[26]);
-  let O;
-  if (e[27] !== n || e[28] !== l || e[29] !== o || e[30] !== s) {
-    let F;
-    e[32] !== l || e[33] !== o || e[34] !== s ? (F = (L) => {
+  }, d = /* @__PURE__ */ i(de, { children: "No country found." }), e[25] = U, e[26] = d) : (U = e[25], d = e[26]);
+  let S;
+  if (e[27] !== c || e[28] !== n || e[29] !== o || e[30] !== a) {
+    let _;
+    e[32] !== n || e[33] !== o || e[34] !== a ? (_ = (X) => {
       const {
-        value: i,
-        label: M,
-        countryCode: X
-      } = L;
-      return i ? /* @__PURE__ */ c(We, { country: i, countryName: M, countryCode: X, selectedCountry: o, onChange: l, onSelectComplete: () => m(!1), showFlagVariant: s }, typeof i == "object" && "countryId" in i ? i.countryId : i) : null;
-    }, e[32] = l, e[33] = o, e[34] = s, e[35] = F) : F = e[35], O = n.map(F), e[27] = n, e[28] = l, e[29] = o, e[30] = s, e[31] = O;
+        value: T,
+        label: l,
+        countryCode: s
+      } = X;
+      return T ? /* @__PURE__ */ i(Ne, { country: T, countryName: l, countryCode: s, selectedCountry: o, onChange: n, onSelectComplete: () => b(!1), showFlagVariant: a }, typeof T == "object" && "countryId" in T ? T.countryId : T) : null;
+    }, e[32] = n, e[33] = o, e[34] = a, e[35] = _) : _ = e[35], S = c.map(_), e[27] = c, e[28] = n, e[29] = o, e[30] = a, e[31] = S;
   } else
-    O = e[31];
-  let P;
-  e[36] !== O ? (P = /* @__PURE__ */ c(Ve, { children: /* @__PURE__ */ T("div", { ref: C, className: "max-h-[min(288px,calc(100vh-12rem))] overflow-y-auto -mx-1 px-1 [&::-webkit-scrollbar]:hidden [scrollbar-width:none]", style: A, children: [
-    G,
-    /* @__PURE__ */ c(ze, { children: O })
-  ] }) }), e[36] = O, e[37] = P) : P = e[37];
+    S = e[31];
   let E;
-  e[38] !== _ || e[39] !== P ? (E = /* @__PURE__ */ T(Ge, { children: [
-    _,
-    P
-  ] }), e[38] = _, e[39] = P, e[40] = E) : E = e[40];
-  let u;
-  e[41] !== f || e[42] !== E ? (u = /* @__PURE__ */ c(He, { anchor: f, side: "bottom", sideOffset: 6, collisionAvoidance: q, className: "w-[min(var(--anchor-width),calc(100vw-1rem))] max-w-[var(--available-width)] min-w-0 p-1 shadow-md border border-gray-300 rounded-md", align: "start", children: E }), e[41] = f, e[42] = E, e[43] = u) : u = e[43];
-  let B;
-  return e[44] !== h || e[45] !== S || e[46] !== u ? (B = /* @__PURE__ */ T(Je, { open: h, modal: !0, onOpenChange: a, children: [
-    S,
-    u
-  ] }), e[44] = h, e[45] = S, e[46] = u, e[47] = B) : B = e[47], B;
-}, We = (r) => {
-  const e = he(21), {
+  e[36] !== S ? (E = /* @__PURE__ */ i(me, { children: /* @__PURE__ */ j("div", { ref: w, className: "max-h-[min(288px,calc(100vh-12rem))] overflow-y-auto -mx-1 px-1 [&::-webkit-scrollbar]:hidden [scrollbar-width:none]", style: U, children: [
+    d,
+    /* @__PURE__ */ i(fe, { children: S })
+  ] }) }), e[36] = S, e[37] = E) : E = e[37];
+  let y;
+  e[38] !== v || e[39] !== E ? (y = /* @__PURE__ */ j(ue, { children: [
+    v,
+    E
+  ] }), e[38] = v, e[39] = E, e[40] = y) : y = e[40];
+  let C;
+  e[41] !== u || e[42] !== y ? (C = /* @__PURE__ */ i(ge, { anchor: u, side: "bottom", sideOffset: 6, collisionAvoidance: L, className: "w-[min(var(--anchor-width),calc(100vw-1rem))] max-w-[var(--available-width)] min-w-0 p-1 shadow-md border border-gray-300 rounded-md", align: "start", children: y }), e[41] = u, e[42] = y, e[43] = C) : C = e[43];
+  let z;
+  return e[44] !== N || e[45] !== A || e[46] !== C ? (z = /* @__PURE__ */ j(xe, { open: N, modal: !0, onOpenChange: g, children: [
+    A,
+    C
+  ] }), e[44] = N, e[45] = A, e[46] = C, e[47] = z) : z = e[47], z;
+}, Ne = (r) => {
+  const e = Z(21), {
     country: t,
     countryName: o,
-    countryCode: n,
-    selectedCountry: l,
-    onChange: s,
-    onSelectComplete: x,
-    showFlagVariant: f
+    countryCode: c,
+    selectedCountry: n,
+    onChange: a,
+    onSelectComplete: I,
+    showFlagVariant: u
   } = r;
-  let C;
-  e[0] !== t || e[1] !== s || e[2] !== x ? (C = () => {
-    s(t), x();
-  }, e[0] = t, e[1] = s, e[2] = x, e[3] = C) : C = e[3];
-  const $ = C;
   let w;
+  e[0] !== t || e[1] !== a || e[2] !== I ? (w = () => {
+    a(t), I();
+  }, e[0] = t, e[1] = a, e[2] = I, e[3] = w) : w = e[3];
+  const F = w;
+  let p;
   e: {
-    if (!l) {
-      w = !1;
+    if (!n) {
+      p = !1;
       break e;
     }
-    if (typeof t == "object" && "countryId" in t && typeof l == "object" && "countryId" in l) {
-      w = t.countryId === l.countryId;
+    if (typeof t == "object" && "countryId" in t && typeof n == "object" && "countryId" in n) {
+      p = t.countryId === n.countryId;
       break e;
     }
-    w = t === l;
+    p = t === n;
   }
-  const h = w, m = typeof t == "object" && "countryId" in t ? `${t.countryName} ${t.countryCode}` : `${o} ${n}`;
-  let y;
-  e[4] === Symbol.for("react.memo_cache_sentinel") ? (y = ee("flex items-center gap-3 px-3 py-2.5 text-sm cursor-pointer transition-colors", "data-[selected=true]:bg-[#F5F5F5] data-[selected=true]:text-gray-900", "hover:bg-[#F5F5F5]"), e[4] = y) : y = e[4];
-  let d;
-  e[5] !== t || e[6] !== o || e[7] !== f ? (d = f && typeof t == "string" && /* @__PURE__ */ c("span", { className: "flex items-center", children: /* @__PURE__ */ c(Ee, { country: t, countryName: o }) }), e[5] = t, e[6] = o, e[7] = f, e[8] = d) : d = e[8];
-  let a;
-  e[9] !== n || e[10] !== o || e[11] !== f ? (a = f ? /* @__PURE__ */ T($e, { children: [
-    /* @__PURE__ */ c("span", { className: "flex-1 text-sm font-normal text-gray-700", children: o }),
-    /* @__PURE__ */ c(Se, { variant: "body2", weight: "regular", className: "text-gray-900 min-w-[50px] text-right", children: n })
-  ] }) : /* @__PURE__ */ T($e, { children: [
-    /* @__PURE__ */ c(Se, { variant: "body2", weight: "regular", className: "text-gray-900 min-w-[50px]", children: n }),
-    /* @__PURE__ */ c("span", { className: "flex-1 text-sm font-normal text-gray-700", children: o })
-  ] }), e[9] = n, e[10] = o, e[11] = f, e[12] = a) : a = e[12];
+  const N = p, b = typeof t == "object" && "countryId" in t ? `${t.countryName} ${t.countryCode}` : `${o} ${c}`;
+  let f;
+  e[4] === Symbol.for("react.memo_cache_sentinel") ? (f = H("flex items-center gap-3 px-3 py-2.5 text-sm cursor-pointer transition-colors", "data-[selected=true]:bg-[#F5F5F5] data-[selected=true]:text-gray-900", "hover:bg-[#F5F5F5]"), e[4] = f) : f = e[4];
+  let m;
+  e[5] !== t || e[6] !== o || e[7] !== u ? (m = u && typeof t == "string" && /* @__PURE__ */ i("span", { className: "flex items-center", children: /* @__PURE__ */ i(ne, { country: t, countryName: o }) }), e[5] = t, e[6] = o, e[7] = u, e[8] = m) : m = e[8];
   let g;
-  e[13] !== h ? (g = h && /* @__PURE__ */ c(Te, { className: "ml-auto h-4 w-4 text-gray-900 shrink-0" }), e[13] = h, e[14] = g) : g = e[14];
-  let v;
-  return e[15] !== $ || e[16] !== m || e[17] !== d || e[18] !== a || e[19] !== g ? (v = /* @__PURE__ */ T(Ue, { value: m, className: y, onSelect: $, children: [
-    d,
-    a,
-    g
-  ] }), e[15] = $, e[16] = m, e[17] = d, e[18] = a, e[19] = g, e[20] = v) : v = e[20], v;
-}, Ye = ke.getCountries(), Ze = (r) => {
+  e[9] !== c || e[10] !== o || e[11] !== u ? (g = u ? /* @__PURE__ */ j(V, { children: [
+    /* @__PURE__ */ i("span", { className: "flex-1 text-sm font-normal text-gray-700", children: o }),
+    /* @__PURE__ */ i(W, { variant: "body2", weight: "regular", className: "text-gray-900 min-w-[50px] text-right", children: c })
+  ] }) : /* @__PURE__ */ j(V, { children: [
+    /* @__PURE__ */ i(W, { variant: "body2", weight: "regular", className: "text-gray-900 min-w-[50px]", children: c }),
+    /* @__PURE__ */ i("span", { className: "flex-1 text-sm font-normal text-gray-700", children: o })
+  ] }), e[9] = c, e[10] = o, e[11] = u, e[12] = g) : g = e[12];
+  let x;
+  e[13] !== N ? (x = N && /* @__PURE__ */ i(ie, { className: "ml-auto h-4 w-4 text-gray-900 shrink-0" }), e[13] = N, e[14] = x) : x = e[14];
+  let $;
+  return e[15] !== F || e[16] !== b || e[17] !== m || e[18] !== g || e[19] !== x ? ($ = /* @__PURE__ */ j(pe, { value: b, className: f, onSelect: F, children: [
+    m,
+    g,
+    x
+  ] }), e[15] = F, e[16] = b, e[17] = m, e[18] = g, e[19] = x, e[20] = $) : $ = e[20], $;
+}, Ie = oe.getCountries(), Se = (r) => {
   if (!r || r.length === 0)
-    return Ye.map((t) => ({
+    return Ie.map((t) => ({
       value: t,
       label: new Intl.DisplayNames(["en"], {
         type: "region"
       }).of(t) ?? t,
-      countryCode: `+${U(t)}`
+      countryCode: `+${B(t)}`
     }));
   const e = r[0];
   return e && typeof e == "object" && "countryId" in e ? r.map((t) => ({
@@ -211,139 +211,88 @@ const Ke = /\D/g, te = (r) => r.replace(Ke, ""), _e = (r) => {
     label: new Intl.DisplayNames(["en"], {
       type: "region"
     }).of(t) ?? t,
-    countryCode: `+${U(t)}`
+    countryCode: `+${B(t)}`
   }));
 };
-function dt(r) {
-  const e = he(108);
-  let t, o, n, l, s, x, f, C, $, w, h, m, y, d, a, g, v, I, D, j;
-  e[0] !== r ? ({
-    label: w,
-    helperText: C,
-    error: f,
-    required: v,
-    className: o,
-    "aria-describedby": t,
-    id: $,
-    value: D,
-    onPhoneChange: y,
-    countryCode: l,
-    onCountryCodeChange: m,
-    onValuesChange: a,
-    onCountryChange: h,
-    onValueChange: d,
-    countries: n,
-    defaultCountry: s,
-    variant: j,
-    disabled: x,
-    placeholder: g,
-    ...I
-  } = r, e[0] = r, e[1] = t, e[2] = o, e[3] = n, e[4] = l, e[5] = s, e[6] = x, e[7] = f, e[8] = C, e[9] = $, e[10] = w, e[11] = h, e[12] = m, e[13] = y, e[14] = d, e[15] = a, e[16] = g, e[17] = v, e[18] = I, e[19] = D, e[20] = j) : (t = e[1], o = e[2], n = e[3], l = e[4], s = e[5], x = e[6], f = e[7], C = e[8], $ = e[9], w = e[10], h = e[11], m = e[12], y = e[13], d = e[14], a = e[15], g = e[16], v = e[17], I = e[18], D = e[19], j = e[20]);
-  const b = D === void 0 ? "" : D, V = j === void 0 ? "default" : j, z = R.useId(), S = R.useId(), q = R.useRef(null), k = $ ?? z, _ = !!(C || f);
-  let A;
-  e[21] !== t || e[22] !== _ || e[23] !== S ? (A = [t, _ ? S : void 0].filter(Boolean).join(" ") || void 0, e[21] = t, e[22] = _, e[23] = S, e[24] = A) : A = e[24];
-  const G = A, O = !!f, P = V === "flag";
-  let E;
-  e[25] !== n ? (E = Ze(n), e[25] = n, e[26] = E) : E = e[26];
-  const u = E;
-  let B;
-  e[27] !== n || e[28] !== u || e[29] !== s || e[30] !== b ? (B = () => {
-    const p = _e(String(b ?? "").trim());
-    if (p) {
-      const N = Ie(u, p.callingCode, void 0);
-      if (N)
-        return N;
+function Pe({
+  label: r,
+  helperText: e,
+  error: t,
+  required: o,
+  className: c,
+  "aria-describedby": n,
+  id: a,
+  value: I = "",
+  onPhoneChange: u,
+  countryCode: w,
+  onCountryCodeChange: F,
+  onValuesChange: p,
+  onCountryChange: N,
+  onValueChange: b,
+  countries: f,
+  defaultCountry: m,
+  variant: g = "default",
+  disabled: x,
+  placeholder: $,
+  ...R
+}) {
+  const P = h.useId(), D = h.useId(), G = h.useRef(null), O = a ?? P, k = !!(e || t), A = [n, k ? D : void 0].filter(Boolean).join(" ") || void 0, L = !!t, M = g === "flag", v = h.useMemo(() => Se(f), [f]), U = () => {
+    const l = Y(String(I ?? "").trim());
+    if (l) {
+      const s = Q(v, l.callingCode, void 0);
+      if (s) return s;
     }
-    return je(s, n);
-  }, e[27] = n, e[28] = u, e[29] = s, e[30] = b, e[31] = B) : B = e[31];
-  const F = B;
-  let L;
-  e[32] !== F ? (L = () => F(), e[32] = F, e[33] = L) : L = e[33];
-  const [i, M] = R.useState(L);
-  let X, re;
-  e[34] !== n || e[35] !== s ? (X = () => {
-    if (s != null) {
-      const p = je(s, n);
-      p && M(p);
+    return te(m, f);
+  }, [d, S] = h.useState(() => U()), E = w !== void 0, y = h.useRef(F);
+  y.current = F;
+  const C = h.useRef(null);
+  h.useEffect(() => {
+    if (m != null) {
+      const l = te(m, f);
+      l && S((s) => s && K(l, s) ? s : l);
     }
-  }, re = [s, n], e[34] = n, e[35] = s, e[36] = X, e[37] = re) : (X = e[36], re = e[37]), R.useEffect(X, re);
-  const oe = l !== void 0;
-  let le, ne;
-  e[38] !== m || e[39] !== i ? (ne = () => {
-    if (!i)
-      return;
-    const p = U(i);
-    m == null || m(p);
-  }, le = [i, m], e[38] = m, e[39] = i, e[40] = le, e[41] = ne) : (le = e[40], ne = e[41]), R.useEffect(ne, le);
-  let se, ie;
-  e[42] !== l || e[43] !== u || e[44] !== oe || e[45] !== i ? (se = () => {
-    if (!oe)
-      return;
-    const p = te(String(l ?? ""));
-    if (p === "")
-      return;
-    const N = Ie(u, p, i);
-    N && !Fe(N, i) && M(N);
-  }, ie = [l, u, oe, i], e[42] = l, e[43] = u, e[44] = oe, e[45] = i, e[46] = se, e[47] = ie) : (se = e[46], ie = e[47]), R.useEffect(se, ie);
-  let ae, ce;
-  e[48] !== u || e[49] !== i || e[50] !== b ? (ae = () => {
-    const p = _e(String(b ?? "").trim());
-    if (!p)
-      return;
-    const N = Ie(u, p.callingCode, i);
-    N && !Fe(N, i) && M(N);
-  }, ce = [b, u, i], e[48] = u, e[49] = i, e[50] = b, e[51] = ae, e[52] = ce) : (ae = e[51], ce = e[52]), R.useEffect(ae, ce);
-  let de;
-  e[53] !== b ? (de = De(b), e[53] = b, e[54] = de) : de = e[54];
-  const fe = de;
-  let me;
-  e[55] !== fe || e[56] !== h || e[57] !== m || e[58] !== d || e[59] !== a ? (me = (p) => {
-    M(p);
-    const N = U(p);
-    m == null || m(N), h == null || h(p), a == null || a([N, fe]), d == null || d(Oe(fe, p));
-  }, e[55] = fe, e[56] = h, e[57] = m, e[58] = d, e[59] = a, e[60] = me) : me = e[60];
-  const ge = me;
-  let ue;
-  e[61] !== l || e[62] !== y || e[63] !== d || e[64] !== a || e[65] !== i ? (ue = (p) => {
-    const N = p.target.value, Ne = te(N);
-    y == null || y(Ne);
-    const Re = l ?? U(i);
-    a == null || a([Re, Ne]), d == null || d(Oe(Ne, i));
-  }, e[61] = l, e[62] = y, e[63] = d, e[64] = a, e[65] = i, e[66] = ue) : ue = e[66];
-  const be = ue;
-  let pe;
-  e[67] !== b ? (pe = De(b), e[67] = b, e[68] = pe) : pe = e[68];
-  const ve = pe;
-  let H;
-  e[69] !== o ? (H = ee("space-y-1", o), e[69] = o, e[70] = H) : H = e[70];
-  let J;
-  e[71] !== w || e[72] !== v || e[73] !== k ? (J = w && /* @__PURE__ */ T(Me, { htmlFor: k, className: "text-sm font-medium text-foreground", children: [
-    w,
-    v && /* @__PURE__ */ c("span", { className: "ml-1 text-destructive", "aria-hidden": "true", children: "*" })
-  ] }), e[71] = w, e[72] = v, e[73] = k, e[74] = J) : J = e[74];
-  let K;
-  e[75] !== u || e[76] !== x || e[77] !== ge || e[78] !== O || e[79] !== i || e[80] !== P ? (K = /* @__PURE__ */ c(Qe, { disabled: x, value: i, options: u, onChange: ge, showFlagVariant: P, hasError: O, popoverAnchorRef: q }), e[75] = u, e[76] = x, e[77] = ge, e[78] = O, e[79] = i, e[80] = P, e[81] = K) : K = e[81];
-  const xe = v || void 0, Ce = O || void 0, we = O ? "border-destructive" : "border-gray-300";
-  let Q;
-  e[82] !== we ? (Q = ee("h-[40px] rounded-r-md rounded-l-none border-t-[1px] border-b-[1px] border-l-[1px] bg-white px-3 py-[1px] text-sm", we), e[82] = we, e[83] = Q) : Q = e[83];
-  let W;
-  e[84] !== G || e[85] !== x || e[86] !== be || e[87] !== ve || e[88] !== g || e[89] !== k || e[90] !== I || e[91] !== xe || e[92] !== Ce || e[93] !== Q ? (W = /* @__PURE__ */ c(qe, { ...I, ref: void 0, id: k, type: "text", inputMode: "numeric", value: ve, onChange: be, disabled: x, placeholder: g, "aria-required": xe, "aria-invalid": Ce, "aria-describedby": G, className: Q }), e[84] = G, e[85] = x, e[86] = be, e[87] = ve, e[88] = g, e[89] = k, e[90] = I, e[91] = xe, e[92] = Ce, e[93] = Q, e[94] = W) : W = e[94];
-  let Y;
-  e[95] !== K || e[96] !== W ? (Y = /* @__PURE__ */ T("div", { ref: q, className: "flex w-full min-w-0 items-center", children: [
-    K,
-    W
-  ] }), e[95] = K, e[96] = W, e[97] = Y) : Y = e[97];
-  let Z;
-  e[98] !== f || e[99] !== _ || e[100] !== S || e[101] !== C ? (Z = _ && /* @__PURE__ */ c("p", { id: S, className: ee("text-xs", f ? "text-destructive" : "text-muted-foreground"), role: f ? "alert" : void 0, children: f || C }), e[98] = f, e[99] = _, e[100] = S, e[101] = C, e[102] = Z) : Z = e[102];
-  let ye;
-  return e[103] !== H || e[104] !== J || e[105] !== Y || e[106] !== Z ? (ye = /* @__PURE__ */ T("div", { className: H, children: [
-    J,
-    Y,
-    Z
-  ] }), e[103] = H, e[104] = J, e[105] = Y, e[106] = Z, e[107] = ye) : ye = e[107], ye;
+  }, [m, f]), h.useEffect(() => {
+    var s;
+    if (!d) return;
+    const l = B(d);
+    C.current !== l && (C.current = l, (s = y.current) == null || s.call(y, l));
+  }, [d]), h.useEffect(() => {
+    if (!E) return;
+    const l = J(String(w ?? ""));
+    if (l === "") return;
+    const s = Q(v, l, d);
+    s && !K(s, d) && S(s);
+  }, [w, v, E, d]), h.useEffect(() => {
+    const l = Y(String(I ?? "").trim());
+    if (!l) return;
+    const s = Q(v, l.callingCode, d);
+    s && !K(s, d) && S(s);
+  }, [I, v, d]);
+  const z = ee(I), _ = (l) => {
+    var q;
+    S(l);
+    const s = B(l);
+    C.current = s, (q = y.current) == null || q.call(y, s), N == null || N(l), p == null || p([s, z]), b == null || b(re(z, l));
+  }, X = (l) => {
+    const s = l.target.value, q = J(s);
+    u == null || u(q);
+    const le = w ?? B(d);
+    p == null || p([le, q]), b == null || b(re(q, d));
+  }, T = ee(I);
+  return /* @__PURE__ */ j("div", { className: H("space-y-1", c), children: [
+    r && /* @__PURE__ */ j(he, { htmlFor: O, className: "text-sm font-medium text-foreground", children: [
+      r,
+      o && /* @__PURE__ */ i("span", { className: "ml-1 text-destructive", "aria-hidden": "true", children: "*" })
+    ] }),
+    /* @__PURE__ */ j("div", { ref: G, className: "flex w-full min-w-0 items-center", children: [
+      /* @__PURE__ */ i(we, { disabled: x, value: d, options: v, onChange: _, showFlagVariant: M, hasError: L, popoverAnchorRef: G }),
+      /* @__PURE__ */ i(ye, { ...R, ref: void 0, id: O, type: "text", inputMode: "numeric", value: T, onChange: X, disabled: x, placeholder: $, "aria-required": o || void 0, "aria-invalid": L || void 0, "aria-describedby": A, className: H("h-[40px] rounded-r-md rounded-l-none border-t-[1px] border-b-[1px] border-l-[1px] bg-white px-3 py-[1px] text-sm", L ? "border-destructive" : "border-gray-300") })
+    ] }),
+    k && /* @__PURE__ */ i("p", { id: D, className: H("text-xs", t ? "text-destructive" : "text-muted-foreground"), role: t ? "alert" : void 0, children: t || e })
+  ] });
 }
 export {
-  dt as DoctPhoneInput,
-  ut as isPossiblePhoneNumber,
-  pt as isValidPhoneNumber
+  Pe as DoctPhoneInput,
+  Te as isPossiblePhoneNumber,
+  Be as isValidPhoneNumber
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docthub-core-components",
-  "version": "3.3.10",
+  "version": "3.3.11",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",