@volverjs/ui-vue 0.0.1 → 0.0.3-beta.2

package/dist/components/index.es.js

@@ -1,21 +1,21 @@
-import { unref as l, computed as r, inject as je, toRef as kt, toRefs as F, defineComponent as D, useAttrs as ot, ref as H, openBlock as m, createElementBlock as _, normalizeClass as j, withModifiers as Fe, createElementVNode as O, renderSlot as C, normalizeProps as K, guardReactiveProps as te, createTextVNode as X, toDisplayString as R, isRef as Se, provide as At, watchEffect as We, Fragment as be, renderList as Ve, createBlock as B, mergeProps as E, withCtx as $e, resolveDynamicComponent as nt, createCommentVNode as w, useSlots as re, h as Q, watch as Ke, onMounted as ze, withDirectives as ye, vModelCheckbox as wt, createVNode as oe, withKeys as Qe, vModelText as st, Transition as It, toHandlers as Pt, vShow as Ot, vModelDynamic as Rt, vModelRadio as Et, vModelSelect as Dt } from "vue";
-import { useToggle as Lt, toReactive as Tt, useVModel as qe, useFocus as Bt, refDebounced as Nt, onClickOutside as rt } from "@vueuse/core";
-import { nanoid as ie } from "nanoid";
-import { iconExists as Pe, Icon as xt, addIcon as Ht } from "@iconify/vue";
-function me(t, a, e) {
-  return e ? Re(t, e) === Re(a, e) : Ue(t, a);
+import { unref as l, computed as u, inject as Ke, toRef as It, toRefs as W, defineComponent as D, useAttrs as st, ref as j, openBlock as m, createElementBlock as _, normalizeClass as F, withModifiers as We, createElementVNode as E, renderSlot as A, normalizeProps as K, guardReactiveProps as ee, createTextVNode as X, toDisplayString as L, isRef as $e, provide as Pt, watchEffect as ze, Fragment as ge, renderList as Ce, createBlock as T, mergeProps as R, withCtx as Ae, resolveDynamicComponent as rt, createCommentVNode as P, useSlots as he, h as Q, watch as ke, onMounted as Ot, withDirectives as Se, vModelCheckbox as Et, createVNode as le, vModelSelect as Rt, withKeys as tt, vModelText as it, Transition as Lt, toHandlers as Dt, vShow as Tt, vModelDynamic as Bt, vModelRadio as Nt } from "vue";
+import { useToggle as xt, toReactive as Ht, useVModel as qe, useFocus as Mt, useElementVisibility as ut, refDebounced as Gt, onClickOutside as dt } from "@vueuse/core";
+import { nanoid as de } from "nanoid";
+import { iconExists as Le, Icon as Ut, addIcon as jt } from "@iconify/vue";
+function be(t, a, e) {
+  return e ? Te(t, e) === Te(a, e) : Fe(t, a);
 }
-function Ue(t, a) {
+function Fe(t, a) {
   if (t === a)
     return !0;
   if (t && a && typeof t == "object" && typeof a == "object") {
     const e = Array.isArray(t), n = Array.isArray(a);
-    let o, u, s;
+    let o, i, s;
     if (e && n) {
-      if (u = t.length, u != a.length)
+      if (i = t.length, i != a.length)
         return !1;
-      for (o = u; o-- !== 0; )
-        if (!Ue(t[o], a[o]))
+      for (o = i; o-- !== 0; )
+        if (!Fe(t[o], a[o]))
           return !1;
       return !0;
     }
@@ -26,32 +26,32 @@ function Ue(t, a) {
       return !1;
     if (b && c)
       return t.getTime() == a.getTime();
-    const d = t instanceof RegExp, i = a instanceof RegExp;
-    if (d != i)
+    const d = t instanceof RegExp, r = a instanceof RegExp;
+    if (d != r)
       return !1;
-    if (d && i)
+    if (d && r)
       return t.toString() == a.toString();
-    const v = Object.keys(t);
-    if (u = v.length, u !== Object.keys(a).length)
+    const p = Object.keys(t);
+    if (i = p.length, i !== Object.keys(a).length)
       return !1;
-    for (o = u; o-- !== 0; )
-      if (!Object.prototype.hasOwnProperty.call(a, v[o]))
+    for (o = i; o-- !== 0; )
+      if (!Object.prototype.hasOwnProperty.call(a, p[o]))
         return !1;
-    for (o = u; o-- !== 0; )
-      if (s = v[o], !Ue(t[s], a[s]))
+    for (o = i; o-- !== 0; )
+      if (s = p[o], !Fe(t[s], a[s]))
         return !1;
     return !0;
   }
   return t !== t && a !== a;
 }
-function Re(t, a) {
+function Te(t, a) {
   if (t && Object.keys(t).length && a) {
     if (a.indexOf(".") === -1)
       return t[a];
     {
       const e = a.split(".");
       let n = t;
-      for (let o = 0, u = e.length; o < u; ++o) {
+      for (let o = 0, i = e.length; o < i; ++o) {
         if (t == null)
           return null;
         n = n[e[o]];
@@ -61,11 +61,11 @@ function Re(t, a) {
   } else
     return null;
 }
-function Mt(t, a) {
+function Ft(t, a) {
   let e = -1;
   if (a) {
     for (let n = 0; n < a.length; n++)
-      if (me(a[n], t)) {
+      if (be(a[n], t)) {
         e = n;
         break;
       }
@@ -75,43 +75,43 @@ function Mt(t, a) {
 function pe(t, a) {
   if (t != null && a && a.length) {
     for (const e of a)
-      if (me(t, e))
+      if (be(t, e))
         return !0;
   }
   return !1;
 }
-function ee(t) {
+function fe(t) {
   return ((a) => a == null || a === "" || Array.isArray(a) && a.length === 0 || !(a instanceof Date) && typeof a == "object" && Object.keys(a).length === 0)(l(t));
 }
-function Gt(t, a) {
-  const e = Mt(t, a);
+function Kt(t, a) {
+  const e = Ft(t, a);
   return e > -1 ? a.filter((n, o) => o !== e) : a;
 }
-function Ut(t) {
+function Wt(t) {
   return typeof t == "string" || t instanceof String;
 }
-function et(t) {
+function at(t) {
   var a, e;
   if (t)
     return (e = (a = t.match(
       /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
     )) == null ? void 0 : a.join("-")) == null ? void 0 : e.toLowerCase();
 }
-function x(t, a) {
+function G(t, a) {
   const e = { [`${t}`]: !0 };
   return {
-    bemCssClasses: r(() => Object.keys(a).reduce((o, u) => {
-      const s = l(a[u]) || !1;
+    bemCssClasses: u(() => Object.keys(a).reduce((o, i) => {
+      const s = l(a[i]) || !1;
       if (!s)
         return o;
-      if (u === "modifiers") {
+      if (i === "modifiers") {
         const b = Array.isArray(s) ? s : s.split(" ");
         return {
           ...o,
           ...b.reduce(
             (c, d) => ({
               ...c,
-              [`${t}--${et(d)}`]: !0
+              [`${t}--${at(d)}`]: !0
             }),
             {}
           )
@@ -119,17 +119,17 @@ function x(t, a) {
       } else
         return {
           ...o,
-          [`${t}--${et(u)}`]: s
+          [`${t}--${at(i)}`]: s
         };
     }, e) || {})
   };
 }
-function Ee(t) {
-  const a = je(t, void 0), e = r(() => !ee(a));
-  function n(o, u, s) {
+function Be(t) {
+  const a = Ke(t, void 0), e = u(() => !fe(a));
+  function n(o, i, s) {
     if (a != null && a.value) {
       const c = l(a.value)[o];
-      return r({
+      return u({
         get() {
           return c == null ? void 0 : c.value;
         },
@@ -138,8 +138,8 @@ function Ee(t) {
         }
       });
     }
-    const b = kt(u, o);
-    return r({
+    const b = It(i, o);
+    return u({
       get() {
         return b.value;
       },
@@ -154,7 +154,7 @@ function Ee(t) {
     getGroupOrLocalRef: n
   };
 }
-const it = "VV_BUTTON_GROUP", ut = "VV_RADIO_GROUP", dt = "VV_CHECK_GROUP", ct = "VV_ACCORDION_GROUP", jt = {
+const ct = "VV_BUTTON_GROUP", vt = "VV_RADIO_GROUP", pt = "VV_CHECK_GROUP", ft = "VV_ACCORDION_GROUP", zt = {
   name: String,
   title: String,
   content: String,
@@ -164,99 +164,99 @@ const it = "VV_BUTTON_GROUP", ut = "VV_RADIO_GROUP", dt = "VV_CHECK_GROUP", ct =
   },
   modifiers: [String, Array],
   disabled: Boolean
-}, Ft = ["update:modelValue"];
-function Wt(t, a) {
-  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Ee(ct), { title: u, content: s } = F(t), b = o("modelValue", t, a), c = o("disabled", t), d = o("collapse", t), i = o("modifiers", t);
+}, qt = ["update:modelValue"];
+function Xt(t, a) {
+  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Be(ft), { title: i, content: s } = W(t), b = o("modelValue", t, a), c = o("disabled", t), d = o("collapse", t), r = o("modifiers", t);
   return {
     modelValue: b,
     disabled: c,
     isInGroup: n,
     group: e,
     collapse: d,
-    modifiers: i,
-    title: u,
+    modifiers: r,
+    title: i,
     content: s
   };
 }
-const Kt = ["id", "open"], zt = ["aria-controls", "aria-expanded"], qt = ["aria-hidden"], Xt = {
+const Zt = ["id", "open"], Yt = ["aria-controls", "aria-expanded"], Jt = ["aria-hidden"], Qt = {
   name: "VvAccordion"
-}, Zt = /* @__PURE__ */ D({
-  ...Xt,
-  props: jt,
-  emits: Ft,
+}, ea = /* @__PURE__ */ D({
+  ...Qt,
+  props: zt,
+  emits: qt,
   setup(t, { emit: a }) {
-    const e = t, n = ot(), o = e.name || (n == null ? void 0 : n.id) || ie(), {
-      modifiers: u,
+    const e = t, n = st(), o = e.name || (n == null ? void 0 : n.id) || de(), {
+      modifiers: i,
       title: s,
       content: b,
       disabled: c,
       collapse: d,
-      modelValue: i,
-      isInGroup: v
-    } = Wt(e, a), p = H(!1), g = r({
-      get: () => v.value ? d.value && Array.isArray(i.value) ? i.value.includes(o) : i.value === o : i.value === void 0 ? p.value : i.value,
+      modelValue: r,
+      isInGroup: p
+    } = Xt(e, a), v = j(!1), g = u({
+      get: () => p.value ? d.value && Array.isArray(r.value) ? r.value.includes(o) : r.value === o : r.value === void 0 ? v.value : r.value,
       set: (f) => {
-        if (v.value) {
-          if (d.value && Array.isArray(i.value)) {
+        if (p.value) {
+          if (d.value && Array.isArray(r.value)) {
             if (f) {
-              i.value.push(o);
+              r.value.push(o);
               return;
             }
-            i.value = i.value.filter(
+            r.value = r.value.filter(
               (V) => V !== o
             );
             return;
           }
-          i.value = f ? o : null;
+          r.value = f ? o : null;
           return;
         }
-        if (i.value === void 0 && typeof f == "boolean") {
-          p.value = f;
+        if (r.value === void 0 && typeof f == "boolean") {
+          v.value = f;
           return;
         }
-        i.value = f;
+        r.value = f;
       }
-    }), { bemCssClasses: h } = x("vv-accordion", {
-      modifiers: u,
+    }), { bemCssClasses: h } = G("vv-accordion", {
+      modifiers: i,
       disabled: c
-    }), y = Lt(g);
+    }), y = xt(g);
     return (f, V) => (m(), _("details", {
       id: l(o),
-      class: j(l(h)),
+      class: F(l(h)),
       open: l(g),
-      onClick: V[0] || (V[0] = Fe((I) => l(y)(), ["prevent"]))
+      onClick: V[0] || (V[0] = We((I) => l(y)(), ["prevent"]))
     }, [
-      O("summary", {
+      E("summary", {
         "aria-controls": l(o),
         "aria-expanded": l(g),
         class: "vv-collapse__summary"
       }, [
-        C(f.$slots, "summary", K(te({ open: l(g) })), () => [
-          X(R(l(s)), 1)
+        A(f.$slots, "summary", K(ee({ open: l(g) })), () => [
+          X(L(l(s)), 1)
         ])
-      ], 8, zt),
-      O("div", {
+      ], 8, Yt),
+      E("div", {
         "aria-hidden": !l(g),
         class: "vv-collapse__content"
       }, [
-        C(f.$slots, "details", K(te({ open: l(g) })), () => [
-          X(R(l(b)), 1)
+        A(f.$slots, "details", K(ee({ open: l(g) })), () => [
+          X(L(l(b)), 1)
         ])
-      ], 8, qt)
-    ], 10, Kt));
+      ], 8, Jt)
+    ], 10, Zt));
   }
 });
-function De(t) {
+function Ne(t) {
   if (Object.keys(t).some(
-    (a) => a !== "key" && !Se(t[a])
+    (a) => a !== "key" && !$e(t[a])
   ))
     throw Error("One or more groupState props aren't ref.");
-  At(
+  Pt(
     t.key,
-    r(() => t)
+    u(() => t)
   );
 }
-const Yt = {
+const ta = {
   modelValue: [String, Array],
   items: { type: Array, default: () => [] },
   collapse: Boolean,
@@ -266,196 +266,204 @@ const Yt = {
     default: ""
   },
   disabled: Boolean
-}, Jt = ["update:modelValue"], Qt = {
+}, aa = ["update:modelValue"], la = {
   name: "VvAccordionGroup"
-}, Wl = /* @__PURE__ */ D({
-  ...Qt,
-  props: Yt,
-  emits: Jt,
+}, Ql = /* @__PURE__ */ D({
+  ...la,
+  props: ta,
+  emits: aa,
   setup(t, { emit: a }) {
-    const e = t, { disabled: n, collapse: o, modifiers: u, itemModifiers: s, items: b } = F(e);
-    We(() => {
+    const e = t, { disabled: n, collapse: o, modifiers: i, itemModifiers: s, items: b } = W(e);
+    ze(() => {
       typeof e.modelValue == "string" && o.value && console.warn(
         "[VvAccordionGroup]: modelValue is a string but collapse is true."
       );
     });
-    const c = H([]), d = r({
+    const c = j([]), d = u({
       get: () => {
-        var p;
-        return e.modelValue !== void 0 ? o.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue : o.value ? c.value : (p = c.value) == null ? void 0 : p[0];
+        var v;
+        return e.modelValue !== void 0 ? o.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue : o.value ? c.value : (v = c.value) == null ? void 0 : v[0];
       },
-      set: (p) => {
+      set: (v) => {
         if (e.modelValue !== void 0)
-          return (Array.isArray(e.modelValue) || o.value) && !Array.isArray(p) && (p = [p]), a("update:modelValue", p);
-        c.value = Array.isArray(p) ? p : [p];
+          return (Array.isArray(e.modelValue) || o.value) && !Array.isArray(v) && (v = [v]), a("update:modelValue", v);
+        c.value = Array.isArray(v) ? v : [v];
       }
     });
-    De({
-      key: ct,
+    Ne({
+      key: ft,
       modelValue: d,
       disabled: n,
       collapse: o,
       modifiers: s
     });
-    const { bemCssClasses: v } = x("vv-accordion-group", {
-      modifiers: u,
+    const { bemCssClasses: p } = G("vv-accordion-group", {
+      modifiers: i,
       disabled: n
     });
-    return (p, g) => (m(), _("div", {
-      class: j(l(v))
+    return (v, g) => (m(), _("div", {
+      class: F(l(p))
     }, [
-      C(p.$slots, "default", {}, () => [
-        (m(!0), _(be, null, Ve(l(b), (h) => (m(), B(Zt, E({
+      A(v.$slots, "default", {}, () => [
+        (m(!0), _(ge, null, Ce(l(b), (h) => (m(), T(ea, R({
           key: h.title
         }, {
           name: h.name,
           title: h.title,
           content: h.content
         }), {
-          header: $e((y) => [
-            C(p.$slots, `header::${h.name}`, K(te(y)))
+          header: Ae((y) => [
+            A(v.$slots, `header::${h.name}`, K(ee(y)))
           ]),
-          details: $e((y) => [
-            C(p.$slots, `details::${h.name}`, K(te(y)))
+          details: Ae((y) => [
+            A(v.$slots, `details::${h.name}`, K(ee(y)))
           ]),
           _: 2
         }, 1040))), 128))
       ])
     ], 2));
   }
-}), Ce = {
+}), we = {
   valid: Boolean,
   validLabel: [String, Array]
-}, ke = {
+}, Ie = {
   invalid: Boolean,
   invalidLabel: [String, Array]
 }, Xe = {
   loading: Boolean,
   loadingLabel: String
-}, ge = {
+}, ye = {
   disabled: Boolean
-}, Ae = {
+}, Pe = {
   readonly: Boolean
-}, ue = {
+}, ce = {
   modifiers: [String, Array]
-}, we = {
+}, Oe = {
   hintLabel: { type: String, default: "" }
-}, Le = {
+}, xe = {
   options: {
     type: Array,
     default: () => []
   },
   labelKey: { type: [String, Function], default: "label" },
   valueKey: { type: [String, Function], default: "value" }
-}, ea = {
+}, oa = {
   count: {
     type: [Boolean, String],
     default: !1,
     validator: (t) => [!0, !1, "limit", "countdown"].includes(t)
   }
-}, ta = {
+}, na = {
   debounce: [Number, String]
-}, tt = {
+}, lt = {
   LEFT: "left",
   RIGHT: "right"
 }, Ze = {
   icon: { type: [String, Object] },
   iconPosition: {
     type: String,
-    validation: (t) => Object.values(tt).includes(t),
-    default: tt.RIGHT
+    validation: (t) => Object.values(lt).includes(t),
+    default: lt.RIGHT
   }
-}, Te = {
+}, He = {
   tabindex: { type: [String, Number], default: 0 }
 }, Ye = {
+  floating: Boolean
+}, Me = {
+  unselectable: { type: Boolean, default: !0 }
+}, Ee = {
   id: [String, Number],
   name: { type: String, required: !0 }
-}, vt = {
-  ...Ye,
-  ...Te,
-  ...ge,
-  ...Ae,
-  ...Ce,
-  ...ke,
+}, mt = {
+  autofocus: Boolean
+}, bt = {
+  autocomplete: { type: String, default: "off" }
+}, gt = {
+  ...Ee,
+  ...mt,
+  ...bt,
+  ...He,
+  ...ye,
+  ...Pe,
   ...we,
+  ...Ie,
+  ...Oe,
   ...Xe,
-  ...ue,
-  ...ea,
-  ...ta,
+  ...ce,
+  ...oa,
+  ...na,
   ...Ze,
-  autofocus: Boolean,
-  autocomplete: { type: String, default: "off" },
+  ...Ye,
   minlength: Number,
   maxlength: Number,
   placeholder: String,
   required: Boolean,
-  label: String,
-  floating: Boolean
-}, pt = {
-  ...Ye,
-  ...Te,
-  ...Ce,
-  ...ke,
+  label: String
+}, ht = {
+  ...Ee,
+  ...He,
   ...we,
-  ...ge,
-  ...Ae,
+  ...Ie,
+  ...Oe,
+  ...ye,
+  ...Pe,
   value: [String, Number, Boolean],
   modelValue: [Object, Number, Boolean, String],
   label: String
-}, ft = {
-  ...Ce,
-  ...ke,
-  ...Le,
+}, yt = {
   ...we,
-  ...ge,
-  ...Ae,
+  ...Ie,
+  ...xe,
+  ...Oe,
+  ...ye,
+  ...Pe,
   modelValue: [String, Array],
   label: String,
   name: { type: String, required: !0 },
   vertical: Boolean
-}, aa = {
-  ...ue,
+}, sa = {
+  ...ce,
   value: [String, Number]
-}, la = {
+}, ra = {
   name: "VvBadge"
-}, Kl = /* @__PURE__ */ D({
-  ...la,
-  props: aa,
+}, eo = /* @__PURE__ */ D({
+  ...ra,
+  props: sa,
   setup(t) {
-    const a = t, { bemCssClasses: e } = x("vv-badge", {
+    const a = t, { bemCssClasses: e } = G("vv-badge", {
       modifiers: a.modifiers
     });
     return (n, o) => (m(), _("span", {
-      class: j(l(e)),
+      class: F(l(e)),
       role: "status"
     }, [
-      C(n.$slots, "default", {}, () => [
-        X(R(n.value), 1)
+      A(n.$slots, "default", {}, () => [
+        X(L(n.value), 1)
       ])
     ], 2));
   }
-}), oa = {
-  ...ue,
+}), ia = {
+  ...ce,
   routes: Array
-}, na = { class: "vv-breadcrumb__list" }, sa = ["content"], ra = {
+}, ua = { class: "vv-breadcrumb__list" }, da = ["content"], ca = {
   name: "VvBreadcrumb"
-}, zl = /* @__PURE__ */ D({
-  ...ra,
-  props: oa,
+}, to = /* @__PURE__ */ D({
+  ...ca,
+  props: ia,
   setup(t) {
-    const a = t, { bemCssClasses: e } = x("vv-breadcrumb", {
+    const a = t, { bemCssClasses: e } = G("vv-breadcrumb", {
       modifiers: a.modifiers
     });
     return (n, o) => (m(), _("nav", {
-      class: j(l(e)),
+      class: F(l(e)),
       "aria-label": "breadcrumbs"
     }, [
-      O("ol", na, [
-        (m(!0), _(be, null, Ve(n.routes, (u, s) => {
-          var b, c, d, i;
+      E("ol", ua, [
+        (m(!0), _(ge, null, Ce(n.routes, (i, s) => {
+          var b, c, d, r;
           return m(), _("li", {
-            key: `${u.label}-${s}`,
-            class: j({
+            key: `${i.label}-${s}`,
+            class: F({
               "vv-breadcrumb__item": s < Number((b = n.routes) == null ? void 0 : b.length) - 1,
               "vv-breadcrumb__item-active": s === Number((c = n.routes) == null ? void 0 : c.length) - 1
             }),
@@ -463,30 +471,30 @@ const Yt = {
             itemtype: "https://schema.org/ListItem",
             itemscope: ""
           }, [
-            (m(), B(nt(u.to ? "router-link" : u.href ? "a" : "span"), E(u, {
+            (m(), T(rt(i.to ? "router-link" : i.href ? "a" : "span"), R(i, {
               class: {
                 "vv-breadcrumb__link": s < Number((d = n.routes) == null ? void 0 : d.length) - 1
               },
-              "aria-current": s === Number((i = n.routes) == null ? void 0 : i.length) - 1 ? "page" : void 0,
+              "aria-current": s === Number((r = n.routes) == null ? void 0 : r.length) - 1 ? "page" : void 0,
               itemprop: "item"
             }), {
-              default: $e(() => [
-                C(n.$slots, "label", K(te({ route: u, index: s })), () => [
-                  X(R(u.label), 1)
+              default: Ae(() => [
+                A(n.$slots, "label", K(ee({ route: i, index: s })), () => [
+                  X(L(i.label), 1)
                 ])
               ]),
               _: 2
             }, 1040, ["class", "aria-current"])),
-            O("meta", {
+            E("meta", {
               itemprop: "position",
               content: `${s + 1}`
-            }, null, 8, sa)
+            }, null, 8, da)
           ], 2);
         }), 128))
       ])
     ], 2));
   }
-}), mt = "ds", ia = {
+}), _t = "ds", va = {
   color: String,
   width: {
     type: [String, Number]
@@ -517,63 +525,64 @@ const Yt = {
   modifiers: {
     type: [String, Array]
   }
-}, ua = {
+}, pa = {
   name: "VvIcon"
 }, M = /* @__PURE__ */ D({
-  ...ua,
-  props: ia,
+  ...pa,
+  props: va,
   setup(t) {
-    const a = t, e = H(!0), { modifiers: n } = F(a), o = je(mt), { bemCssClasses: u } = x("vv-icon", {
+    const a = t, e = j(!0), { modifiers: n } = W(a), o = Ke(_t), { bemCssClasses: i } = G("vv-icon", {
       modifiers: n
-    }), s = r(() => a.provider || (o == null ? void 0 : o.provider)), b = r(() => {
-      const i = a.name ?? "", v = `@${s.value}:${a.prefix}:${a.name}`;
-      return Pe(i) ? i : Pe(v) ? v : (o == null ? void 0 : o.iconsCollections.find((p) => {
-        const g = `@${s.value}:${p.prefix}:${i}`;
-        if (Pe(g))
+    }), s = u(() => a.provider || (o == null ? void 0 : o.provider)), b = u(() => {
+      const r = a.name ?? "", p = `@${s.value}:${a.prefix}:${a.name}`;
+      return Le(r) ? r : Le(p) ? p : (o == null ? void 0 : o.iconsCollections.find((v) => {
+        const g = `@${s.value}:${v.prefix}:${r}`;
+        if (Le(g))
           return g;
-      })) || i;
+      })) || r;
     });
-    function c(i) {
-      let v = null;
+    function c(r) {
+      let p = null;
       if (typeof window > "u") {
         const { JSDOM: y } = require("jsdom");
-        v = new y().window;
+        p = new y().window;
       }
-      return (v ? new v.DOMParser() : new window.DOMParser()).parseFromString(i, "text/html").querySelector("svg");
+      return (p ? new p.DOMParser() : new window.DOMParser()).parseFromString(r, "text/html").querySelector("svg");
     }
-    function d(i) {
-      const v = c(i), p = (v == null ? void 0 : v.innerHTML.trim()) || "";
-      v && p && Ht(`@${s.value}:${a.prefix}:${a.name}`, {
-        body: p,
-        height: v.viewBox.baseVal.height,
-        width: v.viewBox.baseVal.width
+    function d(r) {
+      const p = c(r), v = (p == null ? void 0 : p.innerHTML.trim()) || "";
+      p && v && jt(`@${s.value}:${a.prefix}:${a.name}`, {
+        body: v,
+        height: p.viewBox.baseVal.height,
+        width: p.viewBox.baseVal.width
       });
     }
-    return o && (a.src && !Pe(`@${s.value}:${a.prefix}:${a.name}`) ? (e.value = !1, o.fetchIcon(a.src).then((i) => {
-      i && (d(i), e.value = !0);
-    }).catch((i) => {
-      throw new Error(`During fetch icon: ${i == null ? void 0 : i.message}`);
-    })) : a.svg && d(a.svg)), (i, v) => e.value ? (m(), B(l(xt), E({
+    return o && (a.src && !Le(`@${s.value}:${a.prefix}:${a.name}`) ? (e.value = !1, o.fetchIcon(a.src).then((r) => {
+      r && (d(r), e.value = !0);
+    }).catch((r) => {
+      throw new Error(`During fetch icon: ${r == null ? void 0 : r.message}`);
+    })) : a.svg && d(a.svg)), (r, p) => e.value ? (m(), T(l(Ut), R({
       key: 0,
-      class: l(u)
+      class: l(i)
     }, {
-      inline: i.inline,
-      width: i.width,
-      height: i.height,
-      horizontalFlip: i.horizontalFlip,
-      verticalFlip: i.verticalFlip,
-      flip: i.flip,
-      rotate: i.rotate,
-      color: i.color,
-      onLoad: i.onLoad,
+      inline: r.inline,
+      width: r.width,
+      height: r.height,
+      horizontalFlip: r.horizontalFlip,
+      verticalFlip: r.verticalFlip,
+      flip: r.flip,
+      rotate: r.rotate,
+      color: r.color,
+      onLoad: r.onLoad,
       icon: l(b)
-    }), null, 16, ["class"])) : w("", !0);
+    }), null, 16, ["class"])) : P("", !0);
   }
 });
-var _e = /* @__PURE__ */ ((t) => (t.left = "left", t.right = "right", t.top = "top", t.bottom = "bottom", t))(_e || {}), bt = /* @__PURE__ */ ((t) => (t.button = "button", t.submit = "submit", t.reset = "reset", t))(bt || {}), se = /* @__PURE__ */ ((t) => (t.nuxtLink = "nuxt-link", t.routerLink = "router-link", t.a = "a", t.button = "button", t))(se || {}), gt = /* @__PURE__ */ ((t) => (t._blank = "_blank", t._self = "_self", t._parent = "_parent", t._top = "_top", t))(gt || {});
-const da = ["update:modelValue"], ca = {
-  ...ue,
-  ...ge,
+var Ve = /* @__PURE__ */ ((t) => (t.left = "left", t.right = "right", t.top = "top", t.bottom = "bottom", t))(Ve || {}), St = /* @__PURE__ */ ((t) => (t.button = "button", t.submit = "submit", t.reset = "reset", t))(St || {}), ue = /* @__PURE__ */ ((t) => (t.nuxtLink = "nuxt-link", t.routerLink = "router-link", t.a = "a", t.button = "button", t))(ue || {}), Vt = /* @__PURE__ */ ((t) => (t._blank = "_blank", t._self = "_self", t._parent = "_parent", t._top = "_top", t))(Vt || {});
+const fa = ["update:modelValue"], ma = {
+  ...ce,
+  ...ye,
+  ...Me,
   icon: {
     type: [String, Object],
     default: ""
@@ -581,7 +590,7 @@ const da = ["update:modelValue"], ca = {
   iconPosition: {
     type: String,
     default: "left",
-    validator: (t) => t in _e
+    validator: (t) => t in Ve
   },
   label: [String, Number],
   loading: Boolean,
@@ -596,7 +605,7 @@ const da = ["update:modelValue"], ca = {
   href: String,
   target: {
     type: String,
-    validator: (t) => t in gt
+    validator: (t) => t in Vt
   },
   active: Boolean,
   pressed: Boolean,
@@ -607,301 +616,307 @@ const da = ["update:modelValue"], ca = {
   type: {
     type: String,
     default: "button",
-    validator: (t) => t in bt
+    validator: (t) => t in St
   },
   toggle: {
     type: Boolean,
     default: !1
   },
-  modelValue: String,
-  unselectable: { type: Boolean, default: !0 }
+  modelValue: String
 };
-function va(t, a) {
-  var y;
-  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Ee(it), { iconPosition: u, icon: s, label: b, pressed: c } = F(t), d = o("modelValue", t, a), i = o("disabled", t), v = o("toggle", t), p = o(
+function ba(t, a) {
+  var f;
+  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Be(ct), {
+    iconPosition: i,
+    icon: s,
+    label: b,
+    pressed: c,
+    modifiers: d
+  } = W(t), r = o("modelValue", t, a), p = o("disabled", t), v = o("toggle", t), g = o(
     "unselectable",
     t
-  ), g = o("modifiers", t), h = ((y = e == null ? void 0 : e.value) == null ? void 0 : y.multiple) ?? H(!1);
+  ), h = ((f = e == null ? void 0 : e.value) == null ? void 0 : f.multiple) ?? j(!1), y = u(() => {
+    var $;
+    const V = d != null && d.value ? Array.isArray(d.value) ? d.value : [d.value] : [], I = ($ = e == null ? void 0 : e.value.itemModifiers) != null && $.value ? Array.isArray(e.value.itemModifiers.value) ? e.value.itemModifiers.value : [e.value.itemModifiers.value] : [];
+    return [...V, ...I];
+  });
   return {
-    modelValue: d,
-    disabled: i,
-    toggle: v,
-    isInGroup: n,
     group: e,
-    modifiers: g,
+    isInGroup: n,
+    modelValue: r,
+    disabled: p,
+    toggle: v,
+    unselectable: g,
     multiple: h,
-    unselectable: p,
+    modifiers: y,
     pressed: c,
-    iconPosition: u,
+    iconPosition: i,
     icon: s,
     label: b
   };
 }
-const pa = {
+const ga = {
   key: 1,
   class: "vv-button__label"
-}, fa = {
+}, ha = {
   key: 1,
   class: "vv-button__label"
-}, ma = {
+}, ya = {
   name: "VvButton"
-}, ql = /* @__PURE__ */ D({
-  ...ma,
-  props: ca,
-  emits: da,
+}, ao = /* @__PURE__ */ D({
+  ...ya,
+  props: ma,
+  emits: fa,
   setup(t, { emit: a }) {
-    const e = t, n = ot(), o = re(), u = (n == null ? void 0 : n.name) || ie(), {
+    const e = t, n = st(), o = he(), i = (n == null ? void 0 : n.name) || de(), {
       modifiers: s,
       iconPosition: b,
       icon: c,
       label: d,
-      modelValue: i,
-      disabled: v,
-      toggle: p,
+      modelValue: r,
+      disabled: p,
+      toggle: v,
       unselectable: g
-    } = va(e, a), h = je(mt), y = r(() => {
+    } = ba(e, a), h = Ke(_t), y = u(() => {
       switch (!0) {
-        case v.value:
-          return se.button;
+        case p.value:
+          return ue.button;
         case e.to !== void 0:
-          return h != null && h.nuxt ? se.nuxtLink : se.routerLink;
+          return h != null && h.nuxt ? ue.nuxtLink : ue.routerLink;
         case e.href !== void 0:
-          return se.a;
+          return ue.a;
         default:
-          return se.button;
+          return ue.button;
       }
-    }), f = r(() => p.value ? Array.isArray(i.value) ? pe(u, i.value) : me(u, i.value) : e.pressed), { bemCssClasses: V } = x("vv-button", {
+    }), f = u(() => v.value ? Array.isArray(r.value) ? pe(i, r.value) : be(i, r.value) : e.pressed), { bemCssClasses: V } = G("vv-button", {
       modifiers: s,
       active: e.active,
       pressed: f,
-      disabled: v,
-      reverse: r(
-        () => [_e.right, _e.bottom].includes(
+      disabled: p,
+      reverse: u(
+        () => [Ve.right, Ve.bottom].includes(
           b.value
         )
       ),
-      column: r(
-        () => [_e.top, _e.bottom].includes(
+      column: u(
+        () => [Ve.top, Ve.bottom].includes(
           b.value
         )
       ),
-      iconOnly: r(
+      iconOnly: u(
         () => (c == null ? void 0 : c.value) && !(d != null && d.value) && !o.default
       )
-    }), I = r(
+    }), I = u(
       () => typeof (c == null ? void 0 : c.value) == "string" ? { name: c == null ? void 0 : c.value } : c == null ? void 0 : c.value
-    ), A = r(() => {
-      const $ = {
+    ), $ = u(() => {
+      const C = {
         class: V.value,
         "aria-pressed": f.value ? !0 : void 0
       };
       switch (y.value) {
-        case se.a:
+        case ue.a:
           return {
-            ...$,
+            ...C,
             role: "button",
             href: e.href,
             target: e.target,
             rel: e.rel
           };
-        case se.routerLink:
-        case se.nuxtLink:
+        case ue.routerLink:
+        case ue.nuxtLink:
           return {
-            ...$,
+            ...C,
             role: "button",
             to: e.to,
             target: e.target
           };
         default:
           return {
-            ...$,
+            ...C,
             type: e.type,
-            disabled: v.value
+            disabled: p.value
           };
       }
-    }), T = () => {
-      if (p.value) {
-        if (Array.isArray(i.value)) {
-          if (pe(u, i.value)) {
-            g.value && (i.value = i.value.filter(
-              ($) => $ !== u
+    }), x = () => {
+      if (v.value) {
+        if (Array.isArray(r.value)) {
+          if (pe(i, r.value)) {
+            g.value && (r.value = r.value.filter(
+              (C) => C !== i
             ));
             return;
           }
-          i.value.push(u);
+          r.value.push(i);
           return;
         }
-        if (me(u, i.value) && g.value) {
-          i.value = void 0;
+        if (be(i, r.value) && g.value) {
+          r.value = void 0;
           return;
         }
-        i.value = u;
+        r.value = i;
       }
     };
-    return ($, G) => (m(), B(nt(l(y)), E(l(A), { onClickPassive: T }), {
-      default: $e(() => [
-        C($.$slots, "default", {}, () => [
-          $.loading ? C($.$slots, "loading", { key: 0 }, () => [
-            $.loadingIcon ? (m(), B(M, {
+    return (C, H) => (m(), T(rt(l(y)), R(l($), { onClickPassive: x }), {
+      default: Ae(() => [
+        A(C.$slots, "default", {}, () => [
+          C.loading ? A(C.$slots, "loading", { key: 0 }, () => [
+            C.loadingIcon ? (m(), T(M, {
               key: 0,
               class: "vv-button__loading-icon",
-              name: $.loadingIcon
-            }, null, 8, ["name"])) : w("", !0),
-            $.loadingLabel ? (m(), _("span", pa, R($.loadingLabel), 1)) : w("", !0)
-          ]) : (m(), _(be, { key: 1 }, [
-            C($.$slots, "before"),
-            l(c) ? (m(), B(M, E({
+              name: C.loadingIcon
+            }, null, 8, ["name"])) : P("", !0),
+            C.loadingLabel ? (m(), _("span", ga, L(C.loadingLabel), 1)) : P("", !0)
+          ]) : (m(), _(ge, { key: 1 }, [
+            A(C.$slots, "before"),
+            l(c) ? (m(), T(M, R({
               key: 0,
               class: "vv-button__icon"
-            }, l(I)), null, 16)) : w("", !0),
-            l(d) ? (m(), _("span", fa, [
-              C($.$slots, "label", {}, () => [
-                X(R(l(d)), 1)
+            }, l(I)), null, 16)) : P("", !0),
+            l(d) ? (m(), _("span", ha, [
+              A(C.$slots, "label", {}, () => [
+                X(L(l(d)), 1)
               ])
-            ])) : w("", !0),
-            C($.$slots, "after")
+            ])) : P("", !0),
+            A(C.$slots, "after")
           ], 64))
         ])
       ]),
       _: 3
     }, 16));
   }
-}), ba = {
-  ...ue,
-  ...ge,
-  itemModifiers: {
-    type: [String, Array],
-    default: ""
-  },
+}), _a = {
+  ...ce,
+  ...ye,
+  ...Me,
+  itemModifiers: { type: [String, Array], default: void 0 },
   toggle: { type: Boolean, default: !1 },
   multiple: { type: Boolean, default: !1 },
-  unselectable: { type: Boolean, default: !0 },
   modelValue: { type: [String, Array], default: void 0 }
-}, ga = ["update:modelValue"], ha = {
+}, Sa = ["update:modelValue"], Va = {
   name: "VvButtonGroup"
-}, Xl = /* @__PURE__ */ D({
-  ...ha,
-  props: ba,
-  emits: ga,
+}, lo = /* @__PURE__ */ D({
+  ...Va,
+  props: _a,
+  emits: Sa,
   setup(t, { emit: a }) {
     const e = t, {
       disabled: n,
       toggle: o,
-      modifiers: u,
+      modifiers: i,
       multiple: s,
       unselectable: b,
       itemModifiers: c
-    } = F(e);
-    We(() => {
+    } = W(e);
+    ze(() => {
       typeof e.modelValue == "string" && s.value && console.warn(
         "[VvButtonGroup]: modelValue is a string but multiple is true."
       );
     });
-    const d = r({
+    const d = u({
       get: () => s.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue,
-      set: (p) => (p !== void 0 && (Array.isArray(e.modelValue) || s.value) && !Array.isArray(p) && (p = [p]), a("update:modelValue", p))
+      set: (v) => (v !== void 0 && (Array.isArray(e.modelValue) || s.value) && !Array.isArray(v) && (v = [v]), a("update:modelValue", v))
     });
-    De({
-      key: it,
+    Ne({
+      key: ct,
       modelValue: d,
       disabled: n,
       toggle: o,
       multiple: s,
       unselectable: b,
-      modifiers: c
+      itemModifiers: c
     });
-    const { bemCssClasses: v } = x("vv-button-group", {
-      modifiers: u
+    const { bemCssClasses: p } = G("vv-button-group", {
+      modifiers: i
     });
-    return (p, g) => (m(), _("div", {
-      class: j(l(v)),
+    return (v, g) => (m(), _("div", {
+      class: F(l(p)),
       role: "group"
     }, [
-      C(p.$slots, "default")
+      A(v.$slots, "default")
     ], 2));
   }
-}), ya = {
+}), $a = {
   title: String,
   modifiers: [String, Array]
-}, _a = {
+}, Ca = {
   key: 0,
   class: "vv-card__header"
-}, Sa = {
+}, Aa = {
   key: 1,
   class: "vv-card__content"
-}, Va = {
+}, ka = {
   key: 2,
   class: "vv-card__footer"
-}, $a = {
+}, wa = {
   name: "VvCard"
-}, Zl = /* @__PURE__ */ D({
-  ...$a,
-  props: ya,
+}, oo = /* @__PURE__ */ D({
+  ...wa,
+  props: $a,
   setup(t) {
-    const a = t, { bemCssClasses: e } = x("vv-card", {
+    const a = t, { bemCssClasses: e } = G("vv-card", {
       modifiers: a.modifiers
     });
     return (n, o) => (m(), _("article", {
-      class: j(l(e))
+      class: F(l(e))
     }, [
-      n.$slots.header || n.title ? (m(), _("header", _a, [
-        C(n.$slots, "header", {}, () => [
-          X(R(n.title), 1)
+      n.$slots.header || n.title ? (m(), _("header", Ca, [
+        A(n.$slots, "header", {}, () => [
+          X(L(n.title), 1)
         ])
-      ])) : w("", !0),
-      C(n.$slots, "default"),
-      n.$slots.content ? (m(), _("div", Sa, [
-        C(n.$slots, "content")
-      ])) : w("", !0),
-      n.$slots.footer ? (m(), _("footer", Va, [
-        C(n.$slots, "footer")
-      ])) : w("", !0)
+      ])) : P("", !0),
+      A(n.$slots, "default"),
+      n.$slots.content ? (m(), _("div", Aa, [
+        A(n.$slots, "content")
+      ])) : P("", !0),
+      n.$slots.footer ? (m(), _("footer", ka, [
+        A(n.$slots, "footer")
+      ])) : P("", !0)
     ], 2));
   }
-}), Ca = {
-  ...pt,
+}), Ia = {
+  ...ht,
   indeterminate: Boolean,
   uncheckedValue: [String, Number, Boolean],
   switch: Boolean
-}, ka = ["click", "update:modelValue", "change", "blur"];
-function Aa(t, a) {
-  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Ee(dt), { switch: u, indeterminate: s } = F(t), b = o("modelValue", t, a), c = o("readonly", t), d = o("disabled", t), i = o("valid", t), v = o("invalid", t);
+}, Pa = ["click", "update:modelValue", "change", "blur"];
+function Oa(t, a) {
+  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Be(pt), { switch: i, indeterminate: s } = W(t), b = o("modelValue", t, a), c = o("readonly", t), d = o("disabled", t), r = o("valid", t), p = o("invalid", t);
   return {
-    propsSwitch: u,
+    propsSwitch: i,
     indeterminate: s,
     group: e,
     isInGroup: n,
     modelValue: b,
     readonly: c,
     disabled: d,
-    valid: i,
-    invalid: v
+    valid: r,
+    invalid: p
   };
 }
-function Oe(t) {
-  return Array.isArray(t) ? t.filter((a) => Ut(a)).join(" ") : t;
+function De(t) {
+  return Array.isArray(t) ? t.filter((a) => Wt(a)).join(" ") : t;
 }
-function he(t, a) {
+function _e(t, a) {
   const {
     invalid: e,
     valid: n,
     hint: o,
-    loading: u
+    loading: i
   } = a, {
     hintLabel: s,
     modelValue: b,
     valid: c,
     validLabel: d,
-    invalid: i,
-    invalidLabel: v,
-    ...p
-  } = F(t), g = Re(p, "loading"), h = Re(p, "loadingLabel"), y = r(() => i.value ? !!(i.value && e || v != null && v.value && Array.isArray(v.value) && v.value.length > 0 || v != null && v.value && !ee(v)) : !1), f = r(
+    invalid: r,
+    invalidLabel: p,
+    ...v
+  } = W(t), g = Te(v, "loading"), h = Te(v, "loadingLabel"), y = u(() => r.value ? !!(r.value && e || p != null && p.value && Array.isArray(p.value) && p.value.length > 0 || p != null && p.value && !fe(p)) : !1), f = u(
     () => !!(s && s.value || o)
-  ), V = r(
+  ), V = u(
     () => !!(d && d.value || n)
-  ), I = r(
-    () => !!(g != null && g.value && u || g != null && g.value && (h != null && h.value))
-  ), A = r(
+  ), I = u(
+    () => !!(g != null && g.value && i || g != null && g.value && (h != null && h.value))
+  ), $ = u(
     () => f.value || V.value || y.value || I.value
   );
   return {
@@ -917,26 +932,26 @@ function he(t, a) {
           default: () => ({})
         }
       },
-      setup(T) {
-        const $ = r(() => {
-          const G = Tt({
+      setup(x) {
+        const C = u(() => {
+          const H = Ht({
             hintLabel: s,
             modelValue: b,
             valid: c,
             validLabel: d,
-            invalid: i,
-            invalidLabel: v,
+            invalid: r,
+            invalidLabel: p,
             loading: g,
             loadingLabel: h,
-            ...T.params
+            ...x.params
           });
-          return i != null && i.value ? (e == null ? void 0 : e(G)) || Oe(v == null ? void 0 : v.value) || (s == null ? void 0 : s.value) : c != null && c.value ? (n == null ? void 0 : n(G)) || Oe(d == null ? void 0 : d.value) || (s == null ? void 0 : s.value) : g != null && g.value ? (u == null ? void 0 : u(G)) || Oe(h == null ? void 0 : h.value) || (s == null ? void 0 : s.value) : (o == null ? void 0 : o(G)) || Oe(s == null ? void 0 : s.value) || (s == null ? void 0 : s.value);
+          return r != null && r.value ? (e == null ? void 0 : e(H)) || De(p == null ? void 0 : p.value) || (s == null ? void 0 : s.value) : c != null && c.value ? (n == null ? void 0 : n(H)) || De(d == null ? void 0 : d.value) || (s == null ? void 0 : s.value) : g != null && g.value ? (i == null ? void 0 : i(H)) || De(h == null ? void 0 : h.value) || (s == null ? void 0 : s.value) : (o == null ? void 0 : o(H)) || De(s == null ? void 0 : s.value) || (s == null ? void 0 : s.value);
         });
         return {
-          isVisible: A,
+          isVisible: $,
           hasInvalid: y,
           hasValid: V,
-          hintContent: $
+          hintContent: C
         };
       },
       render() {
@@ -952,267 +967,406 @@ function he(t, a) {
     }
   };
 }
-const wa = ["for"], Ia = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], Pa = {
+const Ea = ["for"], Ra = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], La = {
   name: "VvCheckbox"
-}, Oa = /* @__PURE__ */ D({
-  ...Pa,
-  props: Ca,
-  emits: ka,
+}, Da = /* @__PURE__ */ D({
+  ...La,
+  props: Ia,
+  emits: Pa,
   setup(t, { emit: a }) {
-    const e = t, n = re(), {
+    const e = t, n = he(), {
       disabled: o,
-      readonly: u,
+      readonly: i,
       valid: s,
       invalid: b,
       propsSwitch: c,
       modelValue: d,
-      indeterminate: i,
-      isInGroup: v
-    } = Aa(e, a), p = r(() => String(e.id || ie())), g = r(() => f.value ? -1 : e.tabindex), h = H(), y = r(
-      () => e.uncheckedValue !== void 0 && !v.value
-    ), f = r(() => o.value || u.value), V = r(() => {
+      indeterminate: r,
+      isInGroup: p
+    } = Oa(e, a), v = u(() => String(e.id || de())), g = u(() => f.value ? -1 : e.tabindex), h = j(), y = u(
+      () => e.uncheckedValue !== void 0 && !p.value
+    ), f = u(() => o.value || i.value), V = u(() => {
       if (b.value === !0)
         return !0;
       if (s.value === !0)
         return !1;
-    }), I = r(() => y.value ? d.value === e.value : Array.isArray(d.value) ? pe(e.value, d.value) : me(e.value, d.value)), A = r(() => !!(i.value || !I.value && y.value && e.uncheckedValue !== d.value)), T = r(() => {
+    }), I = u(() => y.value ? d.value === e.value : Array.isArray(d.value) ? pe(e.value, d.value) : be(e.value, d.value)), $ = u(() => !!(r.value || !I.value && y.value && e.uncheckedValue !== d.value)), x = u(() => {
       if (!y.value)
         return ["string", "number", "boolean"].includes(typeof e.value) ? e.value : !0;
-    }), $ = r({
+    }), C = u({
       get() {
         return I.value;
       },
-      set(N) {
+      set(B) {
         if (y.value)
-          d.value = N ? e.value : e.uncheckedValue;
-        else if (Array.isArray(d.value) || v.value) {
-          const z = new Set(
+          d.value = B ? e.value : e.uncheckedValue;
+        else if (Array.isArray(d.value) || p.value) {
+          const U = new Set(
             Array.isArray(d.value) ? d.value : d.value !== void 0 ? [d.value] : []
           );
-          N ? z.add(e.value) : z.delete(e.value), d.value = [...z];
+          B ? U.add(e.value) : U.delete(e.value), d.value = [...U];
         } else
-          d.value = N ? e.value : void 0;
-        a("change", N);
+          d.value = B ? e.value : void 0;
+        a("change", B);
       }
-    }), { bemCssClasses: G } = x("vv-checkbox", {
+    }), { bemCssClasses: H } = G("vv-checkbox", {
       switch: c,
       valid: s,
       invalid: b,
       disabled: o,
-      readonly: u,
-      indeterminate: i
+      readonly: i,
+      indeterminate: r
     });
-    We(() => {
+    ze(() => {
       y.value && Array.isArray(d.value) && console.warn(
         "[VvCheckbox] The model value is an array but the component is in binary mode."
       );
-    }), Ke(
-      () => A.value,
-      (N) => {
-        N ? h.value.indeterminate = !0 : h.value.indeterminate = !1;
+    }), ke(
+      () => $.value,
+      (B) => {
+        B ? h.value.indeterminate = !0 : h.value.indeterminate = !1;
       }
-    ), ze(() => {
-      A.value && (h.value.indeterminate = !0);
+    ), Ot(() => {
+      $.value && (h.value.indeterminate = !0);
     });
-    const { HintSlot: Z } = he(e, n);
-    return (N, z) => (m(), _("label", {
-      class: j(l(G)),
-      for: l(p)
+    const { HintSlot: J } = _e(e, n);
+    return (B, U) => (m(), _("label", {
+      class: F(l(H)),
+      for: l(v)
     }, [
-      ye(O("input", {
-        id: l(p),
+      Se(E("input", {
+        id: l(v),
         ref_key: "input",
         ref: h,
-        "onUpdate:modelValue": z[0] || (z[0] = (ae) => Se($) ? $.value = ae : null),
+        "onUpdate:modelValue": U[0] || (U[0] = (te) => $e(C) ? C.value = te : null),
         type: "checkbox",
         class: "vv-checkbox__input",
-        name: N.name,
+        name: B.name,
         disabled: l(f),
-        value: l(T),
+        value: l(x),
         tabindex: l(g),
         "aria-invalid": l(V)
-      }, null, 8, Ia), [
-        [wt, l($)]
+      }, null, 8, Ra), [
+        [Et, l(C)]
       ]),
-      C(N.$slots, "default", { value: l(d) }, () => [
-        X(R(N.label), 1)
+      A(B.$slots, "default", { value: l(d) }, () => [
+        X(L(B.label), 1)
       ]),
-      oe(l(Z), {
+      le(l(J), {
         class: "vv-checkbox__hint",
         params: { value: l(d) }
       }, null, 8, ["params"])
-    ], 10, wa));
+    ], 10, Ea));
   }
 });
-function Ie(t) {
-  const { options: a, labelKey: e, valueKey: n } = F(t);
+function Re(t) {
+  const { options: a, labelKey: e, valueKey: n } = W(t);
   return {
     options: a,
     getOptionLabel: (s) => typeof s != "object" && s !== null ? s : typeof e.value == "function" ? e.value(s) : s[e.value],
     getOptionValue: (s) => typeof s != "object" && s !== null ? s : typeof n.value == "function" ? n.value(s) : s[n.value]
   };
 }
-const Ra = ft, Ea = ["update:modelValue", "change"], Da = ["textContent"], La = { class: "vv-checkbox-group__wrapper" }, Ta = {
+const Ta = yt, Ba = ["update:modelValue", "change"], Na = ["textContent"], xa = { class: "vv-checkbox-group__wrapper" }, Ha = {
   name: "VvCheckboxGroup"
-}, Yl = /* @__PURE__ */ D({
-  ...Ta,
-  props: Ra,
-  emits: Ea,
+}, no = /* @__PURE__ */ D({
+  ...Ha,
+  props: Ta,
+  emits: Ba,
   setup(t, { emit: a }) {
-    const e = t, n = re(), o = qe(e, "modelValue", a), { disabled: u, readonly: s, vertical: b, valid: c, invalid: d } = F(e);
-    De({
-      key: dt,
+    const e = t, n = he(), o = qe(e, "modelValue", a), { disabled: i, readonly: s, vertical: b, valid: c, invalid: d } = W(e);
+    Ne({
+      key: pt,
       modelValue: o,
-      disabled: u,
+      disabled: i,
       readonly: s,
       valid: c,
       invalid: d
     });
-    const { getOptionLabel: v, getOptionValue: p } = Ie(e), { bemCssClasses: g } = x("vv-checkbox-group", {
-      disabled: u,
+    const { getOptionLabel: p, getOptionValue: v } = Re(e), { bemCssClasses: g } = G("vv-checkbox-group", {
+      disabled: i,
       readonly: s,
-      horizontal: r(() => !b.value),
+      horizontal: u(() => !b.value),
       valid: c,
       invalid: d
     }), h = (f, V) => ({
       id: `${e.name}_opt${V}`,
       name: e.name,
-      label: v(f),
-      value: p(f)
-    }), { HintSlot: y } = he(e, n);
+      label: p(f),
+      value: v(f)
+    }), { HintSlot: y } = _e(e, n);
     return (f, V) => (m(), _("fieldset", {
-      class: j(l(g))
+      class: F(l(g))
     }, [
       f.label ? (m(), _("legend", {
         key: 0,
-        textContent: R(f.label)
-      }, null, 8, Da)) : w("", !0),
-      O("div", La, [
-        f.options.length > 0 ? (m(!0), _(be, { key: 0 }, Ve(f.options, (I, A) => (m(), B(Oa, E({ key: A }, h(I, A)), null, 16))), 128)) : C(f.$slots, "default", { key: 1 })
+        textContent: L(f.label)
+      }, null, 8, Na)) : P("", !0),
+      E("div", xa, [
+        f.options.length > 0 ? (m(!0), _(ge, { key: 0 }, Ce(f.options, (I, $) => (m(), T(Da, R({ key: $ }, h(I, $)), null, 16))), 128)) : A(f.$slots, "default", { key: 1 })
       ]),
-      oe(l(y), { class: "vv-checkbox-group__hint" })
+      le(l(y), { class: "vv-checkbox-group__hint" })
     ], 2));
   }
 });
-function Be(t, a, e) {
-  const n = r(
+function Je(t, a, e) {
+  const n = u(
     () => !!(t != null && t.value && a.value === "left" || e != null && e.iconLeft)
-  ), o = r(
+  ), o = u(
     () => !!(t != null && t.value && a.value === "right" || e != null && e.iconRight)
-  ), u = r(
+  ), i = u(
     () => !!(t != null && t.value && a.value === "top" || e != null && e.iconTop)
-  ), s = r(
+  ), s = u(
     () => !!(t != null && t.value && a.value === "bottom" || e != null && e.iconBottom)
   );
   return {
-    hasIcon: r(() => typeof (t == null ? void 0 : t.value) == "string" ? { name: t == null ? void 0 : t.value } : t == null ? void 0 : t.value),
+    hasIcon: u(() => typeof (t == null ? void 0 : t.value) == "string" ? { name: t == null ? void 0 : t.value } : t == null ? void 0 : t.value),
     hasIconLeft: n,
     hasIconRight: o,
-    hasIconTop: u,
+    hasIconTop: i,
     hasIconBottom: s
   };
 }
-function Ne(t, a) {
-  const { focused: e } = Bt(t);
-  return Ke(e, (n) => {
+function Qe(t, a) {
+  const { focused: e } = Mt(t);
+  return ke(e, (n) => {
     a(n ? "focus" : "blur", l(t));
   }), {
     focused: e
   };
 }
-const Ba = {
-  ...Le,
-  ...ge,
-  ...ue,
+const Ma = {
+  ...Ee,
+  ...xe,
+  ...ye,
+  ...ce,
   modelValue: {
     type: [String, Number, Boolean, Object, Array]
   },
   labelNoResults: { type: String, default: "No results" },
   multiple: Boolean,
-  maxValues: [Number, String]
-}, Na = {
+  maxValues: [Number, String],
+  unselectable: { type: Boolean, default: !0 }
+}, Ga = ["id"], Ua = {
   key: 0,
   role: "option"
-}, xa = ["aria-selected"], Ha = ["for", "onClick"], Ma = ["id", "type", "value", "checked", "disabled"], Ga = {
+}, ja = ["aria-selected"], Fa = ["for", "onClick"], Ka = ["id", "type", "value", "checked", "disabled", "name"], Wa = {
   name: "VvDropdown"
-}, Ua = /* @__PURE__ */ D({
-  ...Ga,
-  props: Ba,
+}, za = /* @__PURE__ */ D({
+  ...Wa,
+  props: Ma,
   emits: ["update:modelValue"],
   setup(t, { emit: a }) {
-    const e = t, n = ie(), { modifiers: o, disabled: u } = F(e), { getOptionLabel: s, getOptionValue: b } = Ie(e), { bemCssClasses: c } = x("vv-dropdown", {
+    const e = t, n = u(() => String(e.id || de())), { modifiers: o, disabled: i } = W(e), { getOptionLabel: s, getOptionValue: b } = Re(e), { bemCssClasses: c } = G("vv-dropdown", {
       modifiers: o,
-      disabled: u
+      disabled: i
     });
-    function d(p) {
-      return Array.isArray(e.modelValue) ? pe(p, e.modelValue) || pe(b(p), e.modelValue) : me(p, e.modelValue) || me(b(p), e.modelValue);
+    function d(v) {
+      return Array.isArray(e.modelValue) ? pe(v, e.modelValue) || pe(b(v), e.modelValue) : be(v, e.modelValue) || be(b(v), e.modelValue);
     }
-    function i(p) {
-      return typeof p == "string" || p.disabled === void 0 ? u.value : p.disabled;
+    function r(v) {
+      return typeof v == "string" || v.disabled === void 0 ? i.value : v.disabled;
     }
-    function v(p) {
+    function p(v) {
       var h;
       if (e.disabled)
         return;
-      let g = p;
+      let g = v;
       if (e.multiple)
         if (Array.isArray(e.modelValue)) {
-          if (e.maxValues !== void 0 && e.maxValues >= 0 && ((h = e.modelValue) == null ? void 0 : h.length) >= e.maxValues && !pe(p, e.modelValue))
+          if (e.maxValues !== void 0 && e.maxValues >= 0 && ((h = e.modelValue) == null ? void 0 : h.length) >= e.maxValues && !pe(v, e.modelValue))
             return;
-          g = pe(p, e.modelValue) ? Gt(p, e.modelValue) : [...e.modelValue, p];
+          g = pe(v, e.modelValue) ? Kt(v, e.modelValue) : [...e.modelValue, v];
         } else
-          g = [p];
+          g = [v];
+      else
+        e.unselectable && v === e.modelValue && (g = void 0);
       a("update:modelValue", g);
     }
-    return (p, g) => {
+    return (v, g) => {
       var h;
       return m(), _("ul", {
-        class: j(l(c)),
+        id: l(n),
+        class: F(l(c)),
         role: "listbox"
       }, [
-        (h = p.options) != null && h.length ? w("", !0) : (m(), _("li", Na, [
-          O("label", null, R(p.labelNoResults), 1)
+        (h = v.options) != null && h.length ? P("", !0) : (m(), _("li", Ua, [
+          E("label", null, L(v.labelNoResults), 1)
         ])),
-        (m(!0), _(be, null, Ve(p.options, (y, f) => (m(), _("li", {
+        (m(!0), _(ge, null, Ce(v.options, (y, f) => (m(), _("li", {
           key: f,
           role: "option",
           "aria-selected": d(y)
         }, [
-          O("label", {
+          E("label", {
             for: `dropdown-${f}-${l(n)}`,
-            onClick: Fe((V) => v(l(b)(y)), ["prevent"])
+            onClick: We((V) => p(l(b)(y)), ["prevent"])
           }, [
-            O("input", {
+            E("input", {
               id: `dropdown-${f}-${l(n)}`,
-              type: p.multiple ? "checkbox" : "radio",
+              type: v.multiple ? "checkbox" : "radio",
               value: l(b)(y),
               checked: d(y),
-              disabled: i(y),
+              disabled: r(y),
+              name: v.name,
               tabindex: "-1",
               "aria-hidden": "true"
-            }, null, 8, Ma),
-            X(" " + R(l(s)(y)), 1)
-          ], 8, Ha)
-        ], 8, xa))), 128))
-      ], 2);
+            }, null, 8, Ka),
+            X(" " + L(l(s)(y)), 1)
+          ], 8, Fa)
+        ], 8, ja))), 128))
+      ], 10, Ga);
     };
   }
-}), ja = [
+}), qa = {
+  ...Ee,
+  ...mt,
+  ...bt,
+  ...He,
+  ...we,
+  ...Ie,
+  ...Oe,
+  ...Xe,
+  ...ye,
+  ...Pe,
+  ...ce,
+  ...xe,
+  ...Ze,
+  ...Ye,
+  ...Me,
+  multiple: Boolean,
+  required: Boolean,
+  size: [String, Number],
+  modelValue: {
+    type: [String, Number, Boolean, Object, Array],
+    default: void 0
+  },
+  label: String,
+  placeholder: String
+}, Xa = ["update:modelValue", "focus", "blur"], Za = ["for"], Ya = { class: "vv-select__wrapper" }, Ja = ["id"], Qa = ["disabled", "hidden"], el = ["disabled", "value"], tl = {
+  name: "VvSelect"
+}, al = /* @__PURE__ */ D({
+  ...tl,
+  props: qa,
+  emits: Xa,
+  setup(t, { emit: a }) {
+    const e = t, n = he(), o = j(), { HintSlot: i, hasHint: s, hasInvalid: b } = _e(e, n), {
+      modifiers: c,
+      disabled: d,
+      readonly: r,
+      loading: p,
+      icon: v,
+      iconPosition: g,
+      invalid: h,
+      valid: y,
+      floating: f,
+      multiple: V
+    } = W(e), I = u(() => String(e.id || de())), $ = u(() => `${I.value}-hint`), { focused: x } = Qe(o, a), C = ut(o);
+    ke(C, (w) => {
+      w && e.autofocus && (x.value = !0);
+    });
+    const { hasIcon: H, hasIconLeft: J, hasIconRight: B } = Je(
+      v,
+      g
+    ), U = u(() => !fe(e.modelValue)), te = u(() => e.disabled || e.readonly), oe = u(() => te.value ? -1 : e.tabindex), ne = u(() => {
+      if (e.invalid === !0)
+        return !0;
+      if (e.valid === !0)
+        return !1;
+    }), { bemCssClasses: ae } = G("vv-select", {
+      modifiers: c,
+      valid: y,
+      invalid: h,
+      loading: p,
+      disabled: d,
+      readonly: r,
+      iconLeft: J,
+      iconRight: B,
+      dirty: U,
+      focus: x,
+      floating: f,
+      multiple: V
+    }), ve = u(() => ({
+      name: e.name,
+      tabindex: oe.value,
+      disabled: te.value,
+      required: e.required,
+      size: e.size,
+      autocomplete: e.autocomplete,
+      multiple: e.multiple,
+      "aria-invalid": ne.value,
+      "aria-describedby": !b.value && s.value ? $.value : void 0,
+      "aria-errormessage": b.value ? $.value : void 0
+    })), { getOptionLabel: se, getOptionValue: re } = Re(e);
+    function ie(w) {
+      return typeof w == "string" || w.disabled === void 0 ? d.value : w.disabled;
+    }
+    const q = u({
+      get: () => e.modelValue,
+      set: (w) => {
+        Array.isArray(w) && (w = w.filter((Z) => Z !== void 0)), a("update:modelValue", w);
+      }
+    });
+    return (w, Z) => (m(), _("div", {
+      class: F(l(ae))
+    }, [
+      w.label ? (m(), _("label", {
+        key: 0,
+        for: l(I)
+      }, L(w.label), 9, Za)) : P("", !0),
+      E("div", Ya, [
+        A(w.$slots, "before", {}, () => [
+          l(J) ? (m(), T(M, K(R({ key: 0 }, l(H))), null, 16)) : P("", !0)
+        ]),
+        Se(E("select", R({
+          id: l(I),
+          ref_key: "select",
+          ref: o,
+          "onUpdate:modelValue": Z[0] || (Z[0] = (k) => $e(q) ? q.value = k : null)
+        }, l(ve)), [
+          w.placeholder ? (m(), _("option", {
+            key: 0,
+            value: void 0,
+            disabled: !w.unselectable,
+            hidden: !w.unselectable
+          }, L(w.placeholder), 9, Qa)) : P("", !0),
+          (m(!0), _(ge, null, Ce(w.options, (k, N) => (m(), _("option", {
+            key: N,
+            disabled: ie(k),
+            value: l(re)(k)
+          }, L(l(se)(k)), 9, el))), 128))
+        ], 16, Ja), [
+          [Rt, l(q)]
+        ]),
+        A(w.$slots, "after", {}, () => [
+          l(B) ? (m(), T(M, K(R({ key: 0 }, l(H))), null, 16)) : P("", !0)
+        ])
+      ]),
+      le(l(i), {
+        id: l($),
+        class: "vv-select__hint"
+      }, null, 8, ["id"])
+    ], 2));
+  }
+}), ll = [
   "update:modelValue",
   "change:search",
   "focus",
   "blur"
-], Fa = {
-  ...Te,
-  ...Ce,
-  ...ke,
+], ol = {
+  ...Ee,
+  ...He,
   ...we,
+  ...Ie,
+  ...Oe,
   ...Xe,
-  ...ge,
-  ...Ae,
-  ...ue,
-  ...Le,
+  ...ye,
+  ...Pe,
+  ...ce,
+  ...xe,
   ...Ze,
+  ...Ye,
+  ...Me,
   modelValue: {
     type: [String, Number, Boolean, Object, Array],
     default: void 0
@@ -1230,159 +1384,190 @@ const Ba = {
   maxValues: [Number, String],
   separator: { type: String, default: ", " },
   native: Boolean
-}, Wa = ["id"], Ka = ["id", "for"], za = ["tabindex"], qa = ["id", "placeholder"], Xa = {
+}, nl = ["id"], sl = ["id", "for"], rl = ["tabindex"], il = ["id", "placeholder"], ul = {
   name: "VvCombobox"
-}, Jl = /* @__PURE__ */ D({
-  ...Xa,
-  props: Fa,
-  emits: ja,
+}, so = /* @__PURE__ */ D({
+  ...ul,
+  props: ol,
+  emits: ll,
   setup(t, { emit: a }) {
-    const e = t, n = re(), { HintSlot: o } = he(e, n), u = H(), s = H(), { focused: b } = Ne(u, a), c = ie(), d = H(""), i = Nt(
+    const e = t, n = he(), { HintSlot: o } = _e(e, n), i = j(), s = j(), { focused: b } = Qe(i, a), c = u(() => String(e.id || de())), d = j(""), r = Gt(
       d,
       Number(e.debounceSearch)
-    ), v = H(!1), {
-      icon: p,
+    ), p = j(!1), {
+      icon: v,
       iconPosition: g,
       modifiers: h,
       disabled: y,
       readonly: f,
       loading: V,
       valid: I,
-      invalid: A
-    } = F(e);
-    Ke(
-      i,
-      () => a("change:search", i.value)
+      invalid: $,
+      floating: x
+    } = W(e);
+    ke(
+      r,
+      () => a("change:search", r.value)
     );
-    const { hasIcon: T, hasIconLeft: $, hasIconRight: G } = Be(
-      p,
+    const { hasIcon: C, hasIconLeft: H, hasIconRight: J } = Je(
+      v,
       g
-    ), Z = r(() => !ee(e.modelValue)), N = r(() => y.value || f.value ? -1 : e.tabindex), { bemCssClasses: z } = x("vv-select", {
+    ), B = u(() => !fe(e.modelValue)), U = u(() => y.value || f.value ? -1 : e.tabindex), { bemCssClasses: te } = G("vv-select", {
       modifiers: h,
       disabled: y,
       loading: V,
       readonly: f,
-      iconLeft: $,
-      iconRight: G,
+      iconLeft: H,
+      iconRight: J,
       valid: I,
-      invalid: A,
-      dirty: Z,
-      focus: b
-    }), ae = r(
-      () => e.searchable ? ce.value : e.options
-    ), { getOptionLabel: de, getOptionValue: Y } = Ie(e), ce = r(() => {
+      invalid: $,
+      dirty: B,
+      focus: b,
+      floating: x
+    }), oe = u(
+      () => e.searchable ? ve.value : e.options
+    ), { getOptionLabel: ne, getOptionValue: ae } = Re(e), ve = u(() => {
       var k;
-      return (k = e.options) == null ? void 0 : k.filter((U) => de(U).toLowerCase().includes(i.value.toLowerCase().trim()));
-    }), ne = r(() => {
+      return (k = e.options) == null ? void 0 : k.filter((N) => ne(N).toLowerCase().includes(r.value.toLowerCase().trim()));
+    }), se = u(() => {
       let k = [];
       return Array.isArray(e.modelValue) ? k = e.modelValue : e.modelValue && (k = [e.modelValue]), e.options.filter(
-        (U) => k.includes(Y(U))
+        (N) => k.includes(ae(N))
       );
-    }), J = r(() => ne.value.map((k) => Y(k)).join(e.separator));
-    rt(u, () => {
-      u.value.open = !1;
+    }), re = u(() => se.value.map((k) => ne(k)).join(e.separator));
+    dt(i, () => {
+      i.value.open = !1;
     });
-    function L(k) {
-      const U = k.target;
-      v.value = U.open;
+    function ie(k) {
+      const N = k.target;
+      p.value = N.open;
     }
-    function le(k) {
-      u.value && !e.multiple && (u.value.open = !1), a("update:modelValue", k);
+    function q(k) {
+      i.value && !e.multiple && (i.value.open = !1), a("update:modelValue", k);
     }
-    const W = r(() => ({
-      options: ae.value,
+    const w = u(() => ({
+      name: e.name,
+      options: oe.value,
       labelKey: e.labelKey,
       valueKey: e.valueKey,
       disabled: e.disabled,
       labelNoResults: e.labelNoResults,
       multiple: e.multiple,
       maxValues: e.maxValues,
+      modelValue: e.modelValue,
+      unselectable: e.unselectable
+    })), Z = u(() => ({
+      id: c.value,
+      name: e.name,
+      tabindex: U.value,
+      valid: I.value,
+      validLabel: e.validLabel,
+      invalid: $.value,
+      invalidLabel: e.invalidLabel,
+      hintLabel: e.hintLabel,
+      loading: V.value,
+      loadingLabel: e.loadingLabel,
+      disabled: y.value,
+      readonly: f.value,
+      modifiers: e.modifiers,
+      options: oe.value,
+      labelKey: e.labelKey,
+      valueKey: e.valueKey,
+      icon: e.icon,
+      iconPosition: e.iconPosition,
+      floating: e.floating,
+      unselectable: e.unselectable,
+      multiple: e.multiple,
+      label: e.label,
+      placeholder: e.placeholder,
       modelValue: e.modelValue
     }));
-    return (k, U) => k.native ? w("", !0) : (m(), _("div", {
+    return (k, N) => k.native ? (m(), T(al, R({ key: 1 }, l(Z), {
+      "onUpdate:modelValue": N[4] || (N[4] = (Y) => a("update:modelValue", Y))
+    }), null, 16)) : (m(), _("div", {
       key: 0,
       id: l(c),
-      class: j(l(z))
+      class: F(l(te))
     }, [
       k.label ? (m(), _("label", {
         key: 0,
         id: `${l(c)}-label`,
-        for: k.searchable && v.value ? `${l(c)}-input` : void 0
-      }, R(k.label), 9, Ka)) : w("", !0),
-      O("details", {
+        for: k.searchable && p.value ? `${l(c)}-input` : void 0
+      }, L(k.label), 9, sl)) : P("", !0),
+      E("details", {
         ref_key: "dropdown",
-        ref: u,
+        ref: i,
         class: "vv-select__wrapper",
-        onClick: U[2] || (U[2] = (ve) => l(y) || l(f) ? ve.preventDefault() : null),
-        onKeyup: U[3] || (U[3] = Qe((ve) => u.value.open = !1, ["esc"])),
-        onToggle: L
+        onClick: N[2] || (N[2] = (Y) => l(y) || l(f) ? Y.preventDefault() : null),
+        onKeyup: N[3] || (N[3] = tt((Y) => i.value.open = !1, ["esc"])),
+        onToggle: ie
       }, [
-        O("summary", {
+        E("summary", {
           class: "vv-select__input",
-          tabindex: l(N),
-          onKeyup: U[1] || (U[1] = Qe((ve) => k.searchable ? ve.preventDefault() : null, ["space"]))
+          tabindex: l(U),
+          onKeyup: N[1] || (N[1] = tt((Y) => k.searchable ? Y.preventDefault() : null, ["space"]))
         }, [
-          C(k.$slots, "before", {}, () => [
-            l($) ? (m(), B(M, E({
+          A(k.$slots, "before", {}, () => [
+            l(H) ? (m(), T(M, R({
               key: 0,
               class: "vv-select__icon-left"
-            }, l(T)), null, 16)) : w("", !0)
+            }, l(C)), null, 16)) : P("", !0)
           ]),
-          k.searchable && v.value ? ye((m(), _("input", {
+          k.searchable && p.value ? Se((m(), _("input", {
             key: 0,
             id: `${l(c)}-input`,
             ref_key: "inputSearch",
             ref: s,
-            "onUpdate:modelValue": U[0] || (U[0] = (ve) => d.value = ve),
+            "onUpdate:modelValue": N[0] || (N[0] = (Y) => d.value = Y),
             role: "combobox",
             type: "search",
             placeholder: k.searchPlaceholder
-          }, null, 8, qa)), [
-            [st, d.value]
-          ]) : (m(), _(be, { key: 1 }, [
-            X(R(l(J) || k.placeholder), 1)
+          }, null, 8, il)), [
+            [it, d.value]
+          ]) : (m(), _(ge, { key: 1 }, [
+            X(L(l(re) || k.placeholder), 1)
           ], 64)),
-          C(k.$slots, "after", {}, () => [
-            l(G) ? (m(), B(M, E({
+          A(k.$slots, "after", {}, () => [
+            l(J) ? (m(), T(M, R({
               key: 0,
               class: "vv-select__icon-right"
-            }, l(T)), null, 16)) : w("", !0)
+            }, l(C)), null, 16)) : P("", !0)
           ])
-        ], 40, za),
-        oe(Ua, E({
+        ], 40, rl),
+        le(za, R({
           id: `${l(c)}-dropdown`
-        }, l(W), { "onUpdate:modelValue": le }), null, 16, ["id"])
+        }, l(w), { "onUpdate:modelValue": q }), null, 16, ["id"])
       ], 544),
-      oe(l(o), { class: "vv-select__hint" })
-    ], 10, Wa));
+      le(l(o), { class: "vv-select__hint" })
+    ], 10, nl));
   }
-}), Za = ["open", "close", "update:modelValue"], Ya = {
+}), dl = ["open", "close", "update:modelValue"], cl = {
   id: { type: String, required: !0 },
   title: String,
   modelValue: Boolean,
   transition: { type: String, default: "fade-block" },
   size: String,
   autoClose: { type: Boolean, default: !0 }
-}, Ja = {
+}, vl = {
   key: 0,
   class: "vv-dialog__header"
-}, Qa = ["onClick"], el = { class: "vv-dialog__content" }, tl = {
+}, pl = ["onClick"], fl = { class: "vv-dialog__content" }, ml = {
   key: 1,
   class: "vv-dialog__footer"
-}, al = {
+}, bl = {
   name: "VvDialog"
-}, Ql = /* @__PURE__ */ D({
-  ...al,
-  props: Ya,
-  emits: Za,
+}, ro = /* @__PURE__ */ D({
+  ...bl,
+  props: cl,
+  emits: dl,
   setup(t, { emit: a }) {
-    const e = t, n = qe(e, "modelValue", a), o = H(!0), u = H(null), s = r(() => {
-      const { id: v } = e;
+    const e = t, n = qe(e, "modelValue", a), o = j(!0), i = j(null), s = u(() => {
+      const { id: p } = e;
       return {
-        id: v,
+        id: p,
         open: o.value
       };
-    }), b = r(() => e.size ? ["vv-dialog", `vv-dialog--${e.size}`] : "vv-dialog"), c = r(() => `vv-dialog--${e.transition}`), d = {
+    }), b = u(() => e.size ? ["vv-dialog", `vv-dialog--${e.size}`] : "vv-dialog"), c = u(() => `vv-dialog--${e.transition}`), d = {
       "before-enter": () => {
         o.value = !0, a("open");
       },
@@ -1390,51 +1575,51 @@ const Ba = {
         o.value = !1, a("close");
       }
     };
-    rt(u, () => {
+    dt(i, () => {
       e.autoClose && (n.value = !1);
     });
-    function i() {
+    function r() {
       n.value = !1;
     }
-    return (v, p) => (m(), B(It, E({ name: l(c) }, Pt(d)), {
-      default: $e(() => [
-        ye(O("dialog", E(l(s), { class: l(b) }), [
-          O("article", {
+    return (p, v) => (m(), T(Lt, R({ name: l(c) }, Dt(d)), {
+      default: Ae(() => [
+        Se(E("dialog", R(l(s), { class: l(b) }), [
+          E("article", {
             ref_key: "modalWrapper",
-            ref: u,
+            ref: i,
             class: "vv-dialog__wrapper"
           }, [
-            v.$slots.header || v.title ? (m(), _("header", Ja, [
-              C(v.$slots, "header", {}, () => [
-                X(R(v.title) + " ", 1),
-                O("button", {
+            p.$slots.header || p.title ? (m(), _("header", vl, [
+              A(p.$slots, "header", {}, () => [
+                X(L(p.title) + " ", 1),
+                E("button", {
                   type: "button",
                   "aria-label": "Close",
                   class: "vv-dialog__close",
-                  onClick: Fe(i, ["prevent"])
+                  onClick: We(r, ["prevent"])
                 }, [
-                  oe(M, { name: "close" })
-                ], 8, Qa)
+                  le(M, { name: "close" })
+                ], 8, pl)
               ])
-            ])) : w("", !0),
-            O("div", el, [
-              C(v.$slots, "default")
+            ])) : P("", !0),
+            E("div", fl, [
+              A(p.$slots, "default")
             ]),
-            v.$slots.footer ? (m(), _("footer", tl, [
-              C(v.$slots, "footer")
-            ])) : w("", !0)
+            p.$slots.footer ? (m(), _("footer", ml, [
+              A(p.$slots, "footer")
+            ])) : P("", !0)
           ], 512)
         ], 16), [
-          [Ot, l(n)]
+          [Tt, l(n)]
         ])
       ]),
       _: 3
     }, 16, ["name"]));
   }
 });
-function ht(t, a, e = 0) {
+function gl(t, a, e = 0) {
   let n;
-  return typeof e == "string" && (e = parseInt(e)), r({
+  return typeof e == "string" && (e = parseInt(e)), u({
     get: () => t == null ? void 0 : t.value,
     set: (o) => {
       n && clearTimeout(n), n = setTimeout(() => {
@@ -1443,8 +1628,8 @@ function ht(t, a, e = 0) {
     }
   });
 }
-function yt(t, a) {
-  const e = r(() => (l(t) ?? "").length), n = r(() => (a == null ? void 0 : a.lowerLimit) !== void 0 && e.value < (a == null ? void 0 : a.lowerLimit) ? e.value - a.lowerLimit : (a == null ? void 0 : a.upperLimit) !== void 0 && e.value < (a == null ? void 0 : a.upperLimit) ? a.upperLimit - e.value : 0), o = r(() => (a == null ? void 0 : a.mode) === !1 ? "" : (a == null ? void 0 : a.mode) === "limit" ? `${e.value} / ${a.lowerLimit ? `${a.lowerLimit}-` : ""}${a.upperLimit}` : (a == null ? void 0 : a.mode) === "countdown" ? n.value === 0 ? void 0 : n : e.value);
+function hl(t, a) {
+  const e = u(() => (l(t) ?? "").length), n = u(() => (a == null ? void 0 : a.lowerLimit) !== void 0 && e.value < (a == null ? void 0 : a.lowerLimit) ? e.value - a.lowerLimit : (a == null ? void 0 : a.upperLimit) !== void 0 && e.value < (a == null ? void 0 : a.upperLimit) ? a.upperLimit - e.value : 0), o = u(() => (a == null ? void 0 : a.mode) === !1 ? "" : (a == null ? void 0 : a.mode) === "limit" && (a != null && a.upperLimit) ? `${e.value} / ${a.lowerLimit ? `${a.lowerLimit}-` : ""}${a.upperLimit}` : (a == null ? void 0 : a.mode) === "countdown" ? n.value === 0 ? void 0 : n : e.value);
   return {
     length: e,
     gap: n,
@@ -1465,15 +1650,15 @@ const S = {
   DATETIME_LOCAL: "datetime-local",
   MONTH: "month",
   WEEK: "week"
-}, fe = {
+}, me = {
   PASSWORD_SHOW: "eye-on",
   PASSWORD_HIDE: "eye-off",
   DATE: "calendar",
   TIME: "time",
   COLOR: "color",
   SEARCH: "close"
-}, ll = ["update:modelValue", "focus", "blur", "keyup"], ol = {
-  ...vt,
+}, yl = ["update:modelValue", "focus", "blur", "keyup"], _l = {
+  ...gt,
   modelValue: [String, Number],
   type: {
     type: String,
@@ -1487,15 +1672,15 @@ const S = {
   multiple: Boolean,
   iconShowPassword: {
     type: String,
-    default: fe.PASSWORD_SHOW
+    default: me.PASSWORD_SHOW
   },
   iconHidePassword: {
     type: String,
-    default: fe.PASSWORD_HIDE
+    default: me.PASSWORD_HIDE
   },
   iconClear: {
     type: String,
-    default: fe.SEARCH
+    default: me.SEARCH
   },
   labelStepUp: {
     type: String,
@@ -1517,7 +1702,7 @@ const S = {
     type: String,
     default: "Clear"
   }
-}, at = D({
+}, ot = D({
   components: {
     VvIcon: M
   },
@@ -1536,20 +1721,20 @@ const S = {
     },
     iconShow: {
       type: String,
-      default: fe.PASSWORD_SHOW
+      default: me.PASSWORD_SHOW
     },
     iconHide: {
       type: String,
-      default: fe.PASSWORD_HIDE
+      default: me.PASSWORD_HIDE
     }
   },
   emits: ["toggle-password"],
   setup(t, { emit: a }) {
-    const e = H(!1), n = r(
+    const e = j(!1), n = u(
       () => e.value ? t.iconHide : t.iconShow
     );
-    function o(u) {
-      u == null || u.stopPropagation(), t.disabled || (e.value = !e.value, a("toggle-password", e.value));
+    function o(i) {
+      i == null || i.stopPropagation(), t.disabled || (e.value = !e.value, a("toggle-password", e.value));
     }
     return {
       active: e,
@@ -1574,7 +1759,7 @@ const S = {
       t
     );
   }
-}), Me = D({
+}), Ue = D({
   components: {
     VvIcon: M
   },
@@ -1594,7 +1779,7 @@ const S = {
   },
   emits: ["step-up", "step-down"],
   setup(t, { emit: a }) {
-    const e = r(() => t.mode === "up");
+    const e = u(() => t.mode === "up");
     return {
       isUp: e,
       onClick: (o) => {
@@ -1613,7 +1798,7 @@ const S = {
       onClick: this.onClick
     });
   }
-}), lt = D({
+}), nt = D({
   components: {
     VvIcon: M
   },
@@ -1658,18 +1843,18 @@ const S = {
     );
   }
 });
-function Ge(t, a) {
+function je(t, a) {
   return {
     name: "VvInputTextActions",
     components: {
       VvIcon: M,
-      VvInputPasswordAction: at,
-      VvInputStepAction: Me,
-      VvInputClearAction: lt
+      VvInputPasswordAction: ot,
+      VvInputStepAction: Ue,
+      VvInputClearAction: nt
     },
     setup() {
       return {
-        isDisabled: r(() => a.disabled || a.readonly),
+        isDisabled: u(() => a.disabled || a.readonly),
         labelStepUp: a.labelStepUp,
         labelStepDown: a.labelStepDown,
         labelShowPassword: a.labelShowPassword,
@@ -1685,7 +1870,7 @@ function Ge(t, a) {
         case S.SEARCH: {
           const { onClear: n } = this.$attrs;
           e = [
-            Q(lt, {
+            Q(nt, {
               disabled: this.isDisabled,
               label: this.labelShowPassword,
               onClear: n
@@ -1696,7 +1881,7 @@ function Ge(t, a) {
         case S.PASSWORD: {
           const { onTogglePassword: n } = this.$attrs;
           e = [
-            Q(at, {
+            Q(ot, {
               disabled: this.isDisabled,
               onTogglePassword: n,
               labelShow: this.labelShowPassword,
@@ -1710,14 +1895,14 @@ function Ge(t, a) {
         case S.NUMBER: {
           const { onStepUp: n, onStepDown: o } = this.$attrs;
           e = [
-            Q(Me, {
+            Q(Ue, {
               mode: "up",
               disabled: this.isDisabled || a.max !== void 0 && a.modelValue === a.max,
               label: this.labelStepUp,
               onStepUp: n,
               onStepDown: o
             }),
-            Q(Me, {
+            Q(Ue, {
               mode: "down",
               disabled: this.isDisabled || a.min !== void 0 && a.modelValue === a.min,
               label: this.labelStepDown,
@@ -1732,163 +1917,165 @@ function Ge(t, a) {
     }
   };
 }
-const nl = ["for"], sl = { class: "vv-input-text__wrapper" }, rl = ["id"], il = {
+const Sl = ["for"], Vl = { class: "vv-input-text__wrapper" }, $l = ["id"], Cl = {
   key: 0,
   class: "vv-input-text__limit"
-}, ul = {
+}, Al = {
   name: "VvInputText"
-}, eo = /* @__PURE__ */ D({
-  ...ul,
-  props: ol,
-  emits: ll,
+}, io = /* @__PURE__ */ D({
+  ...Al,
+  props: _l,
+  emits: yl,
   setup(t, { emit: a }) {
-    const e = t, n = re(), o = H(), {
-      icon: u,
+    const e = t, n = he(), o = j(), {
+      icon: i,
       iconPosition: s,
       label: b,
       modelValue: c,
       count: d,
-      valid: i,
-      invalid: v,
-      loading: p
-    } = F(e), g = r(() => String(e.id || ie())), h = r(() => `${g.value}-hint`), y = r(
-      () => e.floating && ee(e.placeholder) ? " " : e.placeholder
-    ), f = ht(c, a, e.debounce), { focused: V } = Ne(o, a), I = H(!1), A = r(() => e.type === S.PASSWORD), T = () => {
-      I.value = !I.value;
-    }, $ = r(
+      valid: r,
+      invalid: p,
+      loading: v
+    } = W(e), g = u(() => String(e.id || de())), h = u(() => `${g.value}-hint`), y = u(
+      () => e.floating && fe(e.placeholder) ? " " : e.placeholder
+    ), f = gl(c, a, e.debounce), { focused: V } = Qe(o, a), I = ut(o);
+    ke(I, (O) => {
+      O && e.autofocus && (V.value = !0);
+    });
+    const $ = j(!1), x = u(() => e.type === S.PASSWORD), C = () => {
+      $.value = !$.value;
+    }, H = u(
       () => e.type === S.TIME || e.type === S.DATETIME_LOCAL || e.type === S.DATE || e.type === S.WEEK || e.type === S.MONTH
-    ), G = r(() => e.type === S.NUMBER), Z = () => {
-      L.value && (o.value.stepUp(), f.value = l(o).value);
-    }, N = () => {
-      L.value && (o.value.stepDown(), f.value = l(o).value);
-    }, z = r(() => e.type === S.SEARCH), ae = () => {
+    ), J = u(() => e.type === S.NUMBER), B = () => {
+      ie.value && (o.value.stepUp(), f.value = l(o).value);
+    }, U = () => {
+      ie.value && (o.value.stepDown(), f.value = l(o).value);
+    }, te = u(() => e.type === S.SEARCH), oe = () => {
       f.value = void 0;
-    }, { hasIconLeft: de, hasIconRight: Y, hasIcon: ce } = Be(
-      u,
+    }, { hasIconLeft: ne, hasIconRight: ae, hasIcon: ve } = Je(
+      i,
       s
-    ), ne = r(() => {
+    ), se = u(() => {
       switch (e.type) {
         case S.COLOR:
-          return { name: fe.COLOR };
+          return { name: me.COLOR };
         case S.DATE:
         case S.DATETIME_LOCAL:
         case S.WEEK:
         case S.MONTH:
-          return { name: fe.DATE };
+          return { name: me.DATE };
         case S.TIME:
-          return { name: fe.TIME };
+          return { name: me.TIME };
         default:
           return "";
       }
-    }), { formatted: J } = yt(f, {
+    }), { formatted: re } = hl(f, {
       mode: e.count,
       upperLimit: e.maxlength,
       lowerLimit: e.minlength
-    }), L = r(() => !e.disabled && !e.readonly), le = r(
-      () => L.value ? e.tabindex : -1
-    ), W = r(() => !ee(c)), k = r(() => {
-      if (v.value === !0)
+    }), ie = u(() => !e.disabled && !e.readonly), q = u(
+      () => ie.value ? e.tabindex : -1
+    ), w = u(() => !fe(c)), Z = u(() => {
+      if (p.value === !0)
         return !0;
-      if (i.value === !0)
+      if (r.value === !0)
         return !1;
-    }), { bemCssClasses: U } = x("vv-input-text", {
+    }), { bemCssClasses: k } = G("vv-input-text", {
       modifiers: e.modifiers,
-      valid: i,
-      invalid: v,
-      loading: p,
+      valid: r,
+      invalid: p,
+      loading: v,
       disabled: e.disabled,
       readonly: e.readonly,
-      iconLeft: de,
-      iconRight: Y.value || !ee(ne),
-      floating: e.floating && !ee(e.label),
-      dirty: W,
+      iconLeft: ne,
+      iconRight: ae.value || !fe(se),
+      floating: e.floating && !fe(e.label),
+      dirty: w,
       focus: V
-    }), ve = r(() => {
-      const P = (() => A.value && I.value || $.value && !W.value && !V.value ? S.TEXT : e.type)(), q = {
-        type: P,
+    }), N = u(() => {
+      const O = (() => x.value && $.value || H.value && !w.value && !V.value ? S.TEXT : e.type)(), z = {
+        type: O,
         name: e.name,
-        tabindex: le.value,
+        tabindex: q.value,
         disabled: e.disabled,
         readonly: e.readonly,
         required: e.required,
         autocomplete: e.autocomplete,
-        "aria-invalid": k.value,
-        "aria-describedby": !Je.value && St.value ? h.value : void 0,
-        "aria-errormessage": Je.value ? h.value : void 0
+        "aria-invalid": Z.value,
+        "aria-describedby": !et.value && Ct.value ? h.value : void 0,
+        "aria-errormessage": et.value ? h.value : void 0
       };
-      return (P === S.DATE || P === S.MONTH || P === S.WEEK || P === S.TIME || P === S.DATETIME_LOCAL || P === S.NUMBER) && (q.step = e.step, q.max = String(e.max), q.min = String(e.min)), (P === S.TEXT || P === S.SEARCH || P === S.URL || P === S.TEL || P === S.EMAIL || P === S.PASSWORD || P === S.NUMBER) && (q.placeholder = y.value), (P === S.TEXT || P === S.SEARCH || P === S.URL || P === S.TEL || P === S.EMAIL || P === S.PASSWORD) && (q.minlength = e.minlength, q.maxlength = e.maxlength, q.pattern = e.pattern), P === S.EMAIL && (q.multiple = e.multiple), q;
-    }), xe = r(() => ({
+      return (O === S.DATE || O === S.MONTH || O === S.WEEK || O === S.TIME || O === S.DATETIME_LOCAL || O === S.NUMBER) && (z.step = e.step, z.max = String(e.max), z.min = String(e.min)), (O === S.TEXT || O === S.SEARCH || O === S.URL || O === S.TEL || O === S.EMAIL || O === S.PASSWORD || O === S.NUMBER) && (z.placeholder = y.value), (O === S.TEXT || O === S.SEARCH || O === S.URL || O === S.TEL || O === S.EMAIL || O === S.PASSWORD) && (z.minlength = e.minlength, z.maxlength = e.maxlength, z.pattern = e.pattern), O === S.EMAIL && (z.multiple = e.multiple), z;
+    }), Y = u(() => ({
       valid: e.valid,
       invalid: e.invalid,
       modelValue: e.modelValue,
-      togglePassword: T,
-      stepUp: Z,
-      stepDown: N,
-      clear: ae
-    })), { HintSlot: _t, hasHint: St, hasInvalid: Je } = he(e, n), Vt = Ge(
+      togglePassword: C,
+      stepUp: B,
+      stepDown: U,
+      clear: oe
+    })), { HintSlot: $t, hasHint: Ct, hasInvalid: et } = _e(e, n), At = je(
       S.PASSWORD,
       e
-    ), $t = Ge(
+    ), kt = je(
       S.NUMBER,
       e
-    ), Ct = Ge(
+    ), wt = je(
       S.SEARCH,
       e
     );
-    return ze(() => {
-      e.autofocus && (V.value = !0);
-    }), (P, q) => (m(), _("div", {
-      class: j(l(U))
+    return (O, z) => (m(), _("div", {
+      class: F(l(k))
     }, [
       l(b) ? (m(), _("label", {
         key: 0,
         for: l(g),
         class: "vv-input-text__label"
-      }, R(l(b)), 9, nl)) : w("", !0),
-      O("div", sl, [
-        C(P.$slots, "before", K(te(l(xe))), () => [
-          l(de) ? (m(), B(M, E({
+      }, L(l(b)), 9, Sl)) : P("", !0),
+      E("div", Vl, [
+        A(O.$slots, "before", K(ee(l(Y))), () => [
+          l(ne) ? (m(), T(M, R({
             key: 0,
             class: "vv-input-text__icon-left"
-          }, l(ce)), null, 16)) : w("", !0)
+          }, l(ve)), null, 16)) : P("", !0)
         ]),
-        ye(O("input", E({
+        Se(E("input", R({
           id: l(g),
           ref_key: "input",
           ref: o,
-          "onUpdate:modelValue": q[0] || (q[0] = (He) => Se(f) ? f.value = He : null)
-        }, l(ve), {
-          onKeyup: q[1] || (q[1] = (He) => a("keyup", He))
-        }), null, 16, rl), [
-          [Rt, l(f)]
+          "onUpdate:modelValue": z[0] || (z[0] = (Ge) => $e(f) ? f.value = Ge : null)
+        }, l(N), {
+          onKeyup: z[1] || (z[1] = (Ge) => a("keyup", Ge))
+        }), null, 16, $l), [
+          [Bt, l(f)]
         ]),
-        C(P.$slots, "after", K(te(l(xe))), () => [
-          l(Y) || l(ne) ? (m(), B(M, K(E({ key: 0 }, l(Y) ? l(ce) : l(ne))), null, 16)) : l(A) ? (m(), B(l(Vt), {
+        A(O.$slots, "after", K(ee(l(Y))), () => [
+          l(ae) || l(se) ? (m(), T(M, K(R({ key: 0 }, l(ae) ? l(ve) : l(se))), null, 16)) : l(x) ? (m(), T(l(At), {
             key: 1,
-            onTogglePassword: T
-          })) : l(G) ? (m(), B(l($t), {
+            onTogglePassword: C
+          })) : l(J) ? (m(), T(l(kt), {
             key: 2,
-            onStepUp: Z,
-            onStepDown: N
-          })) : l(z) ? (m(), B(l(Ct), {
+            onStepUp: B,
+            onStepDown: U
+          })) : l(te) ? (m(), T(l(wt), {
             key: 3,
-            onClear: ae
-          })) : w("", !0)
+            onClear: oe
+          })) : P("", !0)
         ]),
-        l(d) ? (m(), _("span", il, [
-          C(P.$slots, "count", K(te(l(xe))), () => [
-            X(R(l(J)), 1)
+        l(d) ? (m(), _("span", Cl, [
+          A(O.$slots, "count", K(ee(l(Y))), () => [
+            X(L(l(re)), 1)
           ])
-        ])) : w("", !0)
+        ])) : P("", !0)
       ]),
-      oe(l(_t), {
+      le(l($t), {
         id: l(h),
         class: "vv-input-text__hint"
       }, null, 8, ["id"])
     ], 2));
   }
-}), dl = {
-  ...ue,
+}), kl = {
+  ...ce,
   value: {
     type: [Number, String],
     default: void 0
@@ -1900,324 +2087,209 @@ const nl = ["for"], sl = { class: "vv-input-text__wrapper" }, rl = ["id"], il =
     type: String,
     required: !0
   }
-}, cl = {
+}, wl = {
   name: "VvProgress"
-}, to = /* @__PURE__ */ D({
-  ...cl,
-  props: dl,
+}, uo = /* @__PURE__ */ D({
+  ...wl,
+  props: kl,
   setup(t) {
-    const a = t, { value: e, max: n, label: o } = F(a), u = r(() => a.value === void 0), { bemCssClasses: s } = x("vv-progress", {
+    const a = t, { value: e, max: n, label: o } = W(a), i = u(() => a.value === void 0), { bemCssClasses: s } = G("vv-progress", {
       modifiers: a.modifiers,
-      indeterminate: u
+      indeterminate: i
     });
-    return (b, c) => (m(), _("progress", E({ role: "progressbar" }, {
+    return (b, c) => (m(), _("progress", R({ role: "progressbar" }, {
       class: l(s),
       ariaLabel: l(o),
       max: l(n),
       value: l(e)
     }), null, 16));
   }
-}), vl = pt, pl = ["click", "update:modelValue", "change", "blur"];
-function fl(t, a) {
-  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Ee(ut), u = o("modelValue", t, a), s = o("readonly", t), b = o("disabled", t), c = o("valid", t), d = o("invalid", t);
+}), Il = ht, Pl = ["click", "update:modelValue", "change", "blur"];
+function Ol(t, a) {
+  const { group: e, isInGroup: n, getGroupOrLocalRef: o } = Be(vt), i = o("modelValue", t, a), s = o("readonly", t), b = o("disabled", t), c = o("valid", t), d = o("invalid", t);
   return {
     group: e,
     isInGroup: n,
-    modelValue: u,
+    modelValue: i,
     readonly: s,
     disabled: b,
     valid: c,
     invalid: d
   };
 }
-const ml = ["for"], bl = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], gl = {
+const El = ["for"], Rl = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], Ll = {
   name: "VvRadio"
-}, hl = /* @__PURE__ */ D({
-  ...gl,
-  props: vl,
-  emits: pl,
+}, Dl = /* @__PURE__ */ D({
+  ...Ll,
+  props: Il,
+  emits: Pl,
   setup(t, { emit: a }) {
-    const e = t, n = re(), { disabled: o, readonly: u, modelValue: s, valid: b, invalid: c } = fl(
+    const e = t, n = he(), { disabled: o, readonly: i, modelValue: s, valid: b, invalid: c } = Ol(
       e,
       a
-    ), d = r(() => String(e.id || ie())), i = r(() => p.value ? -1 : e.tabindex), v = H(), p = r(() => o.value || u.value), g = r(() => {
+    ), d = u(() => String(e.id || de())), r = u(() => v.value ? -1 : e.tabindex), p = j(), v = u(() => o.value || i.value), g = u(() => {
       if (c.value === !0)
         return !0;
       if (b.value === !0)
         return !1;
-    }), h = r(
-      () => Array.isArray(s.value) ? pe(e.value, s.value) : me(e.value, s.value)
-    ), y = r(
+    }), h = u(
+      () => Array.isArray(s.value) ? pe(e.value, s.value) : be(e.value, s.value)
+    ), y = u(
       () => ["string", "number", "boolean"].includes(typeof e.value) ? e.value : !0
-    ), f = r({
+    ), f = u({
       get() {
         return h.value ? y.value : null;
       },
-      set(A) {
-        Array.isArray(s.value) ? s.value = [e.value] : s.value = e.value, a("change", A);
+      set($) {
+        Array.isArray(s.value) ? s.value = [e.value] : s.value = e.value, a("change", $);
       }
-    }), { bemCssClasses: V } = x("vv-radio", {
+    }), { bemCssClasses: V } = G("vv-radio", {
       valid: b,
       invalid: c,
       disabled: o,
-      readonly: u
-    }), { HintSlot: I } = he(e, n);
-    return (A, T) => (m(), _("label", {
-      class: j(l(V)),
+      readonly: i
+    }), { HintSlot: I } = _e(e, n);
+    return ($, x) => (m(), _("label", {
+      class: F(l(V)),
       for: l(d)
     }, [
-      ye(O("input", {
+      Se(E("input", {
         id: l(d),
         ref_key: "input",
-        ref: v,
-        "onUpdate:modelValue": T[0] || (T[0] = ($) => Se(f) ? f.value = $ : null),
+        ref: p,
+        "onUpdate:modelValue": x[0] || (x[0] = (C) => $e(f) ? f.value = C : null),
         type: "radio",
         class: "vv-radio__input",
-        name: A.name,
-        disabled: l(p),
+        name: $.name,
+        disabled: l(v),
         value: l(y),
-        tabindex: l(i),
+        tabindex: l(r),
         "aria-invalid": l(g)
-      }, null, 8, bl), [
-        [Et, l(f)]
+      }, null, 8, Rl), [
+        [Nt, l(f)]
       ]),
-      C(A.$slots, "default", { value: l(s) }, () => [
-        X(R(A.label), 1)
+      A($.$slots, "default", { value: l(s) }, () => [
+        X(L($.label), 1)
       ]),
-      oe(l(I), {
+      le(l(I), {
         class: "vv-radio__hint",
         params: { value: l(s) }
       }, null, 8, ["params"])
-    ], 10, ml));
+    ], 10, El));
   }
-}), yl = ft, _l = ["update:modelValue", "change"], Sl = ["textContent"], Vl = { class: "vv-radio-group__wrapper" }, $l = {
+}), Tl = yt, Bl = ["update:modelValue", "change"], Nl = ["textContent"], xl = { class: "vv-radio-group__wrapper" }, Hl = {
   name: "VvRadioGroup"
-}, ao = /* @__PURE__ */ D({
-  ...$l,
-  props: yl,
-  emits: _l,
+}, co = /* @__PURE__ */ D({
+  ...Hl,
+  props: Tl,
+  emits: Bl,
   setup(t, { emit: a }) {
-    const e = t, n = re(), o = qe(e, "modelValue", a), { disabled: u, readonly: s, vertical: b, valid: c, invalid: d } = F(e);
-    De({
-      key: ut,
+    const e = t, n = he(), o = qe(e, "modelValue", a), { disabled: i, readonly: s, vertical: b, valid: c, invalid: d } = W(e);
+    Ne({
+      key: vt,
       modelValue: o,
-      disabled: u,
+      disabled: i,
       readonly: s,
       valid: c,
       invalid: d
     });
-    const { getOptionLabel: v, getOptionValue: p } = Ie(e), { bemCssClasses: g } = x("vv-radio-group", {
-      disabled: u,
+    const { getOptionLabel: p, getOptionValue: v } = Re(e), { bemCssClasses: g } = G("vv-radio-group", {
+      disabled: i,
       readonly: s,
-      horizontal: r(() => !b.value),
+      horizontal: u(() => !b.value),
       valid: c,
       invalid: d
     }), h = (f, V) => ({
       id: `${e.name}_opt${V}`,
       name: e.name,
-      label: v(f),
-      value: p(f)
-    }), { HintSlot: y } = he(e, n);
+      label: p(f),
+      value: v(f)
+    }), { HintSlot: y } = _e(e, n);
     return (f, V) => (m(), _("fieldset", {
-      class: j(l(g))
+      class: F(l(g))
     }, [
       f.label ? (m(), _("legend", {
         key: 0,
-        textContent: R(f.label)
-      }, null, 8, Sl)) : w("", !0),
-      O("div", Vl, [
-        f.options.length > 0 ? (m(!0), _(be, { key: 0 }, Ve(f.options, (I, A) => (m(), B(hl, E({ key: A }, h(I, A)), null, 16))), 128)) : C(f.$slots, "default", { key: 1 })
-      ]),
-      oe(l(y), { class: "vv-radio-group__hint" })
-    ], 2));
-  }
-}), Cl = {
-  ...Ye,
-  ...Te,
-  ...Ce,
-  ...ke,
-  ...we,
-  ...Xe,
-  ...ge,
-  ...Ae,
-  ...ue,
-  ...Le,
-  ...Ze,
-  autocomplete: { type: String, default: "off" },
-  autofocus: Boolean,
-  multiple: Boolean,
-  required: Boolean,
-  size: [String, Number],
-  modelValue: {
-    type: [String, Number, Boolean, Object, Array],
-    default: void 0
-  },
-  label: String,
-  placeholder: String
-}, kl = ["update:modelValue", "focus", "blur"], Al = ["for"], wl = { class: "vv-select__wrapper" }, Il = ["id"], Pl = {
-  key: 0,
-  value: void 0,
-  disabled: ""
-}, Ol = ["disabled", "value"], Rl = {
-  name: "VvSelect"
-}, lo = /* @__PURE__ */ D({
-  ...Rl,
-  props: Cl,
-  emits: kl,
-  setup(t, { emit: a }) {
-    const e = t, n = re(), o = H(), { HintSlot: u, hasHint: s, hasInvalid: b } = he(e, n), {
-      modifiers: c,
-      disabled: d,
-      readonly: i,
-      loading: v,
-      icon: p,
-      iconPosition: g,
-      invalid: h,
-      valid: y
-    } = F(e), f = r(() => String(e.id || ie())), V = r(() => `${f.value}-hint`), { focused: I } = Ne(o, a), { hasIcon: A, hasIconLeft: T, hasIconRight: $ } = Be(
-      p,
-      g
-    ), G = r(() => !ee(e.modelValue)), Z = r(() => e.disabled || e.readonly), N = r(() => Z.value ? -1 : e.tabindex), z = r(() => {
-      if (e.invalid === !0)
-        return !0;
-      if (e.valid === !0)
-        return !1;
-    }), { bemCssClasses: ae } = x("vv-select", {
-      modifiers: c,
-      valid: y,
-      invalid: h,
-      loading: v,
-      disabled: d,
-      readonly: i,
-      iconLeft: T,
-      iconRight: $,
-      dirty: G,
-      focus: I
-    }), de = r(() => ({
-      name: e.name,
-      tabindex: N.value,
-      disabled: Z.value,
-      required: e.required,
-      size: e.size,
-      autocomplete: e.autocomplete,
-      multiple: e.multiple,
-      "aria-invalid": z.value,
-      "aria-describedby": !b.value && s.value ? V.value : void 0,
-      "aria-errormessage": b.value ? V.value : void 0
-    })), { getOptionLabel: Y, getOptionValue: ce } = Ie(e);
-    function ne(L) {
-      return typeof L == "string" || L.disabled === void 0 ? d.value : L.disabled;
-    }
-    const J = r({
-      get: () => e.modelValue,
-      set: (L) => {
-        a("update:modelValue", L);
-      }
-    });
-    return (L, le) => (m(), _("div", {
-      class: j(l(ae))
-    }, [
-      L.label ? (m(), _("label", {
-        key: 0,
-        for: l(f)
-      }, R(L.label), 9, Al)) : w("", !0),
-      O("div", wl, [
-        C(L.$slots, "before", {}, () => [
-          l(T) ? (m(), B(M, K(E({ key: 0 }, l(A))), null, 16)) : w("", !0)
-        ]),
-        ye(O("select", E({
-          id: l(f),
-          ref_key: "select",
-          ref: o,
-          "onUpdate:modelValue": le[0] || (le[0] = (W) => Se(J) ? J.value = W : null)
-        }, l(de)), [
-          L.placeholder ? (m(), _("option", Pl, R(L.placeholder), 1)) : w("", !0),
-          (m(!0), _(be, null, Ve(L.options, (W, k) => (m(), _("option", {
-            key: k,
-            disabled: ne(W),
-            value: l(ce)(W)
-          }, R(l(Y)(W)), 9, Ol))), 128))
-        ], 16, Il), [
-          [Dt, l(J)]
-        ]),
-        C(L.$slots, "after", {}, () => [
-          l($) ? (m(), B(M, K(E({ key: 0 }, l(A))), null, 16)) : w("", !0)
-        ])
+        textContent: L(f.label)
+      }, null, 8, Nl)) : P("", !0),
+      E("div", xl, [
+        f.options.length > 0 ? (m(!0), _(ge, { key: 0 }, Ce(f.options, (I, $) => (m(), T(Dl, R({ key: $ }, h(I, $)), null, 16))), 128)) : A(f.$slots, "default", { key: 1 })
       ]),
-      oe(l(u), {
-        id: l(V),
-        class: "vv-select__hint"
-      }, null, 8, ["id"])
+      le(l(y), { class: "vv-radio-group__hint" })
     ], 2));
   }
-}), El = {
+}), Ml = {
   hard: "hard",
   soft: "soft"
-}, Dl = {
+}, Gl = {
   true: !0,
   false: !1,
   default: "default"
-}, Ll = ["update:modelValue", "focus", "blur", "keyup"], Tl = {
-  ...vt,
+}, Ul = ["update:modelValue", "focus", "blur", "keyup"], jl = {
+  ...gt,
   modelValue: String,
   cols: { type: [String, Number], default: 20 },
   rows: { type: [String, Number], default: 2 },
-  wrap: { type: String, default: El.soft },
-  spellcheck: { type: [Boolean, String], default: Dl.default },
+  wrap: { type: String, default: Ml.soft },
+  spellcheck: { type: [Boolean, String], default: Gl.default },
   resizable: Boolean
-}, Bl = ["for"], Nl = { class: "vv-textarea__wrapper" }, xl = ["id"], Hl = {
+}, Fl = ["for"], Kl = { class: "vv-textarea__wrapper" }, Wl = ["id"], zl = {
   key: 0,
   class: "vv-textarea__limit"
-}, Ml = {
+}, ql = {
   name: "VvTextarea"
-}, oo = /* @__PURE__ */ D({
-  ...Ml,
-  props: Tl,
-  emits: Ll,
+}, vo = /* @__PURE__ */ D({
+  ...ql,
+  props: jl,
+  emits: Ul,
   setup(t, { emit: a }) {
-    const e = t, n = re(), o = H(), {
-      icon: u,
+    const e = t, n = useSlots(), o = ref(), {
+      icon: i,
       iconPosition: s,
       label: b,
       modelValue: c,
       count: d,
-      valid: i,
-      invalid: v,
-      loading: p
-    } = F(e), g = r(() => String(e.id || ie())), h = r(() => `${g.value}-hint`), y = r(
-      () => e.floating && ee(e.placeholder) ? " " : e.placeholder
-    ), f = ht(c, a, e.debounce), { hasIcon: V, hasIconLeft: I, hasIconRight: A } = Be(
-      u,
+      valid: r,
+      invalid: p,
+      loading: v
+    } = toRefs(e), g = computed(() => String(e.id || de())), h = computed(() => `${g.value}-hint`), y = computed(
+      () => e.floating && isEmpty(e.placeholder) ? " " : e.placeholder
+    ), f = useDebouncedInput(c, a, e.debounce), { hasIcon: V, hasIconLeft: I, hasIconRight: $ } = useComponentIcon(
+      i,
       s
-    ), { focused: T } = Ne(o, a), { formatted: $ } = yt(f, {
+    ), { focused: x } = useComponentFocus(o, a), C = useElementVisibility(o);
+    watch(C, (q) => {
+      q && e.autofocus && (x.value = !0);
+    });
+    const { formatted: H } = useTextCount(f, {
       mode: e.count,
       upperLimit: e.maxlength,
       lowerLimit: e.minlength
-    }), G = r(() => !e.disabled && !e.readonly), Z = r(
-      () => G.value ? e.tabindex : -1
-    ), N = r(() => !ee(c)), z = r(() => {
+    }), J = computed(() => !e.disabled && !e.readonly), B = computed(
+      () => J.value ? e.tabindex : -1
+    ), U = computed(() => !isEmpty(c)), te = computed(() => {
       if (e.invalid === !0)
         return !0;
       if (e.valid === !0)
         return !1;
-    }), { HintSlot: ae, hasHint: de, hasInvalid: Y } = he(e, n), { bemCssClasses: ce } = x("vv-textarea", {
+    }), { HintSlot: oe, hasHint: ne, hasInvalid: ae } = _e(e, n), { bemCssClasses: ve } = useBemModifiers("vv-textarea", {
       modifiers: e.modifiers,
-      valid: i,
-      invalid: v,
-      loading: p,
+      valid: r,
+      invalid: p,
+      loading: v,
       disabled: e.disabled,
       readonly: e.readonly,
       iconLeft: I,
-      iconRight: A,
-      floating: e.floating && !ee(e.label),
-      dirty: N,
-      focused: T,
+      iconRight: $,
+      floating: e.floating && !isEmpty(e.label),
+      dirty: U,
+      focused: x,
       resizable: e.resizable
-    }), ne = r(
+    }), se = computed(
       () => ({
         name: e.name,
         placeholder: y.value,
-        tabindex: Z.value,
+        tabindex: B.value,
         disabled: e.disabled,
         readonly: e.readonly,
         required: e.required,
@@ -2228,58 +2300,56 @@ const ml = ["for"], bl = ["id", "name", "disabled", "value", "tabindex", "aria-i
         rows: e.rows,
         wrap: e.wrap,
         spellcheck: e.spellcheck,
-        "aria-invalid": z.value,
-        "aria-describedby": !Y.value && de.value ? h.value : void 0,
-        "aria-errormessage": Y.value ? h.value : void 0
+        "aria-invalid": te.value,
+        "aria-describedby": !ae.value && ne.value ? h.value : void 0,
+        "aria-errormessage": ae.value ? h.value : void 0
       })
-    ), J = r(() => ({
+    ), re = computed(() => ({
       valid: e.valid,
       invalid: e.invalid,
       modelValue: e.modelValue,
       hintLabel: e.hintLabel,
       maxlength: e.maxlength,
       minlength: e.minlength,
-      clear: L
-    })), L = () => {
+      clear: ie
+    })), ie = () => {
       f.value = void 0;
     };
-    return ze(() => {
-      e.autofocus && (T.value = !0);
-    }), (le, W) => (m(), _("div", {
-      class: j(l(ce))
+    return (q, w) => (m(), _("div", {
+      class: F(l(ve))
     }, [
       l(b) ? (m(), _("label", {
         key: 0,
         for: l(g),
         class: "vv-textarea__label"
-      }, R(l(b)), 9, Bl)) : w("", !0),
-      O("div", Nl, [
-        C(le.$slots, "before", K(te(l(J))), () => [
-          l(I) ? (m(), B(M, E({
+      }, L(l(b)), 9, Fl)) : P("", !0),
+      E("div", Kl, [
+        A(q.$slots, "before", K(ee(l(re))), () => [
+          l(I) ? (m(), T(M, R({
             key: 0,
             class: "vv-textarea__icon-left"
-          }, l(V)), null, 16)) : w("", !0)
+          }, l(V)), null, 16)) : P("", !0)
         ]),
-        ye(O("textarea", E({
+        Se(E("textarea", R({
           id: l(g),
           ref_key: "textarea",
           ref: o,
-          "onUpdate:modelValue": W[0] || (W[0] = (k) => Se(f) ? f.value = k : null)
-        }, l(ne), {
-          onKeyup: W[1] || (W[1] = (k) => a("keyup", k))
-        }), null, 16, xl), [
-          [st, l(f)]
+          "onUpdate:modelValue": w[0] || (w[0] = (Z) => $e(f) ? f.value = Z : null)
+        }, l(se), {
+          onKeyup: w[1] || (w[1] = (Z) => a("keyup", Z))
+        }), null, 16, Wl), [
+          [it, l(f)]
         ]),
-        C(le.$slots, "after", K(te(l(J))), () => [
-          l(A) ? (m(), B(M, K(E({ key: 0 }, l(V))), null, 16)) : w("", !0)
+        A(q.$slots, "after", K(ee(l(re))), () => [
+          l($) ? (m(), T(M, K(R({ key: 0 }, l(V))), null, 16)) : P("", !0)
         ]),
-        l(d) ? (m(), _("span", Hl, [
-          C(le.$slots, "count", K(te(l(J))), () => [
-            X(R(l($)), 1)
+        l(d) ? (m(), _("span", zl, [
+          A(q.$slots, "count", K(ee(l(re))), () => [
+            X(L(l(H)), 1)
           ])
-        ])) : w("", !0)
+        ])) : P("", !0)
       ]),
-      oe(l(ae), {
+      le(l(oe), {
         id: l(h),
         class: "vv-textarea__hint"
       }, null, 8, ["id"])
@@ -2287,23 +2357,23 @@ const ml = ["for"], bl = ["id", "name", "disabled", "value", "tabindex", "aria-i
   }
 });
 export {
-  Zt as VvAccordion,
-  Wl as VvAccordionGroup,
-  Kl as VvBadge,
-  zl as VvBreadcrumb,
-  ql as VvButton,
-  Xl as VvButtonGroup,
-  Zl as VvCard,
-  Oa as VvCheckbox,
-  Yl as VvCheckboxGroup,
-  Jl as VvCombobox,
-  Ql as VvDialog,
-  Ua as VvDropdown,
+  ea as VvAccordion,
+  Ql as VvAccordionGroup,
+  eo as VvBadge,
+  to as VvBreadcrumb,
+  ao as VvButton,
+  lo as VvButtonGroup,
+  oo as VvCard,
+  Da as VvCheckbox,
+  no as VvCheckboxGroup,
+  so as VvCombobox,
+  ro as VvDialog,
+  za as VvDropdown,
   M as VvIcon,
-  eo as VvInputText,
-  to as VvProgress,
-  hl as VvRadio,
-  ao as VvRadioGroup,
-  lo as VvSelect,
-  oo as VvTextarea
+  io as VvInputText,
+  uo as VvProgress,
+  Dl as VvRadio,
+  co as VvRadioGroup,
+  al as VvSelect,
+  vo as VvTextarea
 };