@validol4ik/uikit 0.4.7 → 0.4.10

package/dist/{index-BEAKbg3k.js → index-CCGzAkrR.js}

@@ -1,4 +1,4 @@
-import { computed as i, markRaw as ye, defineComponent as G, h as p, withDirectives as ke, getCurrentInstance as X, unref as Q, ref as te, onBeforeUnmount as Ae, Transition as ze, openBlock as S, createBlock as _e, normalizeClass as z, withCtx as Te, createElementBlock as C, createCommentVNode as T, renderSlot as $e, Fragment as qe, createTextVNode as Oe, toDisplayString as Y, createElementVNode as F, normalizeStyle as Se, useTemplateRef as De, watch as xe, onMounted as je, renderList as Ie, nextTick as ie, withKeys as Ne, defineAsyncComponent as le } from "vue";
+import { computed as u, markRaw as ye, defineComponent as Q, h as p, withDirectives as ke, getCurrentInstance as X, unref as U, ref as te, onBeforeUnmount as Ae, Transition as ze, openBlock as S, createBlock as _e, normalizeClass as A, withCtx as Te, createElementBlock as B, createCommentVNode as z, renderSlot as $e, Fragment as qe, createTextVNode as Oe, toDisplayString as Y, createElementVNode as F, normalizeStyle as Se, useTemplateRef as De, watch as xe, onMounted as je, renderList as Ie, nextTick as ie, withKeys as Ne, defineAsyncComponent as le } from "vue";
 const we = {
   PRIMARY: "primary",
   INFO: "info"
@@ -20,10 +20,10 @@ const we = {
   size: String
 };
 function re(e, t = ne) {
-  return i(() => e.size !== void 0 ? { fontSize: e.size in t ? `${t[e.size]}px` : e.size } : null);
+  return u(() => e.size !== void 0 ? { fontSize: e.size in t ? `${t[e.size]}px` : e.size } : null);
 }
 function W(e) {
-  return ye(G(e));
+  return ye(Q(e));
 }
 function Ve(e) {
   return ye(e);
@@ -45,10 +45,10 @@ function N(e, t) {
 function Vt(e, t) {
   return e === void 0 ? t : t !== void 0 ? t.concat(e()) : e();
 }
-function Ft(e, t, n, a, o, d) {
+function Ft(e, t, n, a, o, s) {
   t.key = a + o;
-  const l = p(e, t, n);
-  return o === !0 ? ke(l, d()) : l;
+  const r = p(e, t, n);
+  return o === !0 ? ke(r, s()) : r;
 }
 const se = "0 0 24 24", ue = (e) => e, ee = (e) => `ionicons ${e}`, Be = {
   "mdi-": (e) => `mdi ${e}`,
@@ -84,91 +84,91 @@ const se = "0 0 24 24", ue = (e) => e, ee = (e) => `ionicons ${e}`, Be = {
     right: Boolean
   },
   setup(e, { slots: t }) {
-    const { proxy: { $q: n } } = X(), a = re(e), o = i(
+    const { proxy: { $q: n } } = X(), a = re(e), o = u(
       () => "q-icon" + (e.left === !0 ? " on-left" : "") + (e.right === !0 ? " on-right" : "") + (e.color !== void 0 ? ` text-${e.color}` : "")
-    ), d = i(() => {
-      let l, r = e.name;
-      if (r === "none" || !r)
+    ), s = u(() => {
+      let r, i = e.name;
+      if (i === "none" || !i)
         return { none: !0 };
       if (n.iconMapFn !== null) {
-        const v = n.iconMapFn(r);
-        if (v !== void 0)
-          if (v.icon !== void 0) {
-            if (r = v.icon, r === "none" || !r)
+        const f = n.iconMapFn(i);
+        if (f !== void 0)
+          if (f.icon !== void 0) {
+            if (i = f.icon, i === "none" || !i)
               return { none: !0 };
           } else
             return {
-              cls: v.cls,
-              content: v.content !== void 0 ? v.content : " "
+              cls: f.cls,
+              content: f.content !== void 0 ? f.content : " "
             };
       }
-      if (He.test(r) === !0) {
-        const [v, _ = se] = r.split("|");
+      if (He.test(i) === !0) {
+        const [f, _ = se] = i.split("|");
         return {
           svg: !0,
           viewBox: _,
-          nodes: v.split("&&").map((s) => {
-            const [f, g, h] = s.split("@@");
-            return p("path", { style: g, d: f, transform: h });
+          nodes: f.split("&&").map((l) => {
+            const [v, m, g] = l.split("@@");
+            return p("path", { style: m, d: v, transform: g });
           })
         };
       }
-      if (Ue.test(r) === !0)
+      if (Ue.test(i) === !0)
         return {
           img: !0,
-          src: r.substring(4)
+          src: i.substring(4)
         };
-      if (Ye.test(r) === !0) {
-        const [v, _ = se] = r.split("|");
+      if (Ye.test(i) === !0) {
+        const [f, _ = se] = i.split("|");
         return {
           svguse: !0,
-          src: v.substring(7),
+          src: f.substring(7),
           viewBox: _
         };
       }
       let q = " ";
-      const k = r.match(Qe);
+      const k = i.match(Qe);
       if (k !== null)
-        l = Be[k[1]](r);
-      else if (We.test(r) === !0)
-        l = r;
-      else if (Xe.test(r) === !0)
-        l = `ionicons ion-${n.platform.is.ios === !0 ? "ios" : "md"}${r.substring(3)}`;
-      else if (ce.test(r) === !0) {
-        l = "notranslate material-symbols";
-        const v = r.match(ce);
-        v !== null && (r = r.substring(6), l += Le[v[1]]), q = r;
+        r = Be[k[1]](i);
+      else if (We.test(i) === !0)
+        r = i;
+      else if (Xe.test(i) === !0)
+        r = `ionicons ion-${n.platform.is.ios === !0 ? "ios" : "md"}${i.substring(3)}`;
+      else if (ce.test(i) === !0) {
+        r = "notranslate material-symbols";
+        const f = i.match(ce);
+        f !== null && (i = i.substring(6), r += Le[f[1]]), q = i;
       } else {
-        l = "notranslate material-icons";
-        const v = r.match(Ge);
-        v !== null && (r = r.substring(2), l += Ce[v[1]]), q = r;
+        r = "notranslate material-icons";
+        const f = i.match(Ge);
+        f !== null && (i = i.substring(2), r += Ce[f[1]]), q = i;
       }
       return {
-        cls: l,
+        cls: r,
         content: q
       };
     });
     return () => {
-      const l = {
+      const r = {
         class: o.value,
         style: a.value,
         "aria-hidden": "true",
         role: "presentation"
       };
-      return d.value.none === !0 ? p(e.tag, l, Fe(t.default)) : d.value.img === !0 ? p(e.tag, l, N(t.default, [
-        p("img", { src: d.value.src })
-      ])) : d.value.svg === !0 ? p(e.tag, l, N(t.default, [
+      return s.value.none === !0 ? p(e.tag, r, Fe(t.default)) : s.value.img === !0 ? p(e.tag, r, N(t.default, [
+        p("img", { src: s.value.src })
+      ])) : s.value.svg === !0 ? p(e.tag, r, N(t.default, [
         p("svg", {
-          viewBox: d.value.viewBox || "0 0 24 24"
-        }, d.value.nodes)
-      ])) : d.value.svguse === !0 ? p(e.tag, l, N(t.default, [
+          viewBox: s.value.viewBox || "0 0 24 24"
+        }, s.value.nodes)
+      ])) : s.value.svguse === !0 ? p(e.tag, r, N(t.default, [
         p("svg", {
-          viewBox: d.value.viewBox
+          viewBox: s.value.viewBox
         }, [
-          p("use", { "xlink:href": d.value.src })
+          p("use", { "xlink:href": s.value.src })
         ])
-      ])) : (d.value.cls !== void 0 && (l.class += " " + d.value.cls), p(e.tag, l, N(t.default, [
-        d.value.content
+      ])) : (s.value.cls !== void 0 && (r.class += " " + s.value.cls), p(e.tag, r, N(t.default, [
+        s.value.content
       ])));
     };
   }
@@ -181,8 +181,8 @@ const se = "0 0 24 24", ue = (e) => e, ee = (e) => `ionicons ${e}`, Be = {
 };
 function Ze(e) {
   return {
-    cSize: i(() => e.size in ne ? `${ne[e.size]}px` : e.size),
-    classes: i(
+    cSize: u(() => e.size in ne ? `${ne[e.size]}px` : e.size),
+    classes: u(
       () => "q-spinner" + (e.color ? ` text-${e.color}` : "")
     )
   };
@@ -231,7 +231,7 @@ function Qt(e) {
     } catch {
       return;
     }
-  const t = Q(e);
+  const t = U(e);
   if (t)
     return t.$el || t;
 }
@@ -322,23 +322,23 @@ function it(e, t = 250) {
 function fe(e, t, n, a) {
   n.modifiers.stop === !0 && Ee(e);
   const o = n.modifiers.color;
-  let d = n.modifiers.center;
-  d = d === !0 || a === !0;
-  const l = document.createElement("span"), r = document.createElement("span"), q = nt(e), { left: k, top: v, width: _, height: s } = t.getBoundingClientRect(), f = Math.sqrt(_ * _ + s * s), g = f / 2, h = `${(_ - f) / 2}px`, c = d ? h : `${q.left - k - g}px`, m = `${(s - f) / 2}px`, w = d ? m : `${q.top - v - g}px`;
-  r.className = "q-ripple__inner", tt(r, {
-    height: `${f}px`,
-    width: `${f}px`,
-    transform: `translate3d(${c},${w},0) scale3d(.2,.2,1)`,
+  let s = n.modifiers.center;
+  s = s === !0 || a === !0;
+  const r = document.createElement("span"), i = document.createElement("span"), q = nt(e), { left: k, top: f, width: _, height: l } = t.getBoundingClientRect(), v = Math.sqrt(_ * _ + l * l), m = v / 2, g = `${(_ - v) / 2}px`, d = s ? g : `${q.left - k - m}px`, h = `${(l - v) / 2}px`, w = s ? h : `${q.top - f - m}px`;
+  i.className = "q-ripple__inner", tt(i, {
+    height: `${v}px`,
+    width: `${v}px`,
+    transform: `translate3d(${d},${w},0) scale3d(.2,.2,1)`,
     opacity: 0
-  }), l.className = `q-ripple${o ? " text-" + o : ""}`, l.setAttribute("dir", "ltr"), l.appendChild(r), t.appendChild(l);
-  const B = () => {
-    l.remove(), clearTimeout(P);
+  }), r.className = `q-ripple${o ? " text-" + o : ""}`, r.setAttribute("dir", "ltr"), r.appendChild(i), t.appendChild(r);
+  const M = () => {
+    r.remove(), clearTimeout(O);
   };
-  n.abort.push(B);
-  let P = setTimeout(() => {
-    r.classList.add("q-ripple__inner--enter"), r.style.transform = `translate3d(${h},${m},0) scale3d(1,1,1)`, r.style.opacity = 0.2, P = setTimeout(() => {
-      r.classList.remove("q-ripple__inner--enter"), r.classList.add("q-ripple__inner--leave"), r.style.opacity = 0, P = setTimeout(() => {
-        l.remove(), n.abort.splice(n.abort.indexOf(B), 1);
+  n.abort.push(M);
+  let O = setTimeout(() => {
+    i.classList.add("q-ripple__inner--enter"), i.style.transform = `translate3d(${g},${h},0) scale3d(1,1,1)`, i.style.opacity = 0.2, O = setTimeout(() => {
+      i.classList.remove("q-ripple__inner--enter"), i.classList.add("q-ripple__inner--leave"), i.style.opacity = 0, O = setTimeout(() => {
+        r.remove(), n.abort.splice(n.abort.indexOf(M), 1);
       }, 275);
     }, 250);
   }, 50);
@@ -407,7 +407,7 @@ const st = Ve(
   }
 };
 function dt(e) {
-  return i(() => {
+  return u(() => {
     const t = e.align === void 0 ? e.vertical === !0 ? "stretch" : "left" : e.align;
     return `${e.vertical === !0 ? "items" : "justify"}-${Re[t]}`;
   });
@@ -440,7 +440,7 @@ function vt(e, t) {
     if (typeof a == "string") {
       if (a !== o)
         return !1;
-    } else if (Array.isArray(o) === !1 || o.length !== a.length || a.some((d, l) => d !== o[l]))
+    } else if (Array.isArray(o) === !1 || o.length !== a.length || a.some((s, r) => s !== o[r]))
       return !1;
   }
   return !0;
@@ -482,42 +482,42 @@ const Me = {
   }
 };
 function mt({ fallbackTag: e, useDisableForRouterLinkProps: t = !0 } = {}) {
-  const n = X(), { props: a, proxy: o, emit: d } = n, l = ft(n), r = i(() => a.disable !== !0 && a.href !== void 0), q = t === !0 ? i(
-    () => l === !0 && a.disable !== !0 && r.value !== !0 && a.to !== void 0 && a.to !== null && a.to !== ""
-  ) : i(
-    () => l === !0 && r.value !== !0 && a.to !== void 0 && a.to !== null && a.to !== ""
-  ), k = i(() => q.value === !0 ? w(a.to) : null), v = i(() => k.value !== null), _ = i(() => r.value === !0 || v.value === !0), s = i(() => a.type === "a" || _.value === !0 ? "a" : a.tag || e || "div"), f = i(() => r.value === !0 ? {
+  const n = X(), { props: a, proxy: o, emit: s } = n, r = ft(n), i = u(() => a.disable !== !0 && a.href !== void 0), q = t === !0 ? u(
+    () => r === !0 && a.disable !== !0 && i.value !== !0 && a.to !== void 0 && a.to !== null && a.to !== ""
+  ) : u(
+    () => r === !0 && i.value !== !0 && a.to !== void 0 && a.to !== null && a.to !== ""
+  ), k = u(() => q.value === !0 ? w(a.to) : null), f = u(() => k.value !== null), _ = u(() => i.value === !0 || f.value === !0), l = u(() => a.type === "a" || _.value === !0 ? "a" : a.tag || e || "div"), v = u(() => i.value === !0 ? {
     href: a.href,
     target: a.target
-  } : v.value === !0 ? {
+  } : f.value === !0 ? {
     href: k.value.href,
     target: a.target
-  } : {}), g = i(() => {
-    if (v.value === !1)
+  } : {}), m = u(() => {
+    if (f.value === !1)
       return -1;
-    const { matched: b } = k.value, { length: L } = b, R = b[L - 1];
-    if (R === void 0)
+    const { matched: b } = k.value, { length: C } = b, E = b[C - 1];
+    if (E === void 0)
       return -1;
-    const A = o.$route.matched;
-    if (A.length === 0)
+    const P = o.$route.matched;
+    if (P.length === 0)
       return -1;
-    const O = A.findIndex(
-      pe.bind(null, R)
+    const T = P.findIndex(
+      pe.bind(null, E)
     );
-    if (O !== -1)
-      return O;
-    const H = ge(b[L - 2]);
+    if (T !== -1)
+      return T;
+    const G = ge(b[C - 2]);
     return (
       // we are dealing with nested routes
-      L > 1 && ge(R) === H && A[A.length - 1].path !== H ? A.findIndex(
-        pe.bind(null, b[L - 2])
-      ) : O
+      C > 1 && ge(E) === G && P[P.length - 1].path !== G ? P.findIndex(
+        pe.bind(null, b[C - 2])
+      ) : T
     );
-  }), h = i(
-    () => v.value === !0 && g.value !== -1 && vt(o.$route.params, k.value.params)
-  ), c = i(
-    () => h.value === !0 && g.value === o.$route.matched.length - 1 && pt(o.$route.params, k.value.params)
-  ), m = i(() => v.value === !0 ? c.value === !0 ? ` ${a.exactActiveClass} ${a.activeClass}` : a.exact === !0 ? "" : h.value === !0 ? ` ${a.activeClass}` : "" : "");
+  }), g = u(
+    () => f.value === !0 && m.value !== -1 && vt(o.$route.params, k.value.params)
+  ), d = u(
+    () => g.value === !0 && m.value === o.$route.matched.length - 1 && pt(o.$route.params, k.value.params)
+  ), h = u(() => f.value === !0 ? d.value === !0 ? ` ${a.exactActiveClass} ${a.activeClass}` : a.exact === !0 ? "" : g.value === !0 ? ` ${a.activeClass}` : "" : "");
   function w(b) {
     try {
       return o.$router.resolve(b);
@@ -525,7 +525,7 @@ function mt({ fallbackTag: e, useDisableForRouterLinkProps: t = !0 } = {}) {
     }
     return null;
   }
-  function B(b, { returnRouterError: L, to: R = a.to, replace: A = a.replace } = {}) {
+  function M(b, { returnRouterError: C, to: E = a.to, replace: P = a.replace } = {}) {
     if (a.disable === !0)
       return b.preventDefault(), Promise.resolve(!1);
     if (
@@ -535,31 +535,31 @@ function mt({ fallbackTag: e, useDisableForRouterLinkProps: t = !0 } = {}) {
     )
       return Promise.resolve(!1);
     b.preventDefault();
-    const O = o.$router[A === !0 ? "replace" : "push"](R);
-    return L === !0 ? O : O.then(() => {
+    const T = o.$router[P === !0 ? "replace" : "push"](E);
+    return C === !0 ? T : T.then(() => {
     }).catch(() => {
     });
   }
-  function P(b) {
-    if (v.value === !0) {
-      const L = (R) => B(b, R);
-      d("click", b, L), b.defaultPrevented !== !0 && L();
+  function O(b) {
+    if (f.value === !0) {
+      const C = (E) => M(b, E);
+      s("click", b, C), b.defaultPrevented !== !0 && C();
     } else
-      d("click", b);
+      s("click", b);
   }
   return {
-    hasRouterLink: v,
-    hasHrefLink: r,
+    hasRouterLink: f,
+    hasHrefLink: i,
     hasLink: _,
-    linkTag: s,
+    linkTag: l,
     resolvedLink: k,
-    linkIsActive: h,
-    linkIsExactActive: c,
-    linkClass: m,
-    linkAttrs: f,
+    linkIsActive: g,
+    linkIsExactActive: d,
+    linkClass: h,
+    linkAttrs: v,
     getLink: w,
-    navigateToRouterLink: B,
-    navigateOnClick: P
+    navigateToRouterLink: M,
+    navigateOnClick: O
   };
 }
 const he = {
@@ -630,47 +630,47 @@ const _t = {
   round: Boolean
 };
 function qt(e) {
-  const t = re(e, ht), n = dt(e), { hasRouterLink: a, hasLink: o, linkTag: d, linkAttrs: l, navigateOnClick: r } = mt({
+  const t = re(e, ht), n = dt(e), { hasRouterLink: a, hasLink: o, linkTag: s, linkAttrs: r, navigateOnClick: i } = mt({
     fallbackTag: "button"
-  }), q = i(() => {
-    const c = e.fab === !1 && e.fabMini === !1 ? t.value : {};
-    return e.padding !== void 0 ? Object.assign({}, c, {
-      padding: e.padding.split(/\s+/).map((m) => m in he ? he[m] + "px" : m).join(" "),
+  }), q = u(() => {
+    const d = e.fab === !1 && e.fabMini === !1 ? t.value : {};
+    return e.padding !== void 0 ? Object.assign({}, d, {
+      padding: e.padding.split(/\s+/).map((h) => h in he ? he[h] + "px" : h).join(" "),
       minWidth: "0",
       minHeight: "0"
-    }) : c;
-  }), k = i(
+    }) : d;
+  }), k = u(
     () => e.rounded === !0 || e.fab === !0 || e.fabMini === !0
-  ), v = i(
+  ), f = u(
     () => e.disable !== !0 && e.loading !== !0
-  ), _ = i(() => v.value === !0 ? e.tabindex || 0 : -1), s = i(() => Pe(e, "standard")), f = i(() => {
-    const c = { tabindex: _.value };
-    return o.value === !0 ? Object.assign(c, l.value) : bt.includes(e.type) === !0 && (c.type = e.type), d.value === "a" ? (e.disable === !0 ? c["aria-disabled"] = "true" : c.href === void 0 && (c.role = "button"), a.value !== !0 && yt.test(e.type) === !0 && (c.type = e.type)) : e.disable === !0 && (c.disabled = "", c["aria-disabled"] = "true"), e.loading === !0 && e.percentage !== void 0 && Object.assign(c, {
+  ), _ = u(() => f.value === !0 ? e.tabindex || 0 : -1), l = u(() => Pe(e, "standard")), v = u(() => {
+    const d = { tabindex: _.value };
+    return o.value === !0 ? Object.assign(d, r.value) : bt.includes(e.type) === !0 && (d.type = e.type), s.value === "a" ? (e.disable === !0 ? d["aria-disabled"] = "true" : d.href === void 0 && (d.role = "button"), a.value !== !0 && yt.test(e.type) === !0 && (d.type = e.type)) : e.disable === !0 && (d.disabled = "", d["aria-disabled"] = "true"), e.loading === !0 && e.percentage !== void 0 && Object.assign(d, {
       role: "progressbar",
       "aria-valuemin": 0,
       "aria-valuemax": 100,
       "aria-valuenow": e.percentage
-    }), c;
-  }), g = i(() => {
-    let c;
-    e.color !== void 0 ? e.flat === !0 || e.outline === !0 ? c = `text-${e.textColor || e.color}` : c = `bg-${e.color} text-${e.textColor || "white"}` : e.textColor && (c = `text-${e.textColor}`);
-    const m = e.round === !0 ? "round" : `rectangle${k.value === !0 ? " q-btn--rounded" : e.square === !0 ? " q-btn--square" : ""}`;
-    return `q-btn--${s.value} q-btn--${m}` + (c !== void 0 ? " " + c : "") + (v.value === !0 ? " q-btn--actionable q-focusable q-hoverable" : e.disable === !0 ? " disabled" : "") + (e.fab === !0 ? " q-btn--fab" : e.fabMini === !0 ? " q-btn--fab-mini" : "") + (e.noCaps === !0 ? " q-btn--no-uppercase" : "") + (e.dense === !0 ? " q-btn--dense" : "") + (e.stretch === !0 ? " no-border-radius self-stretch" : "") + (e.glossy === !0 ? " glossy" : "") + (e.square ? " q-btn--square" : "");
-  }), h = i(
+    }), d;
+  }), m = u(() => {
+    let d;
+    e.color !== void 0 ? e.flat === !0 || e.outline === !0 ? d = `text-${e.textColor || e.color}` : d = `bg-${e.color} text-${e.textColor || "white"}` : e.textColor && (d = `text-${e.textColor}`);
+    const h = e.round === !0 ? "round" : `rectangle${k.value === !0 ? " q-btn--rounded" : e.square === !0 ? " q-btn--square" : ""}`;
+    return `q-btn--${l.value} q-btn--${h}` + (d !== void 0 ? " " + d : "") + (f.value === !0 ? " q-btn--actionable q-focusable q-hoverable" : e.disable === !0 ? " disabled" : "") + (e.fab === !0 ? " q-btn--fab" : e.fabMini === !0 ? " q-btn--fab-mini" : "") + (e.noCaps === !0 ? " q-btn--no-uppercase" : "") + (e.dense === !0 ? " q-btn--dense" : "") + (e.stretch === !0 ? " no-border-radius self-stretch" : "") + (e.glossy === !0 ? " glossy" : "") + (e.square ? " q-btn--square" : "");
+  }), g = u(
     () => n.value + (e.stack === !0 ? " column" : " row") + (e.noWrap === !0 ? " no-wrap text-no-wrap" : "") + (e.loading === !0 ? " q-btn__content--hidden" : "")
   );
   return {
-    classes: g,
+    classes: m,
     style: q,
-    innerClasses: h,
-    attributes: f,
+    innerClasses: g,
+    attributes: v,
     hasLink: o,
-    linkTag: d,
-    navigateOnClick: r,
-    isActionable: v
+    linkTag: s,
+    navigateOnClick: i,
+    isActionable: f
   };
 }
-const { passiveCapture: E } = J;
+const { passiveCapture: L } = J;
 let x = null, j = null, I = null;
 const St = W({
   name: "QBtn",
@@ -684,24 +684,24 @@ const St = W({
   setup(e, { slots: t, emit: n }) {
     const { proxy: a } = X(), {
       classes: o,
-      style: d,
-      innerClasses: l,
-      attributes: r,
+      style: s,
+      innerClasses: r,
+      attributes: i,
       hasLink: q,
       linkTag: k,
-      navigateOnClick: v,
+      navigateOnClick: f,
       isActionable: _
-    } = qt(e), s = te(null), f = te(null);
-    let g = null, h, c = null;
-    const m = i(
+    } = qt(e), l = te(null), v = te(null);
+    let m = null, g, d = null;
+    const h = u(
       () => e.label !== void 0 && e.label !== null && e.label !== ""
-    ), w = i(() => e.disable === !0 || e.ripple === !1 ? !1 : {
+    ), w = u(() => e.disable === !0 || e.ripple === !1 ? !1 : {
       keyCodes: q.value === !0 ? [13, 32] : [13],
       ...e.ripple === !0 ? {} : e.ripple
-    }), B = i(() => ({ center: e.round })), P = i(() => {
-      const u = Math.max(0, Math.min(100, e.percentage));
-      return u > 0 ? { transition: "transform 0.6s", transform: `translateX(${u - 100}%)` } : {};
-    }), b = i(() => {
+    }), M = u(() => ({ center: e.round })), O = u(() => {
+      const c = Math.max(0, Math.min(100, e.percentage));
+      return c > 0 ? { transition: "transform 0.6s", transform: `translateX(${c - 100}%)` } : {};
+    }), b = u(() => {
       if (e.loading === !0)
         return {
           onMousedown: V,
@@ -711,102 +711,102 @@ const St = W({
           onKeyup: V
         };
       if (_.value === !0) {
-        const u = {
-          onClick: R,
-          onKeydown: A,
-          onMousedown: H
+        const c = {
+          onClick: E,
+          onKeydown: P,
+          onMousedown: G
         };
         if (a.$q.platform.has.touch === !0) {
           const y = e.onTouchstart !== void 0 ? "" : "Passive";
-          u[`onTouchstart${y}`] = O;
+          c[`onTouchstart${y}`] = T;
         }
-        return u;
+        return c;
       }
       return {
         // needed; especially for disabled <a> tags
         onClick: D
       };
-    }), L = i(() => ({
-      ref: s,
+    }), C = u(() => ({
+      ref: l,
       class: "q-btn q-btn-item non-selectable no-outline " + o.value,
-      style: d.value,
-      ...r.value,
+      style: s.value,
+      ...i.value,
       ...b.value
     }));
-    function R(u) {
-      if (s.value !== null) {
-        if (u !== void 0) {
-          if (u.defaultPrevented === !0)
+    function E(c) {
+      if (l.value !== null) {
+        if (c !== void 0) {
+          if (c.defaultPrevented === !0)
             return;
           const y = document.activeElement;
-          if (e.type === "submit" && y !== document.body && s.value.contains(y) === !1 && y.contains(s.value) === !1) {
-            s.value.focus();
-            const U = () => {
-              document.removeEventListener("keydown", D, !0), document.removeEventListener("keyup", U, E), s.value !== null && s.value.removeEventListener("blur", U, E);
+          if (e.type === "submit" && y !== document.body && l.value.contains(y) === !1 && y.contains(l.value) === !1) {
+            l.value.focus();
+            const H = () => {
+              document.removeEventListener("keydown", D, !0), document.removeEventListener("keyup", H, L), l.value !== null && l.value.removeEventListener("blur", H, L);
             };
-            document.addEventListener("keydown", D, !0), document.addEventListener("keyup", U, E), s.value.addEventListener("blur", U, E);
+            document.addEventListener("keydown", D, !0), document.addEventListener("keyup", H, L), l.value.addEventListener("blur", H, L);
           }
         }
-        v(u);
+        f(c);
       }
     }
-    function A(u) {
-      s.value !== null && (n("keydown", u), ae(u, [13, 32]) === !0 && j !== s.value && (j !== null && K(), u.defaultPrevented !== !0 && (s.value.focus(), j = s.value, s.value.classList.add("q-btn--active"), document.addEventListener("keyup", M, !0), s.value.addEventListener("blur", M, E)), D(u)));
+    function P(c) {
+      l.value !== null && (n("keydown", c), ae(c, [13, 32]) === !0 && j !== l.value && (j !== null && K(), c.defaultPrevented !== !0 && (l.value.focus(), j = l.value, l.value.classList.add("q-btn--active"), document.addEventListener("keyup", R, !0), l.value.addEventListener("blur", R, L)), D(c)));
     }
-    function O(u) {
-      s.value !== null && (n("touchstart", u), u.defaultPrevented !== !0 && (x !== s.value && (x !== null && K(), x = s.value, g = u.target, g.addEventListener("touchcancel", M, E), g.addEventListener("touchend", M, E)), h = !0, c !== null && clearTimeout(c), c = setTimeout(() => {
-        c = null, h = !1;
+    function T(c) {
+      l.value !== null && (n("touchstart", c), c.defaultPrevented !== !0 && (x !== l.value && (x !== null && K(), x = l.value, m = c.target, m.addEventListener("touchcancel", R, L), m.addEventListener("touchend", R, L)), g = !0, d !== null && clearTimeout(d), d = setTimeout(() => {
+        d = null, g = !1;
       }, 200)));
     }
-    function H(u) {
-      s.value !== null && (u.qSkipRipple = h === !0, n("mousedown", u), u.defaultPrevented !== !0 && I !== s.value && (I !== null && K(), I = s.value, s.value.classList.add("q-btn--active"), document.addEventListener("mouseup", M, E)));
+    function G(c) {
+      l.value !== null && (c.qSkipRipple = g === !0, n("mousedown", c), c.defaultPrevented !== !0 && I !== l.value && (I !== null && K(), I = l.value, l.value.classList.add("q-btn--active"), document.addEventListener("mouseup", R, L)));
     }
-    function M(u) {
-      if (s.value !== null && !(u !== void 0 && u.type === "blur" && document.activeElement === s.value)) {
-        if (u !== void 0 && u.type === "keyup") {
-          if (j === s.value && ae(u, [13, 32]) === !0) {
-            const y = new MouseEvent("click", u);
-            y.qKeyEvent = !0, u.defaultPrevented === !0 && at(y), u.cancelBubble === !0 && Ee(y), s.value.dispatchEvent(y), D(u), u.qKeyEvent = !0;
+    function R(c) {
+      if (l.value !== null && !(c !== void 0 && c.type === "blur" && document.activeElement === l.value)) {
+        if (c !== void 0 && c.type === "keyup") {
+          if (j === l.value && ae(c, [13, 32]) === !0) {
+            const y = new MouseEvent("click", c);
+            y.qKeyEvent = !0, c.defaultPrevented === !0 && at(y), c.cancelBubble === !0 && Ee(y), l.value.dispatchEvent(y), D(c), c.qKeyEvent = !0;
           }
-          n("keyup", u);
+          n("keyup", c);
         }
         K();
       }
     }
-    function K(u) {
-      const y = f.value;
-      u !== !0 && (x === s.value || I === s.value) && y !== null && y !== document.activeElement && (y.setAttribute("tabindex", -1), y.focus()), x === s.value && (g !== null && (g.removeEventListener("touchcancel", M, E), g.removeEventListener("touchend", M, E)), x = g = null), I === s.value && (document.removeEventListener("mouseup", M, E), I = null), j === s.value && (document.removeEventListener("keyup", M, !0), s.value !== null && s.value.removeEventListener("blur", M, E), j = null), s.value !== null && s.value.classList.remove("q-btn--active");
+    function K(c) {
+      const y = v.value;
+      c !== !0 && (x === l.value || I === l.value) && y !== null && y !== document.activeElement && (y.setAttribute("tabindex", -1), y.focus()), x === l.value && (m !== null && (m.removeEventListener("touchcancel", R, L), m.removeEventListener("touchend", R, L)), x = m = null), I === l.value && (document.removeEventListener("mouseup", R, L), I = null), j === l.value && (document.removeEventListener("keyup", R, !0), l.value !== null && l.value.removeEventListener("blur", R, L), j = null), l.value !== null && l.value.classList.remove("q-btn--active");
     }
-    function V(u) {
-      D(u), u.qSkipRipple = !0;
+    function V(c) {
+      D(c), c.qSkipRipple = !0;
     }
     return Ae(() => {
       K(!0);
     }), Object.assign(a, {
-      click: (u) => {
-        _.value === !0 && R(u);
+      click: (c) => {
+        _.value === !0 && E(c);
       }
     }), () => {
-      let u = [];
-      e.icon !== void 0 && u.push(
+      let c = [];
+      e.icon !== void 0 && c.push(
         p(de, {
           name: e.icon,
-          left: e.stack !== !0 && m.value === !0,
+          left: e.stack !== !0 && h.value === !0,
           role: "img"
         })
-      ), m.value === !0 && u.push(
+      ), h.value === !0 && c.push(
         p("span", { class: "block" }, [e.label])
-      ), u = N(t.default, u), e.iconRight !== void 0 && e.round === !1 && u.push(
+      ), c = N(t.default, c), e.iconRight !== void 0 && e.round === !1 && c.push(
         p(de, {
           name: e.iconRight,
-          right: e.stack !== !0 && m.value === !0,
+          right: e.stack !== !0 && h.value === !0,
           role: "img"
         })
       );
       const y = [
         p("span", {
           class: "q-focus-helper",
-          ref: f
+          ref: v
         })
       ];
       return e.loading === !0 && e.percentage !== void 0 && y.push(
@@ -815,13 +815,13 @@ const St = W({
         }, [
           p("span", {
             class: "q-btn__progress-indicator fit block",
-            style: P.value
+            style: O.value
           })
         ])
       ), y.push(
         p("span", {
-          class: "q-btn__content text-center col items-center q-anchor--skip " + l.value
-        }, u)
+          class: "q-btn__content text-center col items-center q-anchor--skip " + r.value
+        }, c)
       ), e.loading !== null && y.push(
         p(ze, {
           name: "q-transition--fade"
@@ -834,19 +834,19 @@ const St = W({
       ), ke(
         p(
           k.value,
-          L.value,
+          C.value,
           y
         ),
         [[
           st,
           w.value,
           void 0,
-          B.value
+          M.value
         ]]
       );
     };
   }
-}), wt = /* @__PURE__ */ G({
+}), wt = /* @__PURE__ */ Q({
   __name: "AppButton",
   props: {
     size: { default: $.MD },
@@ -869,7 +869,7 @@ const St = W({
   },
   emits: ["click"],
   setup(e) {
-    const t = e, n = i(() => [
+    const t = e, n = u(() => [
       "app-btn",
       {
         "app-btn_default": !t.transparent && !t.flat,
@@ -885,11 +885,11 @@ const St = W({
       },
       `app-btn_${t.color}`
     ]);
-    return (a, o) => (S(), _e(Q(St), {
+    return (a, o) => (S(), _e(U(St), {
       "no-caps": "",
       unelevated: "",
-      class: z(n.value),
-      padding: Q(Ke)[a.size || Q($).MD],
+      class: A(n.value),
+      padding: U(Ke)[a.size || U($).MD],
       loading: a.loading,
       disable: a.disabled || void 0,
       to: a.to,
@@ -898,31 +898,31 @@ const St = W({
       type: a.submit ? "submit" : void 0,
       "aria-label": a.ariaLabel,
       download: a.download,
-      onClick: o[0] || (o[0] = (d) => a.$emit("click", d))
+      onClick: o[0] || (o[0] = (s) => a.$emit("click", s))
     }, {
       default: Te(() => [
-        a.iconLeft || a.iconMiddle ? (S(), C("i", {
+        a.iconLeft || a.iconMiddle ? (S(), B("i", {
           key: 0,
-          class: z([
+          class: A([
             "icon-kl",
             a.iconLeft ? "icon-kl_left" : "icon-kl_middle",
             `icon-kl-${a.iconLeft || a.iconMiddle}`,
             a.transparent || a.flat ? `text-${a.color}` : "text-secondary"
           ])
-        }, null, 2)) : T("", !0),
+        }, null, 2)) : z("", !0),
         $e(a.$slots, "default", {}, void 0, !0),
-        a.label ? (S(), C(qe, { key: 1 }, [
+        a.label ? (S(), B(qe, { key: 1 }, [
           Oe(Y(a.label), 1)
-        ], 64)) : T("", !0),
-        a.iconRight ? (S(), C("i", {
+        ], 64)) : z("", !0),
+        a.iconRight ? (S(), B("i", {
           key: 2,
-          class: z([
+          class: A([
             "icon-kl",
             "icon-kl_right",
             `icon-kl-${a.iconRight}`,
             a.transparent ? `text-${a.color}` : "text-secondary"
           ])
-        }, null, 2)) : T("", !0)
+        }, null, 2)) : z("", !0)
       ]),
       _: 3
     }, 8, ["class", "padding", "loading", "disable", "to", "href", "target", "type", "aria-label", "download"]));
@@ -938,7 +938,7 @@ const St = W({
 }, Ct = { class: "app-toggle__container" }, Lt = ["checked", "disabled"], Et = { class: "app-toggle__thumb" }, Rt = {
   key: 1,
   class: "app-toggle__label"
-}, Mt = /* @__PURE__ */ G({
+}, Mt = /* @__PURE__ */ Q({
   __name: "AppToggle",
   props: {
     modelValue: { type: Boolean },
@@ -953,12 +953,12 @@ const St = W({
   },
   emits: ["update:modelValue"],
   setup(e, { emit: t }) {
-    const n = e, a = t, o = i({
+    const n = e, a = t, o = u({
       get: () => n.modelValue,
-      set: (l) => {
-        a("update:modelValue", l);
+      set: (r) => {
+        a("update:modelValue", r);
       }
-    }), d = i(() => [
+    }), s = u(() => [
       "app-toggle",
       {
         "app-toggle_sm": n.size === $.SM,
@@ -969,43 +969,43 @@ const St = W({
       },
       `app-toggle_${n.color}`
     ]);
-    return (l, r) => (S(), C("div", {
-      class: z(d.value)
+    return (r, i) => (S(), B("div", {
+      class: A(s.value)
     }, [
-      l.label && l.labelLeft ? (S(), C("span", Bt, Y(l.label), 1)) : T("", !0),
+      r.label && r.labelLeft ? (S(), B("span", Bt, Y(r.label), 1)) : z("", !0),
       F("label", Ct, [
         F("input", {
           type: "checkbox",
           checked: o.value,
-          onChange: r[0] || (r[0] = (q) => o.value = !o.value),
-          disabled: l.disabled,
+          onChange: i[0] || (i[0] = (q) => o.value = !o.value),
+          disabled: r.disabled,
           class: "app-toggle__input"
         }, null, 40, Lt),
         F("span", {
-          class: z(["app-toggle__slider", o.value ? `bg-${l.color}` : ""])
+          class: A(["app-toggle__slider", o.value ? `bg-${r.color}` : ""])
         }, [
           F("span", Et, [
-            l.icon && !l.modelValue ? (S(), C("i", {
+            r.icon && !r.modelValue ? (S(), B("i", {
               key: 0,
-              class: z(["icon-kl", `icon-kl-${l.icon}`, "app-toggle__icon"])
-            }, null, 2)) : T("", !0),
-            l.modelValue && (l.iconActive || l.icon) ? (S(), C("i", {
+              class: A(["icon-kl", `icon-kl-${r.icon}`, "app-toggle__icon"])
+            }, null, 2)) : z("", !0),
+            r.modelValue && (r.iconActive || r.icon) ? (S(), B("i", {
               key: 1,
-              class: z([
+              class: A([
                 "icon-kl",
-                `icon-kl-${l.iconActive || l.icon}`,
+                `icon-kl-${r.iconActive || r.icon}`,
                 "app-toggle__icon",
-                o.value ? `text-${l.iconColor}` : ""
+                o.value ? `text-${r.iconColor}` : ""
               ])
-            }, null, 2)) : T("", !0)
+            }, null, 2)) : z("", !0)
           ])
         ], 2),
-        $e(l.$slots, "default", {}, void 0, !0)
+        $e(r.$slots, "default", {}, void 0, !0)
       ]),
-      l.label && !l.labelLeft ? (S(), C("span", Rt, Y(l.label), 1)) : T("", !0)
+      r.label && !r.labelLeft ? (S(), B("span", Rt, Y(r.label), 1)) : z("", !0)
     ], 2));
   }
-}), en = /* @__PURE__ */ Z(Mt, [["__scopeId", "data-v-e0e56123"]]), Pt = /* @__PURE__ */ G({
+}), en = /* @__PURE__ */ Z(Mt, [["__scopeId", "data-v-e0e56123"]]), Pt = /* @__PURE__ */ Q({
   __name: "AppIcon",
   props: {
     name: {},
@@ -1013,8 +1013,8 @@ const St = W({
     color: {}
   },
   setup(e) {
-    return (t, n) => (S(), C("i", {
-      class: z(["icon-kl", `icon-kl-${t.name}`, t.color ? `text-${t.color}` : ""]),
+    return (t, n) => (S(), B("i", {
+      class: A(["icon-kl", `icon-kl-${t.name}`, t.color ? `text-${t.color}` : ""]),
       style: Se(t.size ? `font-size: ${t.size}` : void 0)
     }, null, 6));
   }
@@ -1025,7 +1025,7 @@ const St = W({
   }
 };
 function zt(e, t) {
-  return i(() => e.dark === null ? t.dark.isActive : e.dark);
+  return u(() => e.dark === null ? t.dark.isActive : e.dark);
 }
 const Tt = {
   xs: 2,
@@ -1063,48 +1063,48 @@ const Ot = W({
     instantFeedback: Boolean
   },
   setup(e, { slots: t }) {
-    const { proxy: n } = X(), a = zt(e, n.$q), o = re(e, Tt), d = i(() => e.indeterminate === !0 || e.query === !0), l = i(() => e.reverse !== e.query), r = i(() => ({
+    const { proxy: n } = X(), a = zt(e, n.$q), o = re(e, Tt), s = u(() => e.indeterminate === !0 || e.query === !0), r = u(() => e.reverse !== e.query), i = u(() => ({
       ...o.value !== null ? o.value : {},
       "--q-linear-progress-speed": `${e.animationSpeed}ms`
-    })), q = i(
+    })), q = u(
       () => "q-linear-progress" + (e.color !== void 0 ? ` text-${e.color}` : "") + (e.reverse === !0 || e.query === !0 ? " q-linear-progress--reverse" : "") + (e.rounded === !0 ? " rounded-borders" : "")
-    ), k = i(() => be(e.buffer !== void 0 ? e.buffer : 1, l.value, n.$q)), v = i(() => `with${e.instantFeedback === !0 ? "out" : ""}-transition`), _ = i(
-      () => `q-linear-progress__track absolute-full q-linear-progress__track--${v.value} q-linear-progress__track--${a.value === !0 ? "dark" : "light"}` + (e.trackColor !== void 0 ? ` bg-${e.trackColor}` : "")
-    ), s = i(() => be(d.value === !0 ? 1 : e.value, l.value, n.$q)), f = i(
-      () => `q-linear-progress__model absolute-full q-linear-progress__model--${v.value} q-linear-progress__model--${d.value === !0 ? "in" : ""}determinate`
-    ), g = i(() => ({ width: `${e.value * 100}%` })), h = i(
-      () => `q-linear-progress__stripe absolute-${e.reverse === !0 ? "right" : "left"} q-linear-progress__stripe--${v.value}`
+    ), k = u(() => be(e.buffer !== void 0 ? e.buffer : 1, r.value, n.$q)), f = u(() => `with${e.instantFeedback === !0 ? "out" : ""}-transition`), _ = u(
+      () => `q-linear-progress__track absolute-full q-linear-progress__track--${f.value} q-linear-progress__track--${a.value === !0 ? "dark" : "light"}` + (e.trackColor !== void 0 ? ` bg-${e.trackColor}` : "")
+    ), l = u(() => be(s.value === !0 ? 1 : e.value, r.value, n.$q)), v = u(
+      () => `q-linear-progress__model absolute-full q-linear-progress__model--${f.value} q-linear-progress__model--${s.value === !0 ? "in" : ""}determinate`
+    ), m = u(() => ({ width: `${e.value * 100}%` })), g = u(
+      () => `q-linear-progress__stripe absolute-${e.reverse === !0 ? "right" : "left"} q-linear-progress__stripe--${f.value}`
     );
     return () => {
-      const c = [
+      const d = [
         p("div", {
           class: _.value,
           style: k.value
         }),
         p("div", {
-          class: f.value,
-          style: s.value
+          class: v.value,
+          style: l.value
         })
       ];
-      return e.stripe === !0 && d.value === !1 && c.push(
+      return e.stripe === !0 && s.value === !1 && d.push(
         p("div", {
-          class: h.value,
-          style: g.value
+          class: g.value,
+          style: m.value
         })
       ), p("div", {
         class: q.value,
-        style: r.value,
+        style: i.value,
         role: "progressbar",
         "aria-valuemin": 0,
         "aria-valuemax": 1,
         "aria-valuenow": e.indeterminate === !0 ? void 0 : e.value
-      }, N(t.default, c));
+      }, N(t.default, d));
     };
   }
 }), Dt = {
   key: 0,
   class: "code-field__label"
-}, xt = { class: "code-field__inputs" }, jt = ["value", "disabled", "onInput", "onKeydown", "onPaste"], It = /* @__PURE__ */ G({
+}, xt = { class: "code-field__inputs" }, jt = ["value", "disabled", "onInput", "onKeydown", "onPaste"], It = /* @__PURE__ */ Q({
   __name: "AppCodeInput",
   props: {
     length: { default: 5 },
@@ -1117,7 +1117,7 @@ const Ot = W({
   },
   emits: ["update:modelValue", "completed"],
   setup(e, { emit: t }) {
-    const n = e, a = t, o = n.length, d = te(Array(o).fill("")), l = De("inputRefs"), r = i(() => [
+    const n = e, a = t, o = te(Array(n.length).fill("")), s = De("inputRefs"), r = u(() => [
       "code-field",
       {
         "code-field_sm": n.size === $.SM,
@@ -1126,84 +1126,88 @@ const Ot = W({
         "code-field_disabled": n.disabled || n.loading
       },
       `code-field_${n.color}`
-    ]), q = i(() => {
-      let f = "";
-      return n.size == $.SM && (f += `width: ${n.length * 26 + (n.length - 1) * 5}px`), n.size == $.MD && (f += `width: ${n.length * 32 + (n.length - 1) * 8}px`), n.size == $.LG && (f += `width: ${n.length * 44 + (n.length - 1) * 10}px`), f;
-    }), k = (f, g) => {
-      var m;
-      const c = f.target.value;
-      if (c.length === 1)
-        d.value[g] = c, g < o - 1 && l.value && ((m = l.value[g + 1]) == null || m.focus());
-      else if (c.length > 1) {
-        const w = c.slice(0, o - g).split("");
-        w.forEach((B, P) => {
-          d.value[g + P] = B;
+    ]), i = u(() => {
+      let l = "";
+      return n.size == $.SM && (l += `width: ${n.length * 26 + (n.length - 1) * 5}px`), n.size == $.MD && (l += `width: ${n.length * 32 + (n.length - 1) * 8}px`), n.size == $.LG && (l += `width: ${n.length * 44 + (n.length - 1) * 10}px`), l;
+    }), q = (l, v) => {
+      var d;
+      const g = l.target.value;
+      if (g.length === 1)
+        o.value[v] = g, v < n.length - 1 && s.value && ((d = s.value[v + 1]) == null || d.focus());
+      else if (g.length > 1) {
+        const h = g.slice(0, n.length - v).split("");
+        h.forEach((w, M) => {
+          o.value[v + M] = w;
         }), ie(() => {
-          var B;
-          l.value && ((B = l.value[Math.min(g + w.length, o - 1)]) == null || B.focus());
+          var w;
+          s.value && ((w = s.value[Math.min(v + h.length, n.length - 1)]) == null || w.focus());
         });
       }
-    }, v = (f, g) => {
-      var h;
-      d.value[g] === "" && l.value && g > 0 && l.value[g - 1] && ((h = l.value[g - 1]) == null || h.focus());
-    }, _ = (f, g) => {
+    }, k = (l, v) => {
       var m;
-      f.preventDefault();
-      const h = ((m = f.clipboardData) == null ? void 0 : m.getData("text")) ?? "";
-      if (!h) return;
-      const c = h.slice(0, o - g).split("");
-      c.forEach((w, B) => {
-        d.value[g + B] = w;
+      o.value[v] === "" && s.value && v > 0 && s.value[v - 1] && ((m = s.value[v - 1]) == null || m.focus());
+    }, f = (l, v) => {
+      var d;
+      l.preventDefault();
+      const m = ((d = l.clipboardData) == null ? void 0 : d.getData("text")) ?? "";
+      if (!m) return;
+      const g = m.slice(0, n.length - v).split("");
+      g.forEach((h, w) => {
+        o.value[v + w] = h;
       }), ie(() => {
-        var w;
-        l.value && ((w = l.value[Math.min(g + c.length, o - 1)]) == null || w.focus());
+        var h;
+        s.value && ((h = s.value[Math.min(v + g.length, n.length - 1)]) == null || h.focus());
       });
     };
-    xe(d.value, (f) => {
-      const g = f.join("");
-      s(g);
-    });
-    const s = (f) => {
-      a("update:modelValue", f), f.length === n.length && !f.includes(" ") && a("completed", f);
+    xe(
+      o,
+      (l) => {
+        const v = l.join("");
+        _(v);
+      },
+      { deep: !0 }
+    );
+    const _ = (l) => {
+      a("update:modelValue", l), l.length === n.length && !l.includes(" ") && a("completed", l);
     };
     return je(() => {
-      n.autofocus && l.value && l.value[0] && l.value[0].focus();
-    }), (f, g) => (S(), C("div", {
-      class: z(r.value),
-      style: Se(q.value)
+      n.autofocus && s.value && s.value[0] && s.value[0].focus();
+    }), (l, v) => (S(), B("div", {
+      class: A(r.value),
+      style: Se(i.value)
     }, [
-      f.label ? (S(), C("label", Dt, Y(f.label), 1)) : T("", !0),
+      l.label ? (S(), B("label", Dt, Y(l.label), 1)) : z("", !0),
       F("div", xt, [
-        (S(!0), C(qe, null, Ie(Q(o), (h, c) => (S(), C("input", {
-          key: c,
-          value: d.value[c],
+        (S(!0), B(qe, null, Ie(l.length, (m, g) => (S(), B("input", {
+          key: g,
+          value: o.value[g],
           ref_for: !0,
           ref_key: "inputRefs",
-          ref: l,
+          ref: s,
           type: "text",
           maxlength: "1",
           class: "code-field__input",
-          disabled: f.disabled || f.loading,
-          onInput: (m) => k(m, c),
-          onKeydown: Ne((m) => v(m, c), ["backspace"]),
-          onPaste: (m) => _(m, c)
+          disabled: l.disabled || l.loading,
+          onInput: (d) => q(d, g),
+          onKeydown: Ne((d) => k(d, g), ["backspace"]),
+          onPaste: (d) => f(d, g)
         }, null, 40, jt))), 128))
       ]),
-      f.loading ? (S(), _e(Ot, {
+      l.loading ? (S(), _e(Ot, {
         key: 1,
         indeterminate: "",
         rounded: "",
-        color: f.color,
+        color: l.color,
         class: "code-field__loading"
-      }, null, 8, ["color"])) : T("", !0)
+      }, null, 8, ["color"])) : z("", !0)
     ], 6));
   }
-}), nn = /* @__PURE__ */ Z(It, [["__scopeId", "data-v-b6098eec"]]), an = le(
-  () => import("./AppButtonCopy-BAJDATwH.js")
+}), nn = /* @__PURE__ */ Z(It, [["__scopeId", "data-v-c6ed84b9"]]), an = le(
+  () => import("./AppButtonCopy-CKJG9x84.js")
 ), ln = le(
-  () => import("./AppSelect-CnoOOUQ9.js")
+  () => import("./AppSelect-CLC9ncKt.js")
 ), on = le(
-  () => import("./DropdownButton-BhopZ7Zq.js")
+  () => import("./DropdownButton-B1TfiIzK.js")
 );
 export {
   Zt as A,