maz-ui 3.47.2-beta.13 → 3.47.2-beta.15

package/components/chunks/{MazPhoneNumberInput-B5Up8CqL.mjs → MazPhoneNumberInput-Brc7mthM.mjs}

@@ -1,20 +1,19 @@
-import '../assets/MazPhoneNumberInput.css';var Ge = Object.defineProperty;
-var Je = (a, o, e) => o in a ? Ge(a, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[o] = e;
-var _ = (a, o, e) => Je(a, typeof o != "symbol" ? o + "" : o, e);
-import { useId as Ze, computed as h, inject as Xe, defineComponent as ne, defineAsyncComponent as q, withDirectives as ze, openBlock as y, createElementBlock as P, normalizeClass as M, normalizeStyle as ee, Fragment as be, renderList as Be, createElementVNode as j, mergeProps as te, createVNode as H, unref as k, createCommentVNode as E, renderSlot as N, ref as L, onMounted as Ie, useSlots as xe, toDisplayString as oe, createBlock as U, resolveDynamicComponent as ke, toHandlers as _e, vModelDynamic as eo, createTextVNode as oo, withModifiers as se, withCtx as G, onBeforeMount as to, nextTick as ue, Transition as lo, mergeModels as Pe, useModel as ao, provide as so, watch as he } from "vue";
-import { getCountries as Oe, getCountryCallingCode as ce, isSupportedCountry as no, parsePhoneNumberFromString as ro, AsYouType as io, getExampleNumber as uo } from "libphonenumber-js";
+import '../assets/MazPhoneNumberInput.css';var Je = Object.defineProperty;
+var Ze = (a, o, e) => o in a ? Je(a, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[o] = e;
+var _ = (a, o, e) => Ze(a, typeof o != "symbol" ? o + "" : o, e);
+import { computed as h, useId as Xe, inject as xe, defineComponent as ne, defineAsyncComponent as q, withDirectives as ze, openBlock as y, createElementBlock as P, normalizeClass as M, normalizeStyle as ee, Fragment as be, renderList as Be, createElementVNode as Y, mergeProps as te, createVNode as H, unref as k, createCommentVNode as E, renderSlot as N, ref as L, onMounted as Ie, useSlots as _e, toDisplayString as oe, createBlock as U, resolveDynamicComponent as ke, toHandlers as eo, vModelDynamic as oo, createTextVNode as to, withModifiers as se, withCtx as G, onBeforeMount as Oe, nextTick as ue, Transition as lo, mergeModels as Pe, useModel as ao, provide as so, watch as he } from "vue";
+import { getCountries as Me, getCountryCallingCode as ce, isSupportedCountry as no, parsePhoneNumberFromString as ro, getExampleNumber as io, AsYouType as uo } from "libphonenumber-js";
 function Ae({
   componentName: a,
   providedId: o
 }) {
-  const e = Ze();
-  return h(() => o ?? `${a}-${e}`);
+  return h(() => o ?? `${a}-${Xe().replace(/:/g, "")}`);
 }
 function Le(a, o = "20x15") {
   return `https://flagcdn.com/${o}/${a.toLowerCase()}.png`;
 }
-function Me(a, o) {
-  const e = Xe(a, o);
+function Te(a, o) {
+  const e = xe(a, o);
   if (!e)
     throw new TypeError(`[maz-ui](injectStrict) Could not resolve ${a.toString()}`);
   return e;
@@ -225,7 +224,7 @@ const ho = {
   },
   emits: ["intersecting", "loading", "loaded", "error"],
   setup(a) {
-    const o = a, e = q(() => import("./MazSpinner-NCtEpFMm.mjs")), t = h(() => o.image || o.src), r = h(() => {
+    const o = a, e = q(() => import("./MazSpinner-4ja9Gafa.mjs")), t = h(() => o.image || o.src), r = h(() => {
       var u;
       return typeof t.value == "string" ? [{ srcset: t.value }] : (u = t.value) == null ? void 0 : u.sources;
     });
@@ -247,7 +246,7 @@ const ho = {
           128
           /* KEYED_FRAGMENT */
         )),
-        j("img", te(u.$attrs, {
+        Y("img", te(u.$attrs, {
           src: "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",
           loading: "lazy",
           alt: u.alt,
@@ -362,19 +361,19 @@ function zo(a, o) {
     }
   return r[e][t];
 }
-function Te(a, o) {
+function Fe(a, o) {
   const e = zo(a, o), t = Math.max(a.length, o.length);
   return 1 - e / t;
 }
 function Io(a, o, e = 0.75) {
-  return Te(a, o) >= e;
+  return Fe(a, o) >= e;
 }
 function ve(a, o, e = 0.75) {
   const t = h(
     () => me(typeof a == "string" ? a : a.value)
   ), r = h(
     () => me(typeof o == "string" ? o : o.value)
-  ), u = h(() => typeof e == "number" ? e : e.value), v = h(() => Te(t.value, r.value));
+  ), u = h(() => typeof e == "number" ? e : e.value), v = h(() => Fe(t.value, r.value));
   return {
     isMatching: h(
       () => Io(t.value, r.value, u.value)
@@ -382,7 +381,7 @@ function ve(a, o, e = 0.75) {
     score: v
   };
 }
-function Fe(a, o, e) {
+function Ne(a, o, e) {
   var v;
   a.stopPropagation();
   const t = typeof e.value == "function" ? e.value : e.value.handler, r = typeof e.value == "object" ? e.value.exclude : void 0;
@@ -396,20 +395,20 @@ function Fe(a, o, e) {
   }
   !o.contains(a.target) && !u && (t == null || t());
 }
-function Ne() {
+function Ke() {
   return document.ontouchstart === null ? "touchstart" : "click";
 }
 function Ao(a, o) {
-  const e = Ne();
-  document.removeEventListener(e, (t) => Fe(t, a, o));
+  const e = Ke();
+  document.removeEventListener(e, (t) => Ne(t, a, o));
 }
 function wo(a, o) {
   if (typeof o.value != "function" && typeof o.value == "object" && typeof o.value.handler != "function") {
     console.error("[maz-ui](vClosable) v-closable directive requires a handler function");
     return;
   }
-  const e = Ne();
-  document.addEventListener(e, (t) => Fe(t, a, o));
+  const e = Ke();
+  document.addEventListener(e, (t) => Ne(t, a, o));
 }
 const So = {
   mounted: wo,
@@ -473,13 +472,13 @@ const Po = ["for"], Lo = {
   },
   emits: ["update:model-value", "focus", "blur", "click", "change", "input"],
   setup(a, { emit: o }) {
-    const e = a, t = o, r = q(() => import("./MazBtn-CB6xVwox.mjs")), u = q(() => import("./MazIcon-DFW4cVVf.mjs")), v = q(() => import("./eye-slash-BoO00xzs.mjs")), p = q(() => import("./eye-f8zAUc30.mjs")), O = q(() => import("./check-C9Q_W85g.mjs")), $ = L(!1), g = L(!1), V = L(), i = Ae({
+    const e = a, t = o, r = q(() => import("./MazBtn-LssGZPPh.mjs")), u = q(() => import("./MazIcon-Y4qVlKF1.mjs")), v = q(() => import("./eye-slash-BoO00xzs.mjs")), p = q(() => import("./eye-f8zAUc30.mjs")), O = q(() => import("./check-C9Q_W85g.mjs")), $ = L(!1), g = L(!1), A = L(), i = Ae({
       componentName: "MazInput",
       providedId: e.id
     });
     Ie(() => {
       var s;
-      e.autoFocus && ((s = V.value) == null || s.focus());
+      e.autoFocus && ((s = A.value) == null || s.focus());
     });
     const f = h(() => e.type === "password"), z = h(() => $.value ? "text" : e.type), w = h(() => {
       if (!e.noBorder) {
@@ -509,10 +508,10 @@ const Po = ["for"], Lo = {
         }
         return "--default-border";
       }
-    }), D = xe(), Y = h(() => {
-      const { required: s, placeholder: T } = e;
-      if (T)
-        return s ? `${T} *` : T;
+    }), D = _e(), j = h(() => {
+      const { required: s, placeholder: F } = e;
+      if (F)
+        return s ? `${F} *` : F;
     }), J = h(() => C.value !== void 0 && C.value !== ""), b = Vo(
       (s) => {
         t("update:model-value", s);
@@ -531,13 +530,13 @@ const Po = ["for"], Lo = {
     function n() {
       return !!D["right-icon"] || f.value || !!D["valid-button"] || e.validButton || !!e.rightIcon;
     }
-    function A() {
+    function V() {
       return !!D["left-icon"] || !!e.leftIcon;
     }
     function K(s) {
       t("focus", s), g.value = !0;
     }
-    function F(s) {
+    function T(s) {
       t("blur", s), g.value = !1;
     }
     function le(s) {
@@ -546,7 +545,7 @@ const Po = ["for"], Lo = {
     function X(s) {
       return t("input", s);
     }
-    return (s, T) => (y(), P(
+    return (s, F) => (y(), P(
       "div",
       {
         class: M(["m-input", [
@@ -571,7 +570,7 @@ const Po = ["for"], Lo = {
           for: k(i),
           class: "m-input-top-label"
         }, oe(s.topLabel), 9, Po)) : E("v-if", !0),
-        j(
+        Y(
           "div",
           {
             class: M(["m-input-wrapper", [
@@ -582,7 +581,7 @@ const Po = ["for"], Lo = {
             ]])
           },
           [
-            A() ? (y(), P("div", Lo, [
+            V() ? (y(), P("div", Lo, [
               s.$slots["left-icon"] || s.leftIcon ? N(s.$slots, "left-icon", { key: 0 }, () => [
                 typeof s.leftIcon == "string" ? (y(), U(k(u), {
                   key: 0,
@@ -594,36 +593,36 @@ const Po = ["for"], Lo = {
                 })) : E("v-if", !0)
               ], !0) : E("v-if", !0)
             ])) : E("v-if", !0),
-            j(
+            Y(
               "div",
               {
                 class: M(["m-input-wrapper-input", [`--${s.size}`, { "--top-label": !!s.topLabel }]])
               },
               [
-                ze(j("input", te({
+                ze(Y("input", te({
                   id: k(i),
                   ref_key: "input",
-                  ref: V,
-                  "onUpdate:modelValue": T[0] || (T[0] = (x) => C.value = x),
+                  ref: A,
+                  "onUpdate:modelValue": F[0] || (F[0] = (x) => C.value = x),
                   type: z.value,
                   name: s.name
                 }, s.$attrs, {
                   inputmode: s.inputmode,
-                  placeholder: Y.value,
+                  placeholder: j.value,
                   "aria-label": s.label || s.placeholder,
                   disabled: s.disabled,
                   readonly: s.readonly,
                   required: s.required,
                   class: "m-input-input"
-                }, _e({
-                  blur: F,
+                }, eo({
+                  blur: T,
                   focus: K,
                   change: le,
                   input: X
                 }, !0), {
-                  onClick: T[1] || (T[1] = (x) => s.$emit("click", x))
+                  onClick: F[1] || (F[1] = (x) => s.$emit("click", x))
                 }), null, 16, Eo), [
-                  [eo, C.value]
+                  [oo, C.value]
                 ]),
                 s.label || s.hint ? (y(), P(
                   "span",
@@ -638,7 +637,7 @@ const Po = ["for"], Lo = {
                     ]])
                   },
                   [
-                    oo(
+                    to(
                       oe(s.hint || s.label) + " ",
                       1
                       /* TEXT */
@@ -668,7 +667,7 @@ const Po = ["for"], Lo = {
                 color: "transparent",
                 tabindex: "-1",
                 size: "mini",
-                onClick: T[2] || (T[2] = se((x) => $.value = !$.value, ["stop"]))
+                onClick: F[2] || (F[2] = se((x) => $.value = !$.value, ["stop"]))
               }, {
                 default: G(() => [
                   $.value ? (y(), U(k(v), {
@@ -763,26 +762,26 @@ const Po = ["for"], Lo = {
   },
   emits: ["close", "open", "blur", "focus", "change", "input", "update:model-value", "selected-option"],
   setup(a, { expose: o, emit: e }) {
-    const t = a, r = e, u = q(() => import("./MazCheckbox-B-Sw22La.mjs")), v = q(() => import("./magnifying-glass--nBiyXot.mjs")), p = q(() => import("./chevron-down-BkvtON3b.mjs")), O = q(() => import("./no-symbol-CIgKzsrB.mjs"));
+    const t = a, r = e, u = q(() => import("./MazCheckbox-D2fkthdh.mjs")), v = q(() => import("./magnifying-glass--nBiyXot.mjs")), p = q(() => import("./chevron-down-BkvtON3b.mjs")), O = q(() => import("./no-symbol-CIgKzsrB.mjs"));
     o({
       /** Method to open the option list */
       openList: ie,
       /** Method to close the option list */
       closeList: ae
     });
-    const $ = L(!1), g = L(), V = h(
+    const $ = L(!1), g = L(), A = h(
       () => ["black", "transparent", "white"].includes(t.color)
     ), i = h(
-      () => V.value ? "var(--maz-color-black)" : `var(--maz-color-${t.color}-800)`
+      () => A.value ? "var(--maz-color-black)" : `var(--maz-color-${t.color}-800)`
     ), f = h(
-      () => V.value ? "var(--maz-color-muted)" : `var(--maz-color-${t.color}-100)`
+      () => A.value ? "var(--maz-color-muted)" : `var(--maz-color-${t.color}-100)`
     ), z = h(
-      () => V.value ? "var(--maz-color-muted)" : `var(--maz-color-${t.color}-200)`
+      () => A.value ? "var(--maz-color-muted)" : `var(--maz-color-${t.color}-200)`
     ), w = h(() => $.value || t.open), D = Ae({
       componentName: "MazSelect",
       providedId: t.id
     });
-    function Y(l) {
+    function j(l) {
       return {
         [t.optionValueKey]: l,
         [t.optionLabelKey]: l,
@@ -803,34 +802,34 @@ const Po = ["for"], Lo = {
       if (!((d = t.options) != null && d.length))
         return [];
       for (const m of t.options)
-        typeof m == "string" || typeof m == "number" || typeof m == "boolean" ? l.push(Y(m)) : typeof m == "object" && "options" in m && Array.isArray(m.options) ? l.push(
+        typeof m == "string" || typeof m == "number" || typeof m == "boolean" ? l.push(j(m)) : typeof m == "object" && "options" in m && Array.isArray(m.options) ? l.push(
           { label: m.label, isOptGroup: !0 },
           ...m.options.map(
-            (c) => typeof c == "string" || typeof c == "number" || typeof c == "boolean" ? Y(c) : J(c)
+            (c) => typeof c == "string" || typeof c == "number" || typeof c == "boolean" ? j(c) : J(c)
           )
         ) : l.push(J(m));
       return l;
     }), S = h(
       () => {
         var l;
-        return ((l = b.value) == null ? void 0 : l.filter((d) => t.multiple ? Array.isArray(t.modelValue) ? t.modelValue.includes(d[t.optionValueKey]) && !A(d[t.optionValueKey]) : !1 : t.modelValue === d[t.optionValueKey] && !A(d[t.optionValueKey]))) ?? [];
+        return ((l = b.value) == null ? void 0 : l.filter((d) => t.multiple ? Array.isArray(t.modelValue) ? t.modelValue.includes(d[t.optionValueKey]) && !V(d[t.optionValueKey]) : !1 : t.modelValue === d[t.optionValueKey] && !V(d[t.optionValueKey]))) ?? [];
       }
     );
-    to(() => {
+    Oe(() => {
       var l;
       (l = t.options) != null && l.length || console.warn("[maz-ui](MazSelect) you must provide options"), fe();
     });
     const C = L(), W = L(), Z = L(), n = L();
-    function A(l) {
+    function V(l) {
       return l == null;
     }
     function K(l) {
       var m;
       return (((m = S.value) == null ? void 0 : m.some(
         (c) => c[t.optionValueKey] === l[t.optionValueKey]
-      )) ?? !1) && !A(l[t.optionValueKey]);
+      )) ?? !1) && !V(l[t.optionValueKey]);
     }
-    const F = h(() => {
+    const T = h(() => {
       var d;
       if (t.multiple && t.modelValue && Array.isArray(t.modelValue))
         return t.modelValue.map(
@@ -842,18 +841,18 @@ const Po = ["for"], Lo = {
       const l = (d = b.value) == null ? void 0 : d.find(
         (m) => m[t.optionValueKey] === t.modelValue
       );
-      return A(t.modelValue) || l == null ? void 0 : l[t.optionInputValueKey];
+      return V(t.modelValue) || l == null ? void 0 : l[t.optionInputValueKey];
     }), le = h(
       () => t.listPosition.includes("bottom") ? "maz-slide" : "maz-slideinvert"
     ), X = L(""), s = L("");
-    function T(l, d) {
+    function F(l, d) {
       return d && l && me(l).includes(me(d));
     }
     function x(l) {
       var d;
       return l ? (d = b.value) == null ? void 0 : d.filter((m) => {
         const c = m[t.optionLabelKey], I = m[t.optionValueKey], B = m[t.optionInputValueKey], R = t.searchThreshold;
-        return T(c, l) || T(B, l) || T(I, l) || typeof c == "string" && ve(c, l, R).isMatching.value || typeof B == "string" && ve(B, l, R).isMatching.value || typeof I == "string" && ve(I, l, R).isMatching.value;
+        return F(c, l) || F(B, l) || F(I, l) || typeof c == "string" && ve(c, l, R).isMatching.value || typeof B == "string" && ve(B, l, R).isMatching.value || typeof I == "string" && ve(I, l, R).isMatching.value;
       }) : b.value;
     }
     const Q = h(() => x(X.value));
@@ -875,14 +874,14 @@ const Po = ["for"], Lo = {
       var l, d;
       (d = ((l = W.value) == null ? void 0 : l.$el).querySelector("input")) == null || d.focus();
     }
-    function De() {
+    function Re() {
       var l, d;
       (d = ((l = W.value) == null ? void 0 : l.$el).querySelector("input")) == null || d.dispatchEvent(new Event("input"));
     }
-    function Re(l) {
+    function qe(l) {
       $.value ? ae(l) : we();
     }
-    function qe(l) {
+    function Ye(l) {
       var d, m;
       X.value = l, (m = ((d = Z.value) == null ? void 0 : d.$el).querySelector("input")) == null || m.focus();
     }
@@ -896,15 +895,15 @@ const Po = ["for"], Lo = {
         s.value = "";
       }, 1e3);
     }
-    function Ye(l) {
+    function We(l) {
       const d = l.key;
-      /^[\dA-Za-z\u0400-\u04FF]$/.test(d) ? (l.preventDefault(), ie(l), t.search ? qe(d) : je(d)) : Se(l);
+      /^[\dA-Za-z\u0400-\u04FF]$/.test(d) ? (l.preventDefault(), ie(l), t.search ? Ye(d) : je(d)) : Se(l);
     }
     function Se(l, d = !0) {
       const m = l.code, c = ["ArrowUp", "ArrowDown"].includes(m), I = (d ? ["Enter", "Space"] : ["Enter"]).includes(m), B = m === "Escape" && w.value;
-      c ? We(l, g.value) : I ? Qe(l, g.value) : B && ae(l);
+      c ? Qe(l, g.value) : I ? Ge(l, g.value) : B && ae(l);
     }
-    function We(l, d) {
+    function Qe(l, d) {
       var I;
       l.preventDefault();
       const m = l.code;
@@ -912,13 +911,13 @@ const Po = ["for"], Lo = {
       const c = (I = Q.value) == null ? void 0 : I.length;
       c && (typeof d == "number" ? d === c - 1 && m === "ArrowDown" ? g.value = 0 : d === 0 && m === "ArrowUp" ? g.value = c - 1 : g.value = m === "ArrowDown" ? d + 1 : d - 1 : g.value = m === "ArrowDown" ? 0 : c - 1, pe(g.value));
     }
-    function Qe(l, d) {
+    function Ge(l, d) {
       var c, I, B;
       if (!w.value)
         return;
       l.preventDefault();
       const m = d ? ((c = Q.value) == null ? void 0 : c[d]) ?? ((I = Q.value) == null ? void 0 : I[0]) : (B = Q.value) == null ? void 0 : B[0];
-      A(m) || Ve(m);
+      V(m) || Ve(m);
     }
     async function pe(l) {
       var m, c;
@@ -952,7 +951,7 @@ const Po = ["for"], Lo = {
         (R) => R[t.optionValueKey] !== l[t.optionValueKey]
       ) : t.multiple ? c.push(l) : c = [l];
       const I = c.map((R) => R[t.optionValueKey]);
-      r("update:model-value", t.multiple ? I : I[0]), r("selected-option", l), De(), fe(l), we();
+      r("update:model-value", t.multiple ? I : I[0]), r("selected-option", l), Re(), fe(l), we();
     }
     return (l, d) => {
       var m;
@@ -978,7 +977,7 @@ const Po = ["for"], Lo = {
             required: l.required,
             "border-active": $.value,
             color: l.color,
-            "model-value": F.value,
+            "model-value": T.value,
             size: l.size,
             block: "",
             autocomplete: l.autocomplete,
@@ -988,15 +987,15 @@ const Po = ["for"], Lo = {
             onClick: se(ie, ["prevent", "stop"]),
             onChange: d[0] || (d[0] = (c) => r("change", c)),
             onInput: d[1] || (d[1] = (c) => r("input", c)),
-            onKeydown: Ye
+            onKeydown: We
           }), {
             "right-icon": G(() => [
-              j("button", {
+              Y("button", {
                 tabindex: "-1",
                 type: "button",
                 class: "m-select-input__toggle-button maz-custom",
                 "aria-label": `${w.value ? "collapse" : "expand"} list of options`,
-                onClick: se(Re, ["stop"])
+                onClick: se(qe, ["stop"])
               }, [
                 H(k(p), { class: "m-select-chevron maz-text-xl" })
               ], 8, Mo)
@@ -1047,7 +1046,7 @@ const Po = ["for"], Lo = {
                     onKeydown: d[3] || (d[3] = (c) => Se(c, !1))
                   }, null, 8, ["modelValue", "color", "placeholder", "left-icon"])) : E("v-if", !0),
                   !Q.value || Q.value.length <= 0 ? N(l.$slots, "no-results", { key: 1 }, () => [
-                    j("span", To, [
+                    Y("span", To, [
                       H(k(O), { class: "maz-h-6 maz-w-6 maz-text-normal" })
                     ])
                   ], !0) : (y(), P("div", Fo, [
@@ -1062,7 +1061,7 @@ const Po = ["for"], Lo = {
                             key: 0,
                             label: c.label
                           }, () => [
-                            j(
+                            Y(
                               "span",
                               No,
                               oe(c.label),
@@ -1077,7 +1076,7 @@ const Po = ["for"], Lo = {
                               {
                                 "--is-keyboard-selected": g.value === I,
                                 "--is-selected": K(c),
-                                "--is-none-value": A(c[l.optionValueKey])
+                                "--is-none-value": V(c[l.optionValueKey])
                               }
                             ]]),
                             style: ee(l.itemHeight ? { height: `${l.itemHeight}px` } : void 0),
@@ -1094,7 +1093,7 @@ const Po = ["for"], Lo = {
                               option: c,
                               isSelected: K(c)
                             }, () => [
-                              j(
+                              Y(
                                 "span",
                                 null,
                                 oe(c[l.optionLabelKey]),
@@ -1131,7 +1130,7 @@ const Po = ["for"], Lo = {
     };
   }
 }), Ho = /* @__PURE__ */ re(Uo, [["__scopeId", "data-v-961aec79"]]);
-function Ke() {
+function Ue() {
   if (typeof window > "u")
     return;
   const a = window.navigator.language;
@@ -1149,8 +1148,8 @@ function Do(a, o, e) {
 }
 function Ro(a, o) {
   var r;
-  const e = [], t = Oe();
-  a = a ?? ((r = Ke()) == null ? void 0 : r.browserLocale) ?? "en-US";
+  const e = [], t = Me();
+  a = a ?? ((r = Ue()) == null ? void 0 : r.browserLocale) ?? "en-US";
   for (const u of t) {
     const v = Do(a, u, o);
     if (v)
@@ -1175,21 +1174,21 @@ async function qo() {
     throw new Error(`[MazPhoneNumberInput](fetchCountryCode) ${a}`);
   }
 }
-function jo(a) {
+function Yo(a) {
   if (!a)
     return "";
   const o = new RegExp(/[^\d ()+-]/g);
   return a.replaceAll(o, "").trim();
 }
-function Ue() {
+function He() {
   return {
-    sanitizePhoneNumber: jo,
+    sanitizePhoneNumber: Yo,
     fetchCountryCode: qo,
-    getBrowserLocale: Ke,
+    getBrowserLocale: Ue,
     getCountriesList: Ro
   };
 }
-const Yo = ["id"], Wo = {
+const jo = ["id"], Wo = {
   key: 0,
   class: "m-country-selector__select__item__flag-container"
 }, Qo = /* @__PURE__ */ ne({
@@ -1221,7 +1220,7 @@ const Yo = ["id"], Wo = {
   },
   emits: ["update:model-value"],
   setup(a) {
-    const o = a, { phoneNumber: e } = Me("data"), t = L(), { getCountriesList: r } = Ue(), u = h(() => r(o.countryLocale, o.customCountriesList)), v = h(
+    const o = a, { phoneNumber: e } = Te("data"), t = L(), { getCountriesList: r } = He(), u = h(() => r(o.countryLocale, o.customCountriesList)), v = h(
       () => {
         var i;
         return (i = u.value) == null ? void 0 : i.filter((f) => {
@@ -1258,7 +1257,7 @@ const Yo = ["id"], Wo = {
         ).filter(co);
       }
     );
-    async function V() {
+    function A() {
       var i, f;
       (f = (i = t.value) == null ? void 0 : i.$el.querySelector("input")) == null || f.focus();
     }
@@ -1277,7 +1276,7 @@ const Yo = ["id"], Wo = {
           }]),
           tabindex: "-1",
           type: "button",
-          onClick: V
+          onClick: A
         }, [
           N(i.$slots, "selector-flag", { countryCode: i.modelValue }, () => [
             H(Ee, {
@@ -1288,7 +1287,7 @@ const Yo = ["id"], Wo = {
               "img-class": "maz-w-5 maz-h-4 maz-rounded-sm"
             }, null, 8, ["src", "alt"])
           ], !0)
-        ], 10, Yo)) : E("v-if", !0),
+        ], 10, jo)) : E("v-if", !0),
         H(Ho, te({
           id: `country-selector-${i.id}`,
           ref_key: "CountrySelectorRef",
@@ -1299,6 +1298,7 @@ const Yo = ["id"], Wo = {
           "option-value-key": "iso2",
           "option-label-key": "name",
           "option-input-value-key": i.countrySelectorDisplayName ? "name" : "dialCode",
+          name: "country",
           "max-list-width": 250,
           "min-list-width": 200,
           disabled: i.disabled,
@@ -1324,7 +1324,7 @@ const Yo = ["id"], Wo = {
             N(i.$slots, "no-results", {}, void 0, !0)
           ]),
           default: G(({ option: z, isSelected: w }) => [
-            j(
+            Y(
               "div",
               {
                 class: M(["m-country-selector__select__item", {
@@ -1357,7 +1357,7 @@ const Yo = ["id"], Wo = {
                   3
                   /* TEXT, CLASS */
                 )) : E("v-if", !0),
-                j(
+                Y(
                   "span",
                   {
                     class: M(["maz-flex-1 maz-truncate", { "maz-font-semibold": w }])
@@ -1379,7 +1379,7 @@ const Yo = ["id"], Wo = {
       /* CLASS, STYLE */
     ));
   }
-}), Go = /* @__PURE__ */ re(Qo, [["__scopeId", "data-v-5995516e"]]), Jo = {
+}), Go = /* @__PURE__ */ re(Qo, [["__scopeId", "data-v-5ab7f303"]]), Jo = {
   countrySelector: {
     placeholder: "Country code",
     error: "Choose country",
@@ -1408,7 +1408,7 @@ function Xo({
         isValid: !1,
         countryCode: o
       };
-    const e = ro(a, o);
+    const e = ro(a, o ?? void 0);
     return {
       countryCode: (e == null ? void 0 : e.country) ?? o,
       isValid: (e == null ? void 0 : e.isValid()) ?? !1,
@@ -1427,37 +1427,37 @@ function Xo({
     throw new Error(`[MazPhoneNumberInput](getResultsFromPhoneNumber) ${e}`);
   }
 }
-function xo(a, o) {
-  try {
-    return o ? new io(a).input(o) : "";
-  } catch (e) {
-    throw new Error(`[MazPhoneNumberInput](getAsYouTypeFormat) ${e}`);
-  }
-}
-async function _o() {
+async function xo() {
   const { default: a } = await import("./examples.mobile.json-JpNGylGv.mjs");
   return a;
 }
-function et(a, o) {
+function _o(a, o) {
   var e;
   try {
-    return a && o ? (e = uo(o, a)) == null ? void 0 : e.formatNational() : void 0;
+    return a && o ? (e = io(o, a)) == null ? void 0 : e.formatNational() : void 0;
   } catch (t) {
     console.error(`[maz-ui](MazPhoneNumberInput) ${t}`);
   }
 }
-function He() {
+function et(a, o) {
+  try {
+    return !o || !a ? void 0 : new uo(a).input(o);
+  } catch (e) {
+    throw new Error(`[MazPhoneNumberInput](getAsYouTypeFormat) ${e}`);
+  }
+}
+function De() {
   function a(o, e) {
     return ce(o) === ce(e);
   }
   return {
-    getAsYouTypeFormat: xo,
+    getAsYouTypeFormat: et,
     getPhoneNumberResults: Xo,
-    getPhoneNumberExamplesFile: _o,
-    getPhoneNumberExample: et,
+    getPhoneNumberExamplesFile: xo,
+    getPhoneNumberExample: _o,
     isSameCountryCallingCode: a,
     isCountryAvailable: Zo,
-    getCountries: Oe,
+    getCountries: Me,
     getCountryCallingCode: ce
   };
 }
@@ -1483,7 +1483,7 @@ const ot = /* @__PURE__ */ ne({
   }),
   emits: /* @__PURE__ */ Pe(["update:model-value"], ["update:modelValue"]),
   setup(a, { emit: o }) {
-    const e = a, t = o, r = ao(a, "modelValue"), { getPhoneNumberExamplesFile: u, getPhoneNumberExample: v } = He(), { selectionRange: p, results: O, selectedCountry: $ } = Me("data"), g = L(), V = L(!1);
+    const e = a, t = o, r = ao(a, "modelValue"), { getPhoneNumberExamplesFile: u, getPhoneNumberExample: v } = De(), { selectionRange: p, results: O, selectedCountry: $ } = Te("data"), g = L(), A = L(!1);
     function i(b, S) {
       const C = v(b, S);
       return C ? `${e.locales.phoneInput.example} ${C}` : void 0;
@@ -1513,7 +1513,7 @@ const ot = /* @__PURE__ */ ne({
         console.error("[maz-ui](MazPhoneNumberInput) while loading phone number examples file", b);
       }
     }
-    async function Y(b) {
+    async function j(b) {
       w.value && b && J(w.value, b), await ue(), t("update:model-value", b);
     }
     function J(b, S) {
@@ -1537,15 +1537,15 @@ const ot = /* @__PURE__ */ ne({
         {
           "--border-radius": b.hasRadius,
           "--error": b.error || !k(O).isValid,
-          "--focused": V.value
+          "--focused": A.value
         }
       ]],
-      onFocus: S[0] || (S[0] = (C) => V.value = !0),
-      onBlur: S[1] || (S[1] = (C) => V.value = !1),
-      "onUpdate:modelValue": S[2] || (S[2] = (C) => Y(C))
+      onFocus: S[0] || (S[0] = (C) => A.value = !0),
+      onBlur: S[1] || (S[1] = (C) => A.value = !1),
+      "onUpdate:modelValue": S[2] || (S[2] = (C) => j(C))
     }), null, 16, ["id", "model-value", "disabled", "color", "error", "size", "success", "class"]));
   }
-}), tt = /* @__PURE__ */ re(ot, [["__scopeId", "data-v-ebe8f08f"]]), lt = /* @__PURE__ */ ne({
+}), tt = /* @__PURE__ */ re(ot, [["__scopeId", "data-v-044e8c19"]]), lt = /* @__PURE__ */ ne({
   name: "MazPhoneNumberInput",
   inheritAttrs: !1,
   __name: "MazPhoneNumberInput",
@@ -1600,10 +1600,10 @@ const ot = /* @__PURE__ */ ne({
   },
   emits: ["update:model-value", "country-code", "update:country-code", "update", "data"],
   setup(a, { emit: o }) {
-    const e = a, t = o, { fetchCountryCode: r, sanitizePhoneNumber: u, getBrowserLocale: v } = Ue(), { isCountryAvailable: p, getPhoneNumberResults: O, getAsYouTypeFormat: $ } = He(), g = Ae({
+    const e = a, t = o, { fetchCountryCode: r, sanitizePhoneNumber: u, getBrowserLocale: v } = He(), { isCountryAvailable: p, getPhoneNumberResults: O, getAsYouTypeFormat: $ } = De(), g = Ae({
       componentName: "MazPhoneNumberInput",
       providedId: e.id
-    }), V = L(""), i = L(), f = L({
+    }), A = L(), i = L(), f = L({
       isValid: !1,
       countryCode: void 0
     }), z = L(), w = L({
@@ -1613,7 +1613,7 @@ const ot = /* @__PURE__ */ ne({
     });
     so("data", {
       selectedCountry: i,
-      phoneNumber: V,
+      phoneNumber: A,
       results: f,
       selectionRange: w
     });
@@ -1621,21 +1621,22 @@ const ot = /* @__PURE__ */ ne({
       ...Jo,
       ...e.translations
     }));
-    Ie(async () => {
-      var n;
+    Oe(async () => {
       if (C(e.countryCode ?? e.defaultCountryCode), e.fetchCountry && !i.value) {
-        const A = await r();
-        C(A);
+        const n = await r();
+        C(n);
       }
+    }), Ie(() => {
+      var n;
       if (!e.defaultCountryCode && !e.noUseBrowserLocale && !i.value) {
-        const A = (n = v()) == null ? void 0 : n.locale;
-        C(A);
+        const V = (n = v()) == null ? void 0 : n.locale;
+        C(V);
       }
     });
-    const Y = L();
+    const j = L();
     function J() {
       var n;
-      return (n = Y.value) == null ? void 0 : n.$el.querySelector("input");
+      return (n = j.value) == null ? void 0 : n.$el.querySelector("input");
     }
     async function b() {
       var n;
@@ -1657,16 +1658,17 @@ const ot = /* @__PURE__ */ ne({
     }
     function W({
       newPhoneNumber: n,
-      updateResults: A = !0
+      updateResults: V = !0
     }) {
       const K = u(n);
-      if (A && (f.value = O({
+      if (V && (f.value = O({
         phoneNumber: K,
         countryCode: i.value
       })), w.value.cursorAtEnd && !e.noFormattingAsYouType && e.autoFormat) {
-        const F = f.value.isValid ? f.value.formatNational : K;
-        z.value = $(i.value, F), V.value = z.value;
-      }
+        const T = f.value.isValid ? f.value.formatNational : K;
+        z.value = $(i.value, T), A.value = z.value || T;
+      } else
+        A.value = e.modelValue || e.defaultPhoneNumber || K;
       f.value.countryCode && f.value.countryCode !== i.value && Z({
         countryCode: f.value.countryCode,
         updateResults: !1
@@ -1674,24 +1676,24 @@ const ot = /* @__PURE__ */ ne({
     }
     function Z({
       countryCode: n,
-      updateResults: A = !0
+      updateResults: V = !0
     }) {
       if (!n) {
         i.value = void 0;
         return;
       }
-      n !== i.value && C(n), A && (f.value = O({
-        phoneNumber: V.value,
+      n !== i.value && C(n), V && (f.value = O({
+        phoneNumber: A.value,
         countryCode: n
       })), W({
-        newPhoneNumber: V.value,
+        newPhoneNumber: A.value,
         updateResults: !1
       });
     }
     return he(
       () => e.modelValue ?? e.defaultPhoneNumber,
-      (n, A) => {
-        n !== A && n !== V.value && W({
+      (n, V) => {
+        n !== V && n !== A.value && W({
           newPhoneNumber: n
         });
       },
@@ -1700,8 +1702,8 @@ const ot = /* @__PURE__ */ ne({
       }
     ), he(
       () => e.countryCode ?? e.defaultCountryCode,
-      (n, A) => {
-        n && n !== A && n !== i.value && Z({
+      (n, V) => {
+        n && n !== V && n !== i.value && Z({
           countryCode: n
         });
       },
@@ -1711,12 +1713,12 @@ const ot = /* @__PURE__ */ ne({
     ), he(
       f,
       (n) => {
-        t("update", n), t("data", n), n.e164 && n.isValid ? t("update:model-value", n.e164) : t("update:model-value", V.value), t("country-code", i.value), t("update:country-code", i.value);
+        t("update", n), t("data", n), n.e164 && n.isValid ? t("update:model-value", n.e164) : t("update:model-value", A.value), t("country-code", i.value), t("update:country-code", i.value);
       },
       {
         immediate: !0
       }
-    ), (n, A) => {
+    ), (n, V) => {
       var K;
       return y(), P(
         "div",
@@ -1740,7 +1742,7 @@ const ot = /* @__PURE__ */ ne({
             "no-flags": n.noFlags,
             "no-search": n.noSearch,
             "exclude-selectors": n.excludeSelectors,
-            error: n.error || (n.noValidationError ? !1 : !!V.value && !i.value),
+            error: n.error || (n.noValidationError ? !1 : !!A.value && !i.value),
             success: n.success || (n.noValidationSuccess ? !1 : (K = f.value) == null ? void 0 : K.isValid),
             locales: D.value,
             disabled: n.disabled,
@@ -1754,14 +1756,14 @@ const ot = /* @__PURE__ */ ne({
             "no-results": G(() => [
               N(n.$slots, "no-results", {}, void 0, !0)
             ]),
-            "selector-flag": G(({ countryCode: F }) => [
-              N(n.$slots, "selector-flag", { countryCode: F }, void 0, !0)
+            "selector-flag": G(({ countryCode: T }) => [
+              N(n.$slots, "selector-flag", { countryCode: T }, void 0, !0)
             ]),
-            "country-list-flag": G(({ isSelected: F, option: le }) => [
+            "country-list-flag": G(({ isSelected: T, option: le }) => [
               N(n.$slots, "country-list-flag", {
                 countryCode: le.iso2,
                 option: le,
-                isSelected: F
+                isSelected: T
               }, void 0, !0)
             ]),
             _: 3
@@ -1770,9 +1772,9 @@ const ot = /* @__PURE__ */ ne({
           H(tt, te({
             id: k(g),
             ref_key: "PhoneInputRef",
-            ref: Y,
-            modelValue: V.value,
-            "onUpdate:modelValue": A[0] || (A[0] = (F) => V.value = F)
+            ref: j,
+            modelValue: A.value,
+            "onUpdate:modelValue": V[0] || (V[0] = (T) => A.value = T)
           }, { ...n.$attrs, ...n.phoneInputAttributes }, {
             color: n.color,
             size: n.size,
@@ -1781,14 +1783,14 @@ const ot = /* @__PURE__ */ ne({
             disabled: n.disabled,
             "has-radius": !n.noCountrySelector,
             success: n.success || (n.noValidationSuccess ? !1 : f.value.isValid),
-            error: n.error || (n.noValidationError ? !1 : !!V.value && !f.value.isValid),
+            error: n.error || (n.noValidationError ? !1 : !!A.value && !f.value.isValid),
             locales: D.value,
             "no-formatting-as-you-type": n.noFormattingAsYouType,
             "auto-format": n.autoFormat,
             label: n.label,
             placeholder: n.placeholder,
-            "onUpdate:modelValue": A[1] || (A[1] = (F) => W({
-              newPhoneNumber: F
+            "onUpdate:modelValue": V[1] || (V[1] = (T) => W({
+              newPhoneNumber: T
             }))
           }), null, 16, ["id", "modelValue", "color", "size", "no-example", "disabled", "has-radius", "success", "error", "locales", "no-formatting-as-you-type", "auto-format", "label", "placeholder"])
         ],
@@ -1797,10 +1799,10 @@ const ot = /* @__PURE__ */ ne({
       );
     };
   }
-}), rt = /* @__PURE__ */ re(lt, [["__scopeId", "data-v-420d6d4a"]]);
+}), rt = /* @__PURE__ */ re(lt, [["__scopeId", "data-v-5b5bb57f"]]);
 export {
   rt as M,
   re as _,
-  Me as i,
+  Te as i,
   Ae as u
 };