@volverjs/ui-vue 0.0.3 → 0.0.4

package/dist/index.es.js

@@ -1,39 +1,526 @@
-var At = Object.defineProperty;
-var wt = (o, a, e) => a in o ? At(o, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[a] = e;
-var Ie = (o, a, e) => (wt(o, typeof a != "symbol" ? a + "" : a, e), e);
-import { addCollection as Et, addIcon as rt, addAPIProvider as It, iconExists as Re, Icon as Pt } from "@iconify/vue";
-import { defineComponent as q, openBlock as d, createElementBlock as y, normalizeClass as Z, unref as t, renderSlot as $, createTextVNode as X, toDisplayString as x, render as Ot, withModifiers as it, createElementVNode as N, normalizeProps as j, guardReactiveProps as F, Fragment as ne, renderList as ke, createBlock as W, mergeProps as G, withCtx as ve, resolveDynamicComponent as ut, createCommentVNode as w, withDirectives as Se, isRef as Ce, vModelCheckbox as Dt, createVNode as de, Transition as dt, normalizeStyle as Qe, vShow as qe, vModelSelect as Bt, createSlots as Rt, vModelText as ct, toHandlers as Tt, vModelDynamic as Mt, vModelRadio as xt } from "vue";
-import { nanoid as Nt } from "nanoid";
-import { autoPlacement as Ze, flip as et, shift as tt, size as ot, offset as Ge, arrow as Lt, useFloating as Ht, autoUpdate as Gt } from "@floating-ui/vue";
-const Ut = "vv";
-var be = /* @__PURE__ */ ((o) => (o.left = "left", o.right = "right", o.top = "top", o.bottom = "bottom", o))(be || {}), vt = /* @__PURE__ */ ((o) => (o.topStart = "top-start", o.topEnd = "top-end", o.bottomStart = "bottom-start", o.bottomEnd = "bottom-end", o.leftStart = "left-start", o.leftEnd = "left-end", o.rightStart = "right-start", o.rightEnd = "right-end", o))(vt || {}), je = /* @__PURE__ */ ((o) => (o.before = "before", o.after = "after", o))(je || {});
-const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for("radioGroup"), mt = Symbol.for("checkGroup"), bt = Symbol.for("accordionGroup"), Pe = {
+import { addCollection as cl, addIcon as Nt, addAPIProvider as vl, iconExists as Ye, Icon as fl } from "@iconify/vue";
+import { unref as a, inject as We, computed as n, toRef as pl, toRefs as G, defineComponent as j, useAttrs as yt, ref as N, openBlock as f, createElementBlock as g, normalizeClass as le, withModifiers as Rt, createElementVNode as x, renderSlot as V, normalizeProps as K, guardReactiveProps as z, createTextVNode as Y, toDisplayString as T, isRef as Ee, provide as gt, watchEffect as _t, Fragment as ie, renderList as Ne, createBlock as H, mergeProps as R, withCtx as te, resolveDynamicComponent as Ht, createCommentVNode as w, watch as ve, useSlots as Ae, h as be, onMounted as ml, withDirectives as Oe, vModelCheckbox as bl, createVNode as pe, nextTick as Xe, Transition as xt, normalizeStyle as It, vShow as St, vModelSelect as hl, createSlots as yl, vModelText as Mt, toHandlers as gl, vModelDynamic as _l, vModelRadio as Sl } from "vue";
+import { nanoid as Gt } from "nanoid";
+import { useToggle as Vl, toReactive as $l, useVModel as et, onClickOutside as jt, useFocusWithin as Vt, onKeyStroke as He, useElementHover as kl, useFocus as Wt, useElementVisibility as $t, refDebounced as Al } from "@vueuse/core";
+import { autoPlacement as Et, flip as Pt, shift as Ot, size as Dt, offset as ct, arrow as Cl, useFloating as wl, autoUpdate as Il } from "@floating-ui/vue";
+import El from "mitt";
+const Pl = "vv";
+var fe = /* @__PURE__ */ ((t) => (t.left = "left", t.right = "right", t.top = "top", t.bottom = "bottom", t))(fe || {}), Ut = /* @__PURE__ */ ((t) => (t.topStart = "top-start", t.topEnd = "top-end", t.bottomStart = "bottom-start", t.bottomEnd = "bottom-end", t.leftStart = "left-start", t.leftEnd = "left-end", t.rightStart = "right-start", t.rightEnd = "right-end", t))(Ut || {}), Ge = /* @__PURE__ */ ((t) => (t.before = "before", t.after = "after", t))(Ge || {}), pt = /* @__PURE__ */ ((t) => (t.button = "button", t.submit = "submit", t.reset = "reset", t))(pt || {}), ke = /* @__PURE__ */ ((t) => (t.nuxtLink = "nuxt-link", t.routerLink = "router-link", t.a = "a", t.button = "button", t))(ke || {}), Ft = /* @__PURE__ */ ((t) => (t.button = "button", t.link = "link", t.menuitem = "menuitem", t))(Ft || {}), je = /* @__PURE__ */ ((t) => (t.listbox = "listbox", t.menu = "menu", t))(je || {}), mt = /* @__PURE__ */ ((t) => (t.option = "option", t.presentation = "presentation", t))(mt || {}), Kt = /* @__PURE__ */ ((t) => (t._blank = "_blank", t._self = "_self", t._parent = "_parent", t._top = "_top", t))(Kt || {});
+const zt = Symbol.for("volver"), qt = Symbol.for("buttonGroup"), Yt = Symbol.for("radioGroup"), Jt = Symbol.for("checkGroup"), Xt = Symbol.for("accordionGroup"), Qt = Symbol.for("dropdownTrigger"), Zt = Symbol.for("dropdownItem"), el = Symbol.for("dropdownAction");
+function Lt(t, l, e) {
+  const s = e || t.name;
+  if (!s)
+    return t;
+  const o = l == null ? void 0 : l[s], u = t.props;
+  return !o || !u ? { ...t, name: s } : {
+    ...t,
+    name: s,
+    props: Object.keys(u).reduce((d, c) => {
+      if (!(c in o))
+        return d[c] = u[c], d;
+      const v = o[c];
+      return typeof u[c] == "function" || Array.isArray(u[c]) ? (d[c] = {
+        type: u[c],
+        default: v
+      }, d) : (d[c] = {
+        ...u[c],
+        default: v
+      }, d);
+    }, {})
+  };
+}
+class Ol {
+  constructor({
+    fetchWithCredentials: l,
+    fetchOptions: e,
+    provider: s,
+    nuxt: o,
+    iconsCollections: u
+  } = {}) {
+    this.fetchOptions = {}, this.nuxt = !1, this.iconsCollections = [], this.provider = Pl, e && (this.fetchOptions = e), l && (this.fetchOptions = { ...this.fetchOptions, credentials: "include" }), s && (this.provider = s), o && (this.nuxt = o), u && Array.isArray(u) && u.forEach((d) => {
+      this.addCollection(d, this.provider);
+    });
+  }
+  addCollection(l, e) {
+    return this.iconsCollections = [...this.iconsCollections, l], cl(l, e ?? this.provider);
+  }
+  addIcon(l, e) {
+    return Nt(l, e);
+  }
+  addAPIProvider(l, e) {
+    return vl(l, e);
+  }
+  fetchIcon(l, e = { cache: "force-cache" }) {
+    return new Promise((s, o) => {
+      fetch(l, { ...this.fetchOptions, ...e }).catch((u) => o(u)).then((u) => u == null ? void 0 : u.text()).then((u) => s(u));
+    });
+  }
+}
+const ms = {
+  /**
+   * Vue.use() hook
+   * @param {App} Vue
+   * @param {Object} options
+   */
+  install(t, l) {
+    const e = new Ol(l);
+    t.config.globalProperties.$vv = e, l.components && Object.entries(l.components).forEach(([s, o]) => {
+      t.component(
+        s,
+        Lt(o, l.defaults)
+      );
+    }), l.aliases && Object.entries(l.aliases).forEach(([s, o]) => {
+      t.component(
+        s,
+        Lt(o, l.defaults, s)
+      );
+    }), l.directives && Object.entries(l.directives).forEach(([s, o]) => {
+      t.directive(s, o);
+    }), t.provide(zt, e);
+  }
+};
+function Pe(t, l, e) {
+  return e ? Ze(t, e) === Ze(l, e) : bt(t, l);
+}
+function bt(t, l) {
+  if (t === l)
+    return !0;
+  if (t && l && typeof t == "object" && typeof l == "object") {
+    const e = Array.isArray(t), s = Array.isArray(l);
+    let o, u, d;
+    if (e && s) {
+      if (u = t.length, u != l.length)
+        return !1;
+      for (o = u; o-- !== 0; )
+        if (!bt(t[o], l[o]))
+          return !1;
+      return !0;
+    }
+    if (e != s)
+      return !1;
+    const c = t instanceof Date, v = l instanceof Date;
+    if (c != v)
+      return !1;
+    if (c && v)
+      return t.getTime() == l.getTime();
+    const p = t instanceof RegExp, r = l instanceof RegExp;
+    if (p != r)
+      return !1;
+    if (p && r)
+      return t.toString() == l.toString();
+    const i = Object.keys(t);
+    if (u = i.length, u !== Object.keys(l).length)
+      return !1;
+    for (o = u; o-- !== 0; )
+      if (!Object.prototype.hasOwnProperty.call(l, i[o]))
+        return !1;
+    for (o = u; o-- !== 0; )
+      if (d = i[o], !bt(t[d], l[d]))
+        return !1;
+    return !0;
+  }
+  return t !== t && l !== l;
+}
+function Ze(t, l) {
+  if (t && Object.keys(t).length && l) {
+    if (l.indexOf(".") === -1)
+      return t[l];
+    {
+      const e = l.split(".");
+      let s = t;
+      for (let o = 0, u = e.length; o < u; ++o) {
+        if (t == null)
+          return null;
+        s = s[e[o]];
+      }
+      return s;
+    }
+  } else
+    return null;
+}
+function Dl(t, l) {
+  let e = -1;
+  if (l) {
+    for (let s = 0; s < l.length; s++)
+      if (Pe(l[s], t)) {
+        e = s;
+        break;
+      }
+  }
+  return e;
+}
+function we(t, l) {
+  if (t != null && l && l.length) {
+    for (const e of l)
+      if (Pe(t, e))
+        return !0;
+  }
+  return !1;
+}
+function ge(t) {
+  return ((l) => l == null || l === "" || Array.isArray(l) && l.length === 0 || !(l instanceof Date) && typeof l == "object" && Object.keys(l).length === 0)(a(t));
+}
+function Ll(t, l) {
+  const e = Dl(t, l);
+  return e > -1 ? l.filter((s, o) => o !== e) : l;
+}
+function Bl(t) {
+  return typeof t == "string" || t instanceof String;
+}
+function tt(t) {
+  const l = We(t, void 0), e = n(() => !ge(l));
+  function s(o, u, d) {
+    if (l != null && l.value) {
+      const v = a(l.value)[o];
+      return n({
+        get() {
+          return v == null ? void 0 : v.value;
+        },
+        set(p) {
+          v.value = p;
+        }
+      });
+    }
+    const c = pl(u, o);
+    return n({
+      get() {
+        return c.value;
+      },
+      set(v) {
+        d && d(`update:${o}`, v);
+      }
+    });
+  }
+  return {
+    group: l,
+    isInGroup: e,
+    getGroupOrLocalRef: s
+  };
+}
+const Tl = {
+  /**
+   * Accordion name
+   */
+  name: String,
+  /**
+   * Header title
+   */
+  title: String,
+  /**
+   * Content text
+   */
+  content: String,
+  /**
+   * (Optional) Defines if item is open. Event "update:modelValue" is emitted on accordion header click
+   */
+  modelValue: {
+    type: Boolean,
+    default: void 0
+  },
+  /**
+   * String or String[] of css classes (modifiers) that will be concatenated to prefix 'vv-accordion--'
+   */
+  modifiers: [String, Array],
+  /**
+   * If true, the accordion will be disabled
+   */
+  disabled: Boolean
+}, Nl = ["update:modelValue"];
+function Rl(t, l) {
+  const { group: e, isInGroup: s, getGroupOrLocalRef: o } = tt(
+    Xt
+  ), { title: u, content: d } = G(t), c = o("modelValue", t, l), v = o("disabled", t), p = o("collapse", t), r = o("modifiers", t);
+  return {
+    // group props
+    modelValue: c,
+    disabled: v,
+    isInGroup: s,
+    group: e,
+    collapse: p,
+    modifiers: r,
+    // local props
+    title: u,
+    content: d
+  };
+}
+function X(t, l, e) {
+  return n(() => {
+    const s = {
+      [t]: !0
+    }, o = typeof (l == null ? void 0 : l.value) == "string" ? l.value.split(" ") : l == null ? void 0 : l.value;
+    return o && Array.isArray(o) && o.forEach((u) => {
+      s[`${t}--${u}`] = !0;
+    }), e && Object.keys(e.value).forEach((u) => {
+      s[`${t}--${u}`] = a(e.value[u]);
+    }), s;
+  });
+}
+const Hl = ["id", "open"], xl = ["aria-controls", "aria-expanded"], Ml = ["aria-hidden"], Gl = {
+  name: "VvAccordion"
+}, jl = /* @__PURE__ */ j({
+  ...Gl,
+  props: Tl,
+  emits: Nl,
+  setup(t, { emit: l }) {
+    const e = t, s = yt(), o = n(
+      () => e.name || (s == null ? void 0 : s.id) || Gt()
+    ), {
+      modifiers: u,
+      title: d,
+      content: c,
+      disabled: v,
+      collapse: p,
+      modelValue: r,
+      isInGroup: i
+    } = Rl(e, l), b = N(!1), _ = n({
+      get: () => i.value ? p.value && Array.isArray(r.value) ? r.value.includes(o.value) : r.value === o.value : r.value === void 0 ? b.value : r.value,
+      set: (y) => {
+        if (i.value) {
+          if (p.value && Array.isArray(r.value)) {
+            if (y) {
+              r.value.push(o.value);
+              return;
+            }
+            r.value = r.value.filter(
+              (m) => m !== o.value
+            );
+            return;
+          }
+          r.value = y ? o.value : null;
+          return;
+        }
+        if (r.value === void 0 && typeof y == "boolean") {
+          b.value = y;
+          return;
+        }
+        r.value = y;
+      }
+    }), k = X(
+      "vv-accordion",
+      u,
+      n(() => ({
+        disabled: v.value
+      }))
+    ), A = Vl(_);
+    return (y, m) => (f(), g("details", {
+      id: a(o),
+      class: le(a(k)),
+      open: a(_),
+      onClick: m[0] || (m[0] = Rt((I) => a(A)(), ["prevent"]))
+    }, [
+      x("summary", {
+        "aria-controls": a(o),
+        "aria-expanded": a(_),
+        class: "vv-collapse__summary"
+      }, [
+        V(y.$slots, "summary", K(z({ open: a(_) })), () => [
+          Y(T(a(d)), 1)
+        ])
+      ], 8, xl),
+      x("div", {
+        "aria-hidden": !a(_),
+        class: "vv-collapse__content"
+      }, [
+        V(y.$slots, "details", K(z({ open: a(_) })), () => [
+          Y(T(a(c)), 1)
+        ])
+      ], 8, Ml)
+    ], 10, Hl));
+  }
+}), Wl = {
+  /**
+   * VModel
+   */
+  modelValue: [String, Array],
+  /**
+   * Accordion items
+   * @type VvAccordionGroupItem
+   */
+  items: { type: Array, default: () => [] },
+  /**
+   * If true, accordion items stay open when another item is opened
+   */
+  collapse: Boolean,
+  /**
+   * String or String[] of css classes (modifiers) that will be concatenated to prefix 'vv-accordion-group--'
+   */
+  modifiers: [String, Array],
+  /**
+   * String or String[] of css classes (modifiers) that will be concatenated to prefix 'vv-accordion--'
+   */
+  itemModifiers: {
+    type: [String, Array],
+    default: ""
+  },
+  /**
+   * If true, the accordion items will be disabled
+   */
+  disabled: Boolean
+}, Ul = ["update:modelValue"];
+function lt(t) {
+  if (Object.keys(t).some(
+    (l) => l !== "key" && !Ee(t[l])
+  ))
+    throw Error("One or more groupState props aren't ref.");
+  gt(
+    t.key,
+    n(() => t)
+  );
+}
+const Fl = {
+  name: "VvAccordionGroup"
+}, bs = /* @__PURE__ */ j({
+  ...Fl,
+  props: Wl,
+  emits: Ul,
+  setup(t, { emit: l }) {
+    const e = t, { disabled: s, collapse: o, modifiers: u, itemModifiers: d, items: c } = G(e);
+    _t(() => {
+      typeof e.modelValue == "string" && o.value && console.warn(
+        "[VvAccordionGroup]: modelValue is a string but collapse is true."
+      );
+    });
+    const v = N([]), p = n({
+      get: () => {
+        var i;
+        return e.modelValue !== void 0 ? o.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue : o.value ? v.value : (i = v.value) == null ? void 0 : i[0];
+      },
+      set: (i) => {
+        if (e.modelValue !== void 0)
+          return (Array.isArray(e.modelValue) || o.value) && !Array.isArray(i) && (i = [i]), l("update:modelValue", i);
+        v.value = Array.isArray(i) ? i : [i];
+      }
+    });
+    lt({
+      key: Xt,
+      modelValue: p,
+      disabled: s,
+      collapse: o,
+      modifiers: d
+    });
+    const r = X(
+      "vv-accordion-group",
+      u,
+      n(() => ({
+        disabled: s.value
+      }))
+    );
+    return (i, b) => (f(), g("div", {
+      class: le(a(r))
+    }, [
+      V(i.$slots, "default", {}, () => [
+        (f(!0), g(ie, null, Ne(a(c), (_) => (f(), H(jl, R({
+          key: _.title
+        }, {
+          name: _.name,
+          title: _.title,
+          content: _.content
+        }), {
+          header: te((k) => [
+            V(i.$slots, `header::${_.name}`, K(z(k)))
+          ]),
+          details: te((k) => [
+            V(i.$slots, `details::${_.name}`, K(z(k)))
+          ]),
+          _: 2
+        }, 1040))), 128))
+      ])
+    ], 2));
+  }
+}), Kl = {
+  /**
+   * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
+   * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
+   */
+  to: {
+    type: [String, Object]
+  },
+  /**
+   * Anchor href
+   */
+  href: String,
+  /**
+   * Anchor target
+   */
+  target: {
+    type: String,
+    validator: (t) => Object.values(Kt).includes(t)
+  },
+  /**
+   * Anchor rel
+   */
+  rel: {
+    type: String,
+    default: "noopener noreferrer"
+  }
+}, Ue = {
+  /**
+   * Valid status
+   */
   valid: Boolean,
+  /**
+   * Valid label
+   */
   validLabel: [String, Array]
-}, Oe = {
+}, Fe = {
+  /**
+   * Invalid status
+   */
   invalid: Boolean,
+  /**
+   * Invalid label
+   */
   invalidLabel: [String, Array]
-}, Ke = {
+}, at = {
+  /**
+   * Loading status
+   */
   loading: Boolean,
-  loadingLabel: String
-}, Ae = {
+  /**
+   * Loading label
+   */
+  loadingLabel: {
+    type: String,
+    default: "Loading..."
+  }
+}, De = {
   /**
    * Whether the form control is disabled
    */
   disabled: Boolean
-}, De = {
+}, zl = {
+  /**
+   * Whether the item is selected
+   */
+  selected: Boolean
+}, ql = {
+  /**
+   * Whether the item is active
+   */
+  active: Boolean
+}, Yl = {
+  /**
+   * Whether the item is pressed
+   */
+  pressed: Boolean
+}, xe = {
+  /**
+   * The item label
+   */
+  label: [String, Number]
+}, Ke = {
   /**
    * The value is not editable
    */
   readonly: Boolean
-}, ce = {
+}, me = {
   /**
    * Component BEM modifiers
    */
   modifiers: [String, Array]
-}, Be = {
-  hintLabel: { type: String, default: "" }
 }, ze = {
+  hintLabel: { type: String, default: "" }
+}, kt = {
   /**
    * List of options, can be string[] or object[]
    */
@@ -53,21 +540,21 @@ const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for
    * Used when options are objects: key to use for option disabled
    */
   disabledKey: { type: [String, Function], default: "disabled" }
-}, jt = {
+}, Jl = {
   /**
    * Show character limit
    */
   count: {
     type: [Boolean, String],
     default: !1,
-    validator: (o) => [!0, !1, "limit", "countdown"].includes(o)
+    validator: (t) => [!0, !1, "limit", "countdown"].includes(t)
   }
-}, Ft = {
+}, Xl = {
   /**
    * Milliseconds to wait before emitting the input event
    */
   debounce: [Number, String]
-}, Ye = {
+}, At = {
   /**
    * VvIcon name or props
    * @see VVIcon
@@ -78,39 +565,39 @@ const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for
    */
   iconPosition: {
     type: String,
-    default: je.before,
-    validation: (o) => Object.values(je).includes(o)
+    default: Ge.before,
+    validation: (t) => Object.values(Ge).includes(t)
   }
-}, Me = {
+}, ot = {
   /**
    * Global attribute tabindex
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
    */
   tabindex: { type: [String, Number], default: 0 }
-}, Je = {
+}, Ct = {
   /**
    * If true the label will be floating
    */
   floating: Boolean
-}, xe = {
+}, qe = {
   /**
    * If true the input will be unselectable
    */
   unselectable: { type: Boolean, default: !0 }
-}, Ne = {
+}, st = {
   /**
    * Global attribute id
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
    */
   id: [String, Number]
-}, Fe = {
+}, ht = {
   /**
    * Dropdown placement
    */
   placement: {
     type: String,
-    default: be.bottom,
-    validator: (o) => Object.values(be).includes(o) || Object.values(vt).includes(o)
+    default: fe.bottom,
+    validator: (t) => Object.values(fe).includes(t) || Object.values(Ut).includes(t)
   },
   /**
    * Dropdown show / hide transition name
@@ -186,42 +673,43 @@ const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for
   triggerWidth: {
     type: Boolean
   }
-}, Le = {
-  ...Ne,
+}, nt = {
+  ...st,
   /**
    * Input / Textarea name
    * Name of the form control. Submitted with the form as part of a name/value pair
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name
    */
   name: { type: String, required: !0 }
-}, ht = {
+}, tl = {
   /**
    * Global attribute autofocus
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus
    */
   autofocus: Boolean
-}, yt = {
+}, ll = {
   /**
    * Global attribute autocomplete
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
    */
   autocomplete: { type: String, default: "off" }
-}, gt = {
-  ...Le,
-  ...ht,
-  ...yt,
-  ...Me,
-  ...Ae,
+}, al = {
+  ...nt,
+  ...tl,
+  ...ll,
+  ...ot,
   ...De,
-  ...Pe,
-  ...Oe,
-  ...Be,
   ...Ke,
-  ...ce,
-  ...jt,
-  ...Ft,
-  ...Ye,
-  ...Je,
+  ...Ue,
+  ...Fe,
+  ...ze,
+  ...at,
+  ...me,
+  ...Jl,
+  ...Xl,
+  ...At,
+  ...Ct,
+  ...xe,
   /**
    * Input / Textarea minlength
    * Minimum length (number of characters) of value
@@ -249,20 +737,17 @@ const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for
    * Available for all input types except color
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#required
    */
-  required: Boolean,
-  /**
-   * <label> value for the Input / Textarea
-   */
-  label: String
-}, _t = {
-  ...Le,
-  ...Me,
-  ...Pe,
-  ...Oe,
-  ...Be,
-  ...Ae,
+  required: Boolean
+}, ol = {
+  ...nt,
+  ...ot,
+  ...Ue,
+  ...Fe,
+  ...ze,
   ...De,
-  ...ce,
+  ...Ke,
+  ...me,
+  ...xe,
   /**
    * Input value
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value
@@ -271,27 +756,20 @@ const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for
   /**
    * Input value
    */
-  modelValue: [Object, Number, Boolean, String],
-  /**
-   * <label> for input
-   */
-  label: String
-}, St = {
-  ...Pe,
-  ...Oe,
+  modelValue: [Object, Number, Boolean, String]
+}, sl = {
+  ...Ue,
+  ...Fe,
+  ...kt,
   ...ze,
-  ...Be,
-  ...Ae,
   ...De,
-  ...ce,
+  ...Ke,
+  ...me,
+  ...xe,
   /**
    * Input value
    */
   modelValue: [String, Array],
-  /**
-   * Input label
-   */
-  label: String,
   /**
    * Input name
    */
@@ -300,417 +778,90 @@ const Wt = Symbol.for("volver"), pt = Symbol.for("buttonGroup"), ft = Symbol.for
    * If true, the group will be displayed in a vertical column
    */
   vertical: Boolean
-}, qt = {
-  ...ce,
-  /**
-   * Define the tooltip position
-   * @default Side.bottom
-   */
-  position: {
-    type: String,
-    default: be.bottom
-  },
-  value: {
-    type: String
-  }
-}, Kt = /* @__PURE__ */ q({
-  __name: "VvTooltip",
-  props: qt,
-  setup(o) {
-    const a = o, { modifiers: e } = toRefs(a), s = useBemModifiers(
-      "vv-tooltip",
-      e,
-      computed(() => ({
-        [a.position]: !0
-      }))
-    );
-    return (l, i) => (d(), y("span", {
-      class: Z(t(s)),
-      role: "tooltip",
-      inert: ""
-    }, [
-      $(l.$slots, "default", {}, () => [
-        X(x(l.value), 1)
-      ])
-    ], 2));
-  }
-}), zt = {
-  beforeMount(o, a) {
-    const e = h(Kt, {
-      value: a.value,
-      position: a.arg
-    });
-    Ot(e, o);
-  }
-}, Yt = {
-  tooltip: zt
-};
-function at(o, a, e) {
-  const s = e || o.name;
-  if (!s)
-    return o;
-  const l = a == null ? void 0 : a[s], i = o.props;
-  return !l || !i ? { ...o, name: s } : {
-    ...o,
-    name: s,
-    props: Object.keys(i).reduce((u, c) => {
-      if (!(c in l))
-        return u[c] = i[c], u;
-      const p = l[c];
-      return typeof i[c] == "function" || Array.isArray(i[c]) ? (u[c] = {
-        type: i[c],
-        default: p
-      }, u) : (u[c] = {
-        ...i[c],
-        default: p
-      }, u);
-    }, {})
-  };
-}
-class Jt {
-  constructor({
-    fetchWithCredentials: a,
-    fetchOptions: e,
-    provider: s,
-    nuxt: l,
-    iconsCollections: i
-  } = {}) {
-    Ie(this, "fetchOptions", {});
-    Ie(this, "nuxt", !1);
-    Ie(this, "iconsCollections", []);
-    Ie(this, "provider", Ut);
-    e && (this.fetchOptions = e), a && (this.fetchOptions = { ...this.fetchOptions, credentials: "include" }), s && (this.provider = s), l && (this.nuxt = l), i && Array.isArray(i) && i.forEach((u) => {
-      this.addCollection(u, this.provider);
-    });
-  }
-  addCollection(a, e) {
-    return this.iconsCollections = [...this.iconsCollections, a], Et(a, e ?? this.provider);
-  }
-  addIcon(a, e) {
-    return rt(a, e);
-  }
-  addAPIProvider(a, e) {
-    return It(a, e);
-  }
-  fetchIcon(a, e = { cache: "force-cache" }) {
-    return new Promise((s, l) => {
-      fetch(a, { ...this.fetchOptions, ...e }).catch((i) => l(i)).then((i) => i == null ? void 0 : i.text()).then((i) => s(i));
-    });
-  }
-}
-const pl = {
-  /**
-   * Vue.use() hook
-   * @param {App} Vue
-   * @param {Object} options
-   */
-  install(o, a) {
-    const e = new Jt(a);
-    o.config.globalProperties.$vv = e, a.components && Object.entries(a.components).forEach(([s, l]) => {
-      o.component(
-        s,
-        at(l, a.defaults)
-      );
-    }), a.aliases && Object.entries(a.aliases).forEach(([s, l]) => {
-      o.component(
-        s,
-        at(l, a.defaults, s)
-      );
-    }), Object.entries(Yt).forEach(([s, l]) => {
-      o.directive(s, l);
-    }), o.provide(Wt, e);
-  }
-}, Xt = {
-  /**
-   * Accordion name
-   */
-  name: String,
-  /**
-   * Header title
-   */
-  title: String,
-  /**
-   * Content text
-   */
-  content: String,
-  /**
-   * (Optional) Defines if item is open. Event "update:modelValue" is emitted on accordion header click
-   */
-  modelValue: {
-    type: Boolean,
-    default: void 0
-  },
-  /**
-   * String or String[] of css classes (modifiers) that will be concatenated to prefix 'vv-accordion--'
-   */
-  modifiers: [String, Array],
-  /**
-   * If true, the accordion will be disabled
-   */
-  disabled: Boolean
-}, Qt = ["update:modelValue"];
-function Zt(o, a) {
-  const { group: e, isInGroup: s, getGroupOrLocalRef: l } = useInjectedGroupState(
-    bt
-  ), { title: i, content: u } = toRefs(o), c = l("modelValue", o, a), p = l("disabled", o), v = l("collapse", o), n = l("modifiers", o);
-  return {
-    // group props
-    modelValue: c,
-    disabled: p,
-    isInGroup: s,
-    group: e,
-    collapse: v,
-    modifiers: n,
-    // local props
-    title: i,
-    content: u
-  };
-}
-const eo = ["id", "open"], to = ["aria-controls", "aria-expanded"], oo = ["aria-hidden"], ao = {
-  name: "VvAccordion"
-}, lo = /* @__PURE__ */ q({
-  ...ao,
-  props: Xt,
-  emits: Qt,
-  setup(o, { emit: a }) {
-    const e = o, s = useAttrs(), l = computed(
-      () => e.name || (s == null ? void 0 : s.id) || Nt()
-    ), {
-      modifiers: i,
-      title: u,
-      content: c,
-      disabled: p,
-      collapse: v,
-      modelValue: n,
-      isInGroup: r
-    } = Zt(e, a), f = ref(!1), g = computed({
-      get: () => r.value ? v.value && Array.isArray(n.value) ? n.value.includes(l.value) : n.value === l.value : n.value === void 0 ? f.value : n.value,
-      set: (b) => {
-        if (r.value) {
-          if (v.value && Array.isArray(n.value)) {
-            if (b) {
-              n.value.push(l.value);
-              return;
-            }
-            n.value = n.value.filter(
-              (S) => S !== l.value
-            );
-            return;
-          }
-          n.value = b ? l.value : null;
-          return;
-        }
-        if (n.value === void 0 && typeof b == "boolean") {
-          f.value = b;
-          return;
-        }
-        n.value = b;
-      }
-    }), k = useBemModifiers(
-      "vv-accordion",
-      i,
-      computed(() => ({
-        disabled: p.value
-      }))
-    ), A = useToggle(g);
-    return (b, S) => (d(), y("details", {
-      id: t(l),
-      class: Z(t(k)),
-      open: t(g),
-      onClick: S[0] || (S[0] = it((I) => t(A)(), ["prevent"]))
-    }, [
-      N("summary", {
-        "aria-controls": t(l),
-        "aria-expanded": t(g),
-        class: "vv-collapse__summary"
-      }, [
-        $(b.$slots, "summary", j(F({ open: t(g) })), () => [
-          X(x(t(u)), 1)
-        ])
-      ], 8, to),
-      N("div", {
-        "aria-hidden": !t(g),
-        class: "vv-collapse__content"
-      }, [
-        $(b.$slots, "details", j(F({ open: t(g) })), () => [
-          X(x(t(c)), 1)
-        ])
-      ], 8, oo)
-    ], 10, eo));
-  }
-}), so = {
-  /**
-   * VModel
-   */
-  modelValue: [String, Array],
-  /**
-   * Accordion items
-   * @type VvAccordionGroupItem
-   */
-  items: { type: Array, default: () => [] },
-  /**
-   * If true, accordion items stay open when another item is opened
-   */
-  collapse: Boolean,
-  /**
-   * String or String[] of css classes (modifiers) that will be concatenated to prefix 'vv-accordion-group--'
-   */
-  modifiers: [String, Array],
-  /**
-   * String or String[] of css classes (modifiers) that will be concatenated to prefix 'vv-accordion--'
-   */
-  itemModifiers: {
-    type: [String, Array],
-    default: ""
-  },
-  /**
-   * If true, the accordion items will be disabled
-   */
-  disabled: Boolean
-}, no = ["update:modelValue"], ro = {
-  name: "VvAccordionGroup"
-}, fl = /* @__PURE__ */ q({
-  ...ro,
-  props: so,
-  emits: no,
-  setup(o, { emit: a }) {
-    const e = o, { disabled: s, collapse: l, modifiers: i, itemModifiers: u, items: c } = toRefs(e);
-    watchEffect(() => {
-      typeof e.modelValue == "string" && l.value && console.warn(
-        "[VvAccordionGroup]: modelValue is a string but collapse is true."
-      );
-    });
-    const p = ref([]), v = computed({
-      get: () => {
-        var r;
-        return e.modelValue !== void 0 ? l.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue : l.value ? p.value : (r = p.value) == null ? void 0 : r[0];
-      },
-      set: (r) => {
-        if (e.modelValue !== void 0)
-          return (Array.isArray(e.modelValue) || l.value) && !Array.isArray(r) && (r = [r]), a("update:modelValue", r);
-        p.value = Array.isArray(r) ? r : [r];
-      }
-    });
-    useProvideGroupState({
-      key: bt,
-      modelValue: v,
-      disabled: s,
-      collapse: l,
-      modifiers: u
-    });
-    const n = useBemModifiers(
-      "vv-accordion-group",
-      i,
-      computed(() => ({
-        disabled: s.value
-      }))
-    );
-    return (r, f) => (d(), y("div", {
-      class: Z(t(n))
-    }, [
-      $(r.$slots, "default", {}, () => [
-        (d(!0), y(ne, null, ke(t(c), (g) => (d(), W(lo, G({
-          key: g.title
-        }, {
-          name: g.name,
-          title: g.title,
-          content: g.content
-        }), {
-          header: ve((k) => [
-            $(r.$slots, `header::${g.name}`, j(F(k)))
-          ]),
-          details: ve((k) => [
-            $(r.$slots, `details::${g.name}`, j(F(k)))
-          ]),
-          _: 2
-        }, 1040))), 128))
-      ])
-    ], 2));
+}, nl = {
+  ...De,
+  ...xe,
+  ...Yl,
+  ...ql,
+  ...Kl,
+  /**
+   * Button type
+   */
+  type: {
+    type: String,
+    default: pt.button,
+    validator: (t) => Object.values(pt).includes(t)
   }
-}), io = {
-  ...ce,
+}, Ql = {
+  ...me,
   value: [String, Number]
-}, uo = {
+}, Zl = {
   name: "VvBadge"
-}, co = /* @__PURE__ */ q({
-  ...uo,
-  props: io,
-  setup(o) {
-    const a = o, { modifiers: e } = toRefs(a), s = useBemModifiers("vv-badge", e);
-    return (l, i) => (d(), y("span", {
-      class: Z(t(s)),
+}, ea = /* @__PURE__ */ j({
+  ...Zl,
+  props: Ql,
+  setup(t) {
+    const l = t, { modifiers: e } = G(l), s = X("vv-badge", e);
+    return (o, u) => (f(), g("span", {
+      class: le(a(s)),
       role: "status"
     }, [
-      $(l.$slots, "default", {}, () => [
-        X(x(l.value), 1)
+      V(o.$slots, "default", {}, () => [
+        Y(T(o.value), 1)
       ])
     ], 2));
   }
-});
-function vo(o, a, e) {
-  return computed(() => {
-    const s = {
-      [o]: !0
-    };
-    let l = unref(a);
-    return l && (!Array.isArray(l) && typeof l == "string" && (l = l.split(" ")), Array.isArray(l) && l.forEach((i) => {
-      s[`${o}--${i}`] = !0;
-    })), e && Object.keys(e.value).forEach((i) => {
-      s[`${o}--${i}`] = unref(e.value[i]);
-    }), s;
-  });
-}
-const po = {
-  ...ce,
+}), ta = {
+  ...me,
   routes: Array
-}, fo = { class: "vv-breadcrumb__list" }, mo = ["content"], bo = {
+}, la = { class: "vv-breadcrumb__list" }, aa = ["content"], oa = {
   name: "VvBreadcrumb"
-}, ml = /* @__PURE__ */ q({
-  ...bo,
-  props: po,
-  setup(o) {
-    const a = o, { modifiers: e } = toRefs(a), s = vo("vv-breadcrumb", e);
-    return (l, i) => (d(), y("nav", {
-      class: Z(t(s)),
+}, hs = /* @__PURE__ */ j({
+  ...oa,
+  props: ta,
+  setup(t) {
+    const l = t, { modifiers: e } = G(l), s = X("vv-breadcrumb", e);
+    return (o, u) => (f(), g("nav", {
+      class: le(a(s)),
       "aria-label": "breadcrumbs"
     }, [
-      N("ol", fo, [
-        (d(!0), y(ne, null, ke(l.routes, (u, c) => {
-          var p, v, n, r;
-          return d(), y("li", {
-            key: `${u.label}-${c}`,
-            class: Z({
-              "vv-breadcrumb__item": c < Number((p = l.routes) == null ? void 0 : p.length) - 1,
-              "vv-breadcrumb__item-active": c === Number((v = l.routes) == null ? void 0 : v.length) - 1
+      x("ol", la, [
+        (f(!0), g(ie, null, Ne(o.routes, (d, c) => {
+          var v, p, r, i;
+          return f(), g("li", {
+            key: `${d.label}-${c}`,
+            class: le({
+              "vv-breadcrumb__item": c < Number((v = o.routes) == null ? void 0 : v.length) - 1,
+              "vv-breadcrumb__item-active": c === Number((p = o.routes) == null ? void 0 : p.length) - 1
             }),
             itemprop: "itemListElement",
             itemtype: "https://schema.org/ListItem",
             itemscope: ""
           }, [
-            (d(), W(ut(u.to ? "router-link" : u.href ? "a" : "span"), G(u, {
+            (f(), H(Ht(d.to ? "router-link" : d.href ? "a" : "span"), R(d, {
               class: {
-                "vv-breadcrumb__link": c < Number((n = l.routes) == null ? void 0 : n.length) - 1
+                "vv-breadcrumb__link": c < Number((r = o.routes) == null ? void 0 : r.length) - 1
               },
-              "aria-current": c === Number((r = l.routes) == null ? void 0 : r.length) - 1 ? "page" : void 0,
+              "aria-current": c === Number((i = o.routes) == null ? void 0 : i.length) - 1 ? "page" : void 0,
               itemprop: "item"
             }), {
-              default: ve(() => [
-                $(l.$slots, "label", j(F({ route: u, index: c })), () => [
-                  X(x(u.label), 1)
+              default: te(() => [
+                V(o.$slots, "label", K(z({ route: d, index: c })), () => [
+                  Y(T(d.label), 1)
                 ])
               ]),
               _: 2
             }, 1040, ["class", "aria-current"])),
-            N("meta", {
+            x("meta", {
               itemprop: "position",
               content: `${c + 1}`
-            }, null, 8, mo)
+            }, null, 8, aa)
           ], 2);
         }), 128))
       ])
     ], 2));
   }
-}), ho = {
+}), sa = {
   /**
    * Color
    */
@@ -803,66 +954,170 @@ const po = {
   modifiers: {
     type: [String, Array]
   }
-}, yo = {
+};
+function rl() {
+  return We(zt);
+}
+const na = {
   name: "VvIcon"
-}, Q = /* @__PURE__ */ q({
-  ...yo,
-  props: ho,
-  setup(o) {
-    const a = o, e = ref(!0), s = useVolver(), { modifiers: l } = toRefs(a), i = useBemModifiers("vv-icon", l), u = computed(() => a.provider || (s == null ? void 0 : s.provider)), c = computed(() => {
-      const n = a.name ?? "", r = `@${u.value}:${a.prefix}:${a.name}`;
-      return Re(n) ? n : Re(r) ? r : (s == null ? void 0 : s.iconsCollections.find(
-        (f) => {
-          const g = `@${u.value}:${f.prefix}:${n}`;
-          if (Re(g))
-            return g;
+}, ee = /* @__PURE__ */ j({
+  ...na,
+  props: sa,
+  setup(t) {
+    const l = t, e = N(!0), s = rl(), { modifiers: o } = G(l), u = X("vv-icon", o), d = n(() => l.provider || (s == null ? void 0 : s.provider)), c = n(() => {
+      const r = l.name ?? "", i = `@${d.value}:${l.prefix}:${l.name}`;
+      return Ye(r) ? r : Ye(i) ? i : (s == null ? void 0 : s.iconsCollections.find(
+        (b) => {
+          const _ = `@${d.value}:${b.prefix}:${r}`;
+          if (Ye(_))
+            return _;
         }
-      )) || n;
+      )) || r;
     });
-    function p(n) {
-      let r = null;
+    function v(r) {
+      let i = null;
       if (typeof window > "u") {
         const { JSDOM: A } = require("jsdom");
-        r = new A().window;
+        i = new A().window;
       }
-      return (r ? new r.DOMParser() : new window.DOMParser()).parseFromString(n, "text/html").querySelector("svg");
+      return (i ? new i.DOMParser() : new window.DOMParser()).parseFromString(r, "text/html").querySelector("svg");
     }
-    function v(n) {
-      const r = p(n), f = (r == null ? void 0 : r.innerHTML.trim()) || "";
-      r && f && rt(`@${u.value}:${a.prefix}:${a.name}`, {
-        body: f,
+    function p(r) {
+      const i = v(r), b = (i == null ? void 0 : i.innerHTML.trim()) || "";
+      i && b && Nt(`@${d.value}:${l.prefix}:${l.name}`, {
+        body: b,
         // Set height and width from svg content
-        height: r.viewBox.baseVal.height,
-        width: r.viewBox.baseVal.width
+        height: i.viewBox.baseVal.height,
+        width: i.viewBox.baseVal.width
       });
     }
-    return s && (a.src && !Re(`@${u.value}:${a.prefix}:${a.name}`) ? (e.value = !1, s.fetchIcon(a.src).then((n) => {
-      n && (v(n), e.value = !0);
-    }).catch((n) => {
-      throw new Error(`During fetch icon: ${n == null ? void 0 : n.message}`);
-    })) : a.svg && v(a.svg)), (n, r) => t(e) ? (d(), W(t(Pt), G({
+    return s && (l.src && !Ye(`@${d.value}:${l.prefix}:${l.name}`) ? (e.value = !1, s.fetchIcon(l.src).then((r) => {
+      r && (p(r), e.value = !0);
+    }).catch((r) => {
+      throw new Error(`During fetch icon: ${r == null ? void 0 : r.message}`);
+    })) : l.svg && p(l.svg)), (r, i) => a(e) ? (f(), H(a(fl), R({
       key: 0,
-      class: t(i)
+      class: a(u)
     }, {
-      inline: n.inline,
-      width: n.width,
-      height: n.height,
-      horizontalFlip: n.horizontalFlip,
-      verticalFlip: n.verticalFlip,
-      flip: n.flip,
-      rotate: n.rotate,
-      color: n.color,
-      onLoad: n.onLoad,
-      icon: t(c)
+      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: a(c)
     }), null, 16, ["class"])) : w("", !0);
   }
-});
-var Vt = /* @__PURE__ */ ((o) => (o.button = "button", o.submit = "submit", o.reset = "reset", o))(Vt || {}), ge = /* @__PURE__ */ ((o) => (o.nuxtLink = "nuxt-link", o.routerLink = "router-link", o.a = "a", o.button = "button", o))(ge || {}), $t = /* @__PURE__ */ ((o) => (o._blank = "_blank", o._self = "_self", o._parent = "_parent", o._top = "_top", o))($t || {});
-const go = ["update:modelValue"], _o = {
-  ...Ne,
-  ...ce,
-  ...Ae,
-  ...xe,
+}), ra = ["click", "mouseover", "mouseleave"], ia = nl;
+function ua() {
+  return We(Qt, {});
+}
+function da() {
+  return We(Zt, {});
+}
+function ca() {
+  return We(el, {});
+}
+const va = {
+  name: "VvAction"
+}, fa = /* @__PURE__ */ j({
+  ...va,
+  props: ia,
+  emits: ra,
+  setup(t, { expose: l, emit: e }) {
+    const s = t, o = rl(), u = N(null);
+    l({ $el: u });
+    const {
+      reference: d,
+      bus: c,
+      aria: v,
+      expanded: p
+    } = ua();
+    ve(
+      () => u.value,
+      (m) => {
+        d && (d.value = m);
+      }
+    );
+    const r = n(() => s.pressed || (p == null ? void 0 : p.value)), { role: i } = ca(), b = n(() => {
+      switch (!0) {
+        case s.disabled:
+          return ke.button;
+        case s.to !== void 0:
+          return o != null && o.nuxt ? ke.nuxtLink : ke.routerLink;
+        case s.href !== void 0:
+          return ke.a;
+        default:
+          return ke.button;
+      }
+    }), _ = n(() => {
+      const m = {
+        ...v == null ? void 0 : v.value,
+        "aria-pressed": r.value ? !0 : void 0,
+        role: i
+      };
+      switch (b.value) {
+        case ke.a:
+          return {
+            ...m,
+            href: s.href,
+            target: s.target,
+            rel: s.rel
+          };
+        case ke.routerLink:
+        case ke.nuxtLink:
+          return {
+            ...m,
+            to: s.to,
+            target: s.target
+          };
+        default:
+          return {
+            ...m,
+            type: s.type,
+            disabled: s.disabled
+          };
+      }
+    }), k = (m) => {
+      if (s.disabled) {
+        m.preventDefault();
+        return;
+      }
+      c == null || c.emit("click", m), e("click", m);
+    }, A = (m) => {
+      c == null || c.emit("mouseover", m), e("mouseover", m);
+    }, y = (m) => {
+      c == null || c.emit("mouseleave", m), e("mouseleave", m);
+    };
+    return (m, I) => (f(), H(Ht(a(b)), R(a(_), {
+      ref_key: "element",
+      ref: u,
+      class: {
+        active: m.active,
+        pressed: a(r),
+        disabled: m.disabled
+      },
+      onClickPassive: k,
+      onMouseoverPassive: A,
+      onMouseleavePassive: y
+    }), {
+      default: te(() => [
+        V(m.$slots, "default", {}, () => [
+          Y(T(m.label), 1)
+        ])
+      ]),
+      _: 3
+    }, 16, ["class"]));
+  }
+}), pa = ["update:modelValue"], ma = {
+  ...nl,
+  ...st,
+  ...me,
+  ...qe,
+  ...at,
   /**
    * Button icon
    */
@@ -872,260 +1127,160 @@ const go = ["update:modelValue"], _o = {
    */
   iconPosition: {
     type: String,
-    default: be.left,
-    validator: (o) => Object.values(be).includes(o)
+    default: fe.left,
+    validator: (t) => Object.values(fe).includes(t)
   },
-  /**
-   * Button label
-   */
-  label: [String, Number],
-  /**
-   * Loading status
-   */
-  loading: Boolean,
   /**
    * Loading icon
    */
   loadingIcon: { type: String, default: "eos-icons:bubble-loading" },
-  /**
-   * Loading label
-   */
-  loadingLabel: {
-    type: String,
-    default: "Loading..."
-  },
-  /**
-   * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
-   * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
-   */
-  to: {
-    type: [String, Object]
-  },
-  /**
-   * Link href
-   */
-  href: String,
-  /**
-   * Link target
-   */
-  target: {
-    type: String,
-    validator: (o) => Object.values($t).includes(o)
-  },
-  active: Boolean,
-  /**
-   * Button pressed mode
-   */
-  pressed: Boolean,
-  /**
-   * Link rel
-   */
-  rel: {
-    type: String,
-    default: "noopener noreferrer"
-  },
-  /**
-   * Button type
-   */
-  type: {
-    type: String,
-    default: "button",
-    validator: (o) => Object.values(Vt).includes(o)
-  },
   toggle: {
     type: Boolean,
     default: !1
   },
   modelValue: String
 };
-function So(o, a) {
-  var S;
-  const { group: e, isInGroup: s, getGroupOrLocalRef: l } = useInjectedGroupState(pt), {
-    id: i,
-    iconPosition: u,
+function ba(t, l) {
+  var m;
+  const { group: e, isInGroup: s, getGroupOrLocalRef: o } = tt(qt), {
+    id: u,
+    iconPosition: d,
     icon: c,
-    label: p,
-    pressed: v,
-    modifiers: n
-  } = toRefs(o), r = l("modelValue", o, a), f = l("disabled", o), g = l("toggle", o), k = l(
+    label: v,
+    pressed: p,
+    modifiers: r
+  } = G(t), i = o("modelValue", t, l), b = o("disabled", t), _ = o("toggle", t), k = o(
     "unselectable",
-    o
-  ), A = ((S = e == null ? void 0 : e.value) == null ? void 0 : S.multiple) ?? ref(!1), b = computed(() => {
-    var E;
-    const I = n != null && n.value ? Array.isArray(n.value) ? n.value : [n.value] : [], B = (E = e == null ? void 0 : e.value.itemModifiers) != null && E.value ? Array.isArray(e.value.itemModifiers.value) ? e.value.itemModifiers.value : [e.value.itemModifiers.value] : [];
-    return [...I, ...B];
+    t
+  ), A = ((m = e == null ? void 0 : e.value) == null ? void 0 : m.multiple) ?? N(!1), y = n(() => {
+    var D;
+    const I = r != null && r.value ? Array.isArray(r.value) ? r.value : r.value.split(" ") : [], O = (D = e == null ? void 0 : e.value.itemModifiers) != null && D.value ? Array.isArray(e.value.itemModifiers.value) ? e.value.itemModifiers.value : e.value.itemModifiers.value.split(" ") : [];
+    return [...I, ...O];
   });
   return {
     // group props
     group: e,
     isInGroup: s,
-    modelValue: r,
-    disabled: f,
-    toggle: g,
+    modelValue: i,
+    disabled: b,
+    toggle: _,
     unselectable: k,
     multiple: A,
     // local props
-    id: i,
-    modifiers: b,
-    pressed: v,
-    iconPosition: u,
+    id: u,
+    modifiers: y,
+    pressed: p,
+    iconPosition: d,
     icon: c,
-    label: p
+    label: v
   };
 }
-const Vo = {
+const Le = (t) => n(() => String((t == null ? void 0 : t.value) || Gt())), ha = {
   key: 1,
   class: "vv-button__label"
-}, $o = {
+}, ya = {
   key: 1,
   class: "vv-button__label"
-}, ko = {
+}, ga = {
   name: "VvButton"
-}, bl = /* @__PURE__ */ q({
-  ...ko,
-  props: _o,
-  emits: go,
-  setup(o, { expose: a, emit: e }) {
-    const s = o, l = useAttrs(), i = useSlots(), {
-      id: u,
+}, ys = /* @__PURE__ */ j({
+  ...ga,
+  props: ma,
+  emits: pa,
+  setup(t, { expose: l, emit: e }) {
+    const s = t, o = yt(), u = Ae(), {
+      id: d,
       modifiers: c,
-      iconPosition: p,
-      icon: v,
-      label: n,
-      modelValue: r,
-      disabled: f,
-      toggle: g,
+      iconPosition: v,
+      icon: p,
+      label: r,
+      modelValue: i,
+      disabled: b,
+      toggle: _,
       unselectable: k
-    } = So(s, e), A = useUniqueId(u), b = computed(() => (l == null ? void 0 : l.name) || A.value), S = useVolver(), I = ref(null);
-    a({ $el: I });
-    const {
-      reference: B,
-      bus: E,
-      aria: O
-    } = useInjectedDropdownTrigger();
-    watch(
-      () => I.value,
-      (C) => {
-        B && (B.value = C);
-      }
-    );
-    const { role: L } = useInjectedDropdownAction(), K = computed(() => {
-      switch (!0) {
-        case f.value:
-          return ge.button;
-        case s.to !== void 0:
-          return S != null && S.nuxt ? ge.nuxtLink : ge.routerLink;
-        case s.href !== void 0:
-          return ge.a;
-        default:
-          return ge.button;
-      }
-    }), ee = computed(() => g.value ? Array.isArray(r.value) ? contains(b.value, r.value) : equals(b.value, r.value) : s.pressed), P = useBemModifiers(
+    } = ba(s, e), A = Le(d), y = n(() => (o == null ? void 0 : o.name) || A.value), m = N(null), I = n(() => {
+      var C;
+      return (C = m.value) == null ? void 0 : C.$el;
+    });
+    l({ $el: I });
+    const O = n(() => _.value ? Array.isArray(i.value) ? we(y.value, i.value) : Pe(y.value, i.value) : s.pressed), D = X(
       "vv-button",
       c,
-      computed(() => ({
-        active: s.active,
-        pressed: ee.value,
-        disabled: f.value,
-        reverse: [be.right, be.bottom].includes(p.value),
-        column: [be.top, be.bottom].includes(p.value),
-        iconOnly: Boolean((v == null ? void 0 : v.value) && !(n != null && n.value) && !i.default)
+      n(() => ({
+        reverse: [fe.right, fe.bottom].includes(v.value),
+        column: [fe.top, fe.bottom].includes(v.value),
+        "icon-only": Boolean(
+          (p == null ? void 0 : p.value) && !(r != null && r.value) && !u.default
+        )
       }))
-    ), T = computed(
-      () => typeof (v == null ? void 0 : v.value) == "string" ? { name: v == null ? void 0 : v.value } : v == null ? void 0 : v.value
-    ), U = computed(() => {
-      const C = {
-        ...O == null ? void 0 : O.value,
-        "aria-pressed": ee.value ? !0 : void 0,
-        class: P.value,
-        role: L
-      };
-      switch (K.value) {
-        case ge.a:
-          return {
-            ...C,
-            role: C.role ?? "button",
-            href: s.href,
-            target: s.target,
-            rel: s.rel
-          };
-        case ge.routerLink:
-        case ge.nuxtLink:
-          return {
-            ...C,
-            role: C.role ?? "button",
-            to: s.to,
-            target: s.target
-          };
-        default:
-          return {
-            ...C,
-            type: s.type,
-            disabled: f.value
-          };
-      }
-    }), te = (C) => {
-      if (E == null || E.emit("click", C), g.value) {
-        if (Array.isArray(r.value)) {
-          if (contains(b.value, r.value)) {
-            k.value && (r.value = r.value.filter(
-              (oe) => oe !== b.value
+    ), L = n(
+      () => typeof (p == null ? void 0 : p.value) == "string" ? { name: p == null ? void 0 : p.value } : p == null ? void 0 : p.value
+    ), M = () => {
+      if (_.value) {
+        if (Array.isArray(i.value)) {
+          if (we(y.value, i.value)) {
+            k.value && (i.value = i.value.filter(
+              (C) => C !== y.value
             ));
             return;
           }
-          r.value.push(b.value);
+          i.value.push(y.value);
           return;
         }
-        if (equals(b, r.value) && k.value) {
-          r.value = void 0;
+        if (Pe(y.value, i.value) && k.value) {
+          i.value = void 0;
           return;
         }
-        r.value = b.value;
+        i.value = y.value;
       }
-    }, re = (C) => {
-      E == null || E.emit("mouseover", C);
-    }, ie = (C) => {
-      E == null || E.emit("mouseleave", C);
     };
-    return (C, oe) => (d(), W(ut(t(K)), G(t(U), {
-      id: t(A),
-      ref_key: "$el",
-      ref: I,
-      onClickPassive: te,
-      onMouseoverPassive: re,
-      onMouseleavePassive: ie
+    return (C, se) => (f(), H(fa, R({
+      disabled: a(b),
+      pressed: a(O),
+      active: C.active,
+      type: C.type,
+      to: C.to,
+      href: C.href,
+      target: C.target,
+      rel: C.rel
+    }, {
+      id: a(A),
+      ref_key: "element",
+      ref: m,
+      class: a(D),
+      onClick: M
     }), {
-      default: ve(() => [
-        $(C.$slots, "default", {}, () => [
-          C.loading ? $(C.$slots, "loading", { key: 0 }, () => [
-            C.loadingIcon ? (d(), W(Q, {
+      default: te(() => [
+        V(C.$slots, "default", {}, () => [
+          C.loading ? V(C.$slots, "loading", { key: 0 }, () => [
+            C.loadingIcon ? (f(), H(ee, {
               key: 0,
               class: "vv-button__loading-icon",
               name: C.loadingIcon
             }, null, 8, ["name"])) : w("", !0),
-            C.loadingLabel ? (d(), y("span", Vo, x(C.loadingLabel), 1)) : w("", !0)
-          ]) : (d(), y(ne, { key: 1 }, [
-            $(C.$slots, "before"),
-            t(v) ? (d(), W(Q, G({
+            C.loadingLabel ? (f(), g("span", ha, T(C.loadingLabel), 1)) : w("", !0)
+          ]) : (f(), g(ie, { key: 1 }, [
+            V(C.$slots, "before"),
+            a(p) ? (f(), H(ee, R({
               key: 0,
               class: "vv-button__icon"
-            }, t(T)), null, 16)) : w("", !0),
-            t(n) ? (d(), y("span", $o, [
-              $(C.$slots, "label", {}, () => [
-                X(x(t(n)), 1)
+            }, a(L)), null, 16)) : w("", !0),
+            a(r) ? (f(), g("span", ya, [
+              V(C.$slots, "label", {}, () => [
+                Y(T(a(r)), 1)
               ])
             ])) : w("", !0),
-            $(C.$slots, "after")
+            V(C.$slots, "after")
           ], 64))
         ])
       ]),
       _: 3
-    }, 16, ["id"]));
+    }, 16, ["id", "class"]));
   }
-}), Co = {
-  ...ce,
-  ...Ae,
-  ...xe,
+}), _a = {
+  ...me,
+  ...De,
+  ...qe,
   /**
    * String or String[] of css classes (modifiers) that will be provided to each button'
    */
@@ -1133,86 +1288,86 @@ const Vo = {
   toggle: { type: Boolean, default: !1 },
   multiple: { type: Boolean, default: !1 },
   modelValue: { type: [String, Array], default: void 0 }
-}, Ao = ["update:modelValue"], wo = {
+}, Sa = ["update:modelValue"], Va = {
   name: "VvButtonGroup"
-}, hl = /* @__PURE__ */ q({
-  ...wo,
-  props: Co,
-  emits: Ao,
-  setup(o, { emit: a }) {
-    const e = o, {
+}, gs = /* @__PURE__ */ j({
+  ...Va,
+  props: _a,
+  emits: Sa,
+  setup(t, { emit: l }) {
+    const e = t, {
       disabled: s,
-      toggle: l,
-      modifiers: i,
-      multiple: u,
+      toggle: o,
+      modifiers: u,
+      multiple: d,
       unselectable: c,
-      itemModifiers: p
-    } = toRefs(e);
-    watchEffect(() => {
-      typeof e.modelValue == "string" && u.value && console.warn(
+      itemModifiers: v
+    } = G(e);
+    _t(() => {
+      typeof e.modelValue == "string" && d.value && console.warn(
         "[VvButtonGroup]: modelValue is a string but multiple is true."
       );
     });
-    const v = computed({
-      get: () => u.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue,
-      set: (r) => (r !== void 0 && (Array.isArray(e.modelValue) || u.value) && !Array.isArray(r) && (r = [r]), a("update:modelValue", r))
+    const p = n({
+      get: () => d.value ? e.modelValue : Array.isArray(e.modelValue) ? e.modelValue[0] : e.modelValue,
+      set: (i) => (i !== void 0 && (Array.isArray(e.modelValue) || d.value) && !Array.isArray(i) && (i = [i]), l("update:modelValue", i))
     });
-    useProvideGroupState({
-      key: pt,
-      modelValue: v,
+    lt({
+      key: qt,
+      modelValue: p,
       disabled: s,
-      toggle: l,
-      multiple: u,
+      toggle: o,
+      multiple: d,
       unselectable: c,
-      itemModifiers: p
+      itemModifiers: v
     });
-    const n = useBemModifiers("vv-button-group", i);
-    return (r, f) => (d(), y("div", {
-      class: Z(t(n)),
+    const r = X("vv-button-group", u);
+    return (i, b) => (f(), g("div", {
+      class: le(a(r)),
       role: "group"
     }, [
-      $(r.$slots, "default")
+      V(i.$slots, "default")
     ], 2));
   }
-}), Eo = {
+}), $a = {
   title: String,
   modifiers: [String, Array]
-}, Io = {
+}, ka = {
   key: 0,
   class: "vv-card__header"
-}, Po = {
+}, Aa = {
   key: 1,
   class: "vv-card__content"
-}, Oo = {
+}, Ca = {
   key: 2,
   class: "vv-card__footer"
-}, Do = {
+}, wa = {
   name: "VvCard"
-}, yl = /* @__PURE__ */ q({
-  ...Do,
-  props: Eo,
-  setup(o) {
-    const a = o, { modifiers: e } = toRefs(a), s = useBemModifiers("vv-card", e);
-    return (l, i) => (d(), y("article", {
-      class: Z(t(s))
+}, _s = /* @__PURE__ */ j({
+  ...wa,
+  props: $a,
+  setup(t) {
+    const l = t, { modifiers: e } = G(l), s = X("vv-card", e);
+    return (o, u) => (f(), g("article", {
+      class: le(a(s))
     }, [
-      l.$slots.header || l.title ? (d(), y("header", Io, [
-        $(l.$slots, "header", {}, () => [
-          X(x(l.title), 1)
+      o.$slots.header || o.title ? (f(), g("header", ka, [
+        V(o.$slots, "header", {}, () => [
+          Y(T(o.title), 1)
         ])
       ])) : w("", !0),
-      $(l.$slots, "default"),
-      l.$slots.content ? (d(), y("div", Po, [
-        $(l.$slots, "content")
+      V(o.$slots, "default"),
+      o.$slots.content ? (f(), g("div", Aa, [
+        V(o.$slots, "content")
       ])) : w("", !0),
-      l.$slots.footer ? (d(), y("footer", Oo, [
-        $(l.$slots, "footer")
+      o.$slots.footer ? (f(), g("footer", Ca, [
+        V(o.$slots, "footer")
       ])) : w("", !0)
     ], 2));
   }
-}), Bo = {
-  ..._t,
-  ...ce,
+}), Ia = {
+  ...ol,
+  ...me,
   /**
    * If true, the input will be indeterminated
    */
@@ -1225,54 +1380,54 @@ const Vo = {
    * If true, the input will be displayed as a switch
    */
   switch: Boolean
-}, Ro = ["click", "update:modelValue", "change", "blur"];
-function To(o, a) {
-  const { group: e, isInGroup: s, getGroupOrLocalRef: l } = useInjectedGroupState(mt), { id: i, switch: u, indeterminate: c } = toRefs(o), p = l("modelValue", o, a), v = l("readonly", o), n = l("disabled", o), r = l("valid", o), f = l("invalid", o);
+}, Ea = ["click", "update:modelValue", "change", "blur"];
+function Pa(t, l) {
+  const { group: e, isInGroup: s, getGroupOrLocalRef: o } = tt(Jt), { id: u, switch: d, indeterminate: c } = G(t), v = o("modelValue", t, l), p = o("readonly", t), r = o("disabled", t), i = o("valid", t), b = o("invalid", t);
   return {
     // local props
-    id: i,
-    propsSwitch: u,
+    id: u,
+    propsSwitch: d,
     indeterminate: c,
     // global props
     group: e,
     isInGroup: s,
-    modelValue: p,
-    readonly: v,
-    disabled: n,
-    valid: r,
-    invalid: f
+    modelValue: v,
+    readonly: p,
+    disabled: r,
+    valid: i,
+    invalid: b
   };
 }
-function Te(o) {
-  return Array.isArray(o) ? o.filter((a) => isString(a)).join(" ") : o;
+function Je(t) {
+  return Array.isArray(t) ? t.filter((l) => Bl(l)).join(" ") : t;
 }
-function Ve(o, a) {
+function Be(t, l) {
   const {
     invalid: e,
     valid: s,
-    hint: l,
-    loading: i
-  } = a, {
-    hintLabel: u,
+    hint: o,
+    loading: u
+  } = l, {
+    hintLabel: d,
     modelValue: c,
-    valid: p,
-    validLabel: v,
-    invalid: n,
-    invalidLabel: r,
-    ...f
-  } = toRefs(o), g = resolveFieldData(f, "loading"), k = resolveFieldData(f, "loadingLabel"), A = computed(() => n.value ? !!(n.value && e || r != null && r.value && Array.isArray(r.value) && r.value.length > 0 || r != null && r.value && !isEmpty(r)) : !1), b = computed(
-    () => !!(u && u.value || l)
-  ), S = computed(
-    () => !!(v && v.value || s)
-  ), I = computed(
-    () => !!(g != null && g.value && i || g != null && g.value && (k != null && k.value))
-  ), B = computed(
-    () => b.value || S.value || A.value || I.value
+    valid: v,
+    validLabel: p,
+    invalid: r,
+    invalidLabel: i,
+    ...b
+  } = G(t), _ = Ze(b, "loading"), k = Ze(b, "loadingLabel"), A = n(() => r.value ? !!(r.value && e || i != null && i.value && Array.isArray(i.value) && i.value.length > 0 || i != null && i.value && !ge(i)) : !1), y = n(
+    () => !!(d && d.value || o)
+  ), m = n(
+    () => !!(p && p.value || s)
+  ), I = n(
+    () => !!(_ != null && _.value && u || _ != null && _.value && (k != null && k.value))
+  ), O = n(
+    () => y.value || m.value || A.value || I.value
   );
   return {
     hasInvalid: A,
-    hasHint: b,
-    hasValid: S,
+    hasHint: y,
+    hasValid: m,
     hasLoading: I,
     HintSlot: {
       name: "HintSlot",
@@ -1282,31 +1437,31 @@ function Ve(o, a) {
           default: () => ({})
         }
       },
-      setup(E) {
-        const O = computed(() => {
-          const L = toReactive({
-            hintLabel: u,
+      setup(D) {
+        const L = n(() => {
+          const M = $l({
+            hintLabel: d,
             modelValue: c,
-            valid: p,
-            validLabel: v,
-            invalid: n,
-            invalidLabel: r,
-            loading: g,
+            valid: v,
+            validLabel: p,
+            invalid: r,
+            invalidLabel: i,
+            loading: _,
             loadingLabel: k,
-            ...E.params
+            ...D.params
           });
-          return n != null && n.value ? (e == null ? void 0 : e(L)) || Te(r == null ? void 0 : r.value) || (u == null ? void 0 : u.value) : p != null && p.value ? (s == null ? void 0 : s(L)) || Te(v == null ? void 0 : v.value) || (u == null ? void 0 : u.value) : g != null && g.value ? (i == null ? void 0 : i(L)) || Te(k == null ? void 0 : k.value) || (u == null ? void 0 : u.value) : (l == null ? void 0 : l(L)) || Te(u == null ? void 0 : u.value) || (u == null ? void 0 : u.value);
+          return r != null && r.value ? (e == null ? void 0 : e(M)) || Je(i == null ? void 0 : i.value) || (d == null ? void 0 : d.value) : v != null && v.value ? (s == null ? void 0 : s(M)) || Je(p == null ? void 0 : p.value) || (d == null ? void 0 : d.value) : _ != null && _.value ? (u == null ? void 0 : u(M)) || Je(k == null ? void 0 : k.value) || (d == null ? void 0 : d.value) : (o == null ? void 0 : o(M)) || Je(d == null ? void 0 : d.value) || (d == null ? void 0 : d.value);
         });
         return {
-          isVisible: B,
+          isVisible: O,
           hasInvalid: A,
-          hasValid: S,
-          hintContent: O
+          hasValid: m,
+          hintContent: L
         };
       },
       render() {
         if (this.isVisible)
-          return h(
+          return be(
             "small",
             {
               role: this.hasInvalid ? "alert" : this.hasValid ? "status" : void 0
@@ -1317,167 +1472,178 @@ function Ve(o, a) {
     }
   };
 }
-const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], No = {
+const Oa = ["for"], Da = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], La = {
   name: "VvCheckbox"
-}, Lo = /* @__PURE__ */ q({
-  ...No,
-  props: Bo,
-  emits: Ro,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), {
-      id: l,
-      disabled: i,
-      readonly: u,
+}, Ba = /* @__PURE__ */ j({
+  ...La,
+  props: Ia,
+  emits: Ea,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), {
+      id: o,
+      disabled: u,
+      readonly: d,
       valid: c,
-      invalid: p,
-      propsSwitch: v,
-      modelValue: n,
-      indeterminate: r,
-      isInGroup: f
-    } = To(e, a), g = useUniqueId(l), k = computed(() => S.value ? -1 : e.tabindex), A = ref(), b = computed(
-      () => e.uncheckedValue !== void 0 && !f.value
-    ), S = computed(() => i.value || u.value), I = computed(() => {
-      if (p.value === !0)
+      invalid: v,
+      propsSwitch: p,
+      modelValue: r,
+      indeterminate: i,
+      isInGroup: b
+    } = Pa(e, l), _ = Le(o), k = n(() => m.value ? -1 : e.tabindex), A = N(), y = n(
+      () => e.uncheckedValue !== void 0 && !b.value
+    ), m = n(() => u.value || d.value), I = n(() => {
+      if (v.value === !0)
         return !0;
       if (c.value === !0)
         return !1;
-    }), B = computed(() => b.value ? n.value === e.value : Array.isArray(n.value) ? contains(e.value, n.value) : equals(e.value, n.value)), E = computed(() => !!(r.value || !B.value && b.value && e.uncheckedValue !== n.value)), O = computed(() => {
-      if (!b.value)
+    }), O = n(() => y.value ? r.value === e.value : Array.isArray(r.value) ? we(e.value, r.value) : Pe(e.value, r.value)), D = n(() => !!(i.value || !O.value && y.value && e.uncheckedValue !== r.value)), L = n(() => {
+      if (!y.value)
         return ["string", "number", "boolean"].includes(typeof e.value) ? e.value : !0;
-    }), L = computed({
+    }), M = n({
       get() {
-        return B.value;
+        return O.value;
       },
-      set(T) {
-        if (b.value)
-          n.value = T ? e.value : e.uncheckedValue;
-        else if (Array.isArray(n.value) || f.value) {
-          const U = new Set(
-            Array.isArray(n.value) ? n.value : n.value !== void 0 ? [n.value] : []
+      set(W) {
+        if (y.value)
+          r.value = W ? e.value : e.uncheckedValue;
+        else if (Array.isArray(r.value) || b.value) {
+          const F = new Set(
+            Array.isArray(r.value) ? r.value : r.value !== void 0 ? [r.value] : []
           );
-          T ? U.add(e.value) : U.delete(e.value), n.value = [...U];
+          W ? F.add(e.value) : F.delete(e.value), r.value = [...F];
         } else
-          n.value = T ? e.value : void 0;
-        a("change", T);
+          r.value = W ? e.value : void 0;
+        l("change", W);
       }
-    }), { modifiers: K } = toRefs(e), ee = useBemModifiers(
+    }), { modifiers: C } = G(e), se = X(
       "vv-checkbox",
-      K,
-      computed(() => ({
-        switch: v.value,
+      C,
+      n(() => ({
+        switch: p.value,
         valid: c.value,
-        invalid: p.value,
-        disabled: i.value,
-        readonly: u.value,
-        indeterminate: r.value
+        invalid: v.value,
+        disabled: u.value,
+        readonly: d.value,
+        indeterminate: i.value
       }))
     );
-    watchEffect(() => {
-      b.value && Array.isArray(n.value) && console.warn(
+    _t(() => {
+      y.value && Array.isArray(r.value) && console.warn(
         "[VvCheckbox] The model value is an array but the component is in binary mode."
       );
-    }), watch(
-      () => E.value,
-      (T) => {
-        T ? A.value.indeterminate = !0 : A.value.indeterminate = !1;
+    }), ve(
+      () => D.value,
+      (W) => {
+        W ? A.value.indeterminate = !0 : A.value.indeterminate = !1;
       }
-    ), onMounted(() => {
-      E.value && (A.value.indeterminate = !0);
+    ), ml(() => {
+      D.value && (A.value.indeterminate = !0);
     });
-    const { HintSlot: P } = Ve(e, s);
-    return (T, U) => (d(), y("label", {
-      class: Z(t(ee)),
-      for: t(g)
+    const { HintSlot: P } = Be(e, s);
+    return (W, F) => (f(), g("label", {
+      class: le(a(se)),
+      for: a(_)
     }, [
-      Se(N("input", {
-        id: t(g),
+      Oe(x("input", {
+        id: a(_),
         ref_key: "input",
         ref: A,
-        "onUpdate:modelValue": U[0] || (U[0] = (te) => Ce(L) ? L.value = te : null),
+        "onUpdate:modelValue": F[0] || (F[0] = (ue) => Ee(M) ? M.value = ue : null),
         type: "checkbox",
         class: "vv-checkbox__input",
-        name: T.name,
-        disabled: t(S),
-        value: t(O),
-        tabindex: t(k),
-        "aria-invalid": t(I)
-      }, null, 8, xo), [
-        [Dt, t(L)]
+        name: W.name,
+        disabled: a(m),
+        value: a(L),
+        tabindex: a(k),
+        "aria-invalid": a(I)
+      }, null, 8, Da), [
+        [bl, a(M)]
       ]),
-      $(T.$slots, "default", { value: t(n) }, () => [
-        X(x(T.label), 1)
+      V(W.$slots, "default", { value: a(r) }, () => [
+        Y(T(W.label), 1)
       ]),
-      de(t(P), {
+      pe(a(P), {
         class: "vv-checkbox__hint",
-        params: { value: t(n) }
+        params: { value: a(r) }
       }, null, 8, ["params"])
-    ], 10, Mo));
+    ], 10, Oa));
   }
-}), Ho = St, Go = ["update:modelValue", "change"], Uo = ["textContent"], Wo = { class: "vv-checkbox-group__wrapper" }, jo = {
+}), Ta = sl, Na = ["update:modelValue", "change"];
+function rt(t) {
+  const { options: l, labelKey: e, valueKey: s, disabledKey: o } = G(t);
+  return {
+    options: l,
+    getOptionLabel: (v) => typeof v != "object" && v !== null ? v : typeof e.value == "function" ? e.value(v) : v[e.value],
+    getOptionValue: (v) => typeof v != "object" && v !== null ? v : typeof s.value == "function" ? s.value(v) : v[s.value],
+    getOptionDisabled: (v) => typeof v != "object" && v !== null ? !1 : typeof o.value == "function" ? o.value(v) : v[o.value]
+  };
+}
+const Ra = ["textContent"], Ha = { class: "vv-checkbox-group__wrapper" }, xa = {
   name: "VvCheckboxGroup"
-}, gl = /* @__PURE__ */ q({
-  ...jo,
-  props: Ho,
-  emits: Go,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), l = useVModel(e, "modelValue", a), { disabled: i, readonly: u, vertical: c, valid: p, invalid: v, modifiers: n } = toRefs(e);
-    useProvideGroupState({
-      key: mt,
-      modelValue: l,
-      disabled: i,
-      readonly: u,
-      valid: p,
-      invalid: v
+}, Ss = /* @__PURE__ */ j({
+  ...xa,
+  props: Ta,
+  emits: Na,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), o = et(e, "modelValue", l), { disabled: u, readonly: d, vertical: c, valid: v, invalid: p, modifiers: r } = G(e);
+    lt({
+      key: Jt,
+      modelValue: o,
+      disabled: u,
+      readonly: d,
+      valid: v,
+      invalid: p
     });
-    const { getOptionLabel: r, getOptionValue: f } = useOptions(e), g = useBemModifiers(
+    const { getOptionLabel: i, getOptionValue: b } = rt(e), _ = X(
       "vv-checkbox-group",
-      n,
-      computed(() => ({
-        disabled: i.value,
-        readonly: u.value,
+      r,
+      n(() => ({
+        disabled: u.value,
+        readonly: d.value,
         horizontal: !c.value,
-        valid: p.value,
-        invalid: v.value
+        valid: v.value,
+        invalid: p.value
       }))
-    ), k = (b, S) => ({
-      id: `${e.name}_opt${S}`,
+    ), k = (y, m) => ({
+      id: `${e.name}_opt${m}`,
       name: e.name,
-      label: r(b),
-      value: f(b)
-    }), { HintSlot: A } = Ve(e, s);
-    return (b, S) => (d(), y("fieldset", {
-      class: Z(t(g))
+      label: i(y),
+      value: b(y)
+    }), { HintSlot: A } = Be(e, s);
+    return (y, m) => (f(), g("fieldset", {
+      class: le(a(_))
     }, [
-      b.label ? (d(), y("legend", {
+      y.label ? (f(), g("legend", {
         key: 0,
-        textContent: x(b.label)
-      }, null, 8, Uo)) : w("", !0),
-      N("div", Wo, [
-        b.options.length > 0 ? (d(!0), y(ne, { key: 0 }, ke(b.options, (I, B) => (d(), W(Lo, G({ key: B }, k(I, B)), null, 16))), 128)) : $(b.$slots, "default", { key: 1 })
+        textContent: T(y.label)
+      }, null, 8, Ra)) : w("", !0),
+      x("div", Ha, [
+        y.options.length > 0 ? (f(!0), g(ie, { key: 0 }, Ne(y.options, (I, O) => (f(), H(Ba, R({ key: O }, k(I, O)), null, 16))), 128)) : V(y.$slots, "default", { key: 1 })
       ]),
-      de(t(A), { class: "vv-checkbox-group__hint" })
+      pe(a(A), { class: "vv-checkbox-group__hint" })
     ], 2));
   }
-}), Fo = [
+}), Ma = [
   "update:modelValue",
   "change:search",
   "focus",
   "blur"
-], qo = {
-  ...Le,
-  ...Me,
-  ...Pe,
-  ...Oe,
-  ...Be,
-  ...Ke,
-  ...Ae,
-  ...De,
-  ...ce,
+], Ga = {
+  ...nt,
+  ...ot,
+  ...Ue,
+  ...Fe,
   ...ze,
-  ...Ye,
-  ...Je,
+  ...at,
+  ...De,
+  ...Ke,
+  ...me,
+  ...kt,
+  ...At,
+  ...Ct,
+  ...qe,
+  ...ht,
   ...xe,
-  ...Fe,
   /**
    * modelValue can be a string, number, boolean, object or array of string, number, boolean, object
    */
@@ -1485,30 +1651,30 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
     type: [String, Number, Boolean, Object, Array],
     default: void 0
   },
-  /**
-   * Select input label
-   */
-  label: String,
   /**
    * Label for no search results
    */
   noResultsLabel: { type: String, default: "No results" },
+  /**
+   * Label for no options	available
+   */
+  noOptionsLabel: { type: String, default: "No options available" },
   /**
    * Label for selected option hint
    */
-  selectedLabel: { type: String, default: "Selected" },
+  selectedHintLabel: { type: String, default: "Selected" },
   /**
-   * Label for deselect button
+   * Label for deselect action button
    */
-  deselectLabel: { type: String, default: "Deselect" },
+  deselectActionLabel: { type: String, default: "Deselect" },
   /**
    * Label for select option hint
    */
-  pressToSelectLabel: { type: String, default: "Press enter to select" },
+  selectHintLabel: { type: String, default: "Press enter to select" },
   /**
    * Label for deselected option hint
    */
-  pressToDeselectLabel: { type: String, default: "Press enter to remove" },
+  deselectHintLabel: { type: String, default: "Press enter to remove" },
   /**
    * Select input placeholder
    */
@@ -1562,7 +1728,7 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    * Set dropdown width to the same as the trigger
    */
   triggerWidth: {
-    ...Fe.triggerWidth,
+    ...ht.triggerWidth,
     default: !0
   },
   /**
@@ -1579,10 +1745,10 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    * Close dropdown on select (not multiple)
    */
   autoClose: Boolean
-}, lt = ["listbox", "menu"], Ko = {
-  ...Ne,
-  ...ce,
-  ...Fe,
+}, ja = {
+  ...st,
+  ...me,
+  ...ht,
   /**
    * Show / hide dropdown programmatically
    */
@@ -1602,257 +1768,361 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    */
   role: {
     type: String,
-    default: lt[1],
-    validator: (o) => lt.includes(o)
+    default: je.menu,
+    validator: (t) => Object.values(je).includes(t)
   }
-}, zo = ["id", "tabindex", "role", "aria-labelledby"], Yo = {
+};
+function Wa({
+  reference: t,
+  id: l,
+  expanded: e,
+  aria: s
+}) {
+  const o = El(), u = j({
+    name: "VvDropdownTriggerProvider",
+    provide() {
+      return {
+        [Qt]: {
+          reference: t,
+          id: l,
+          expanded: e,
+          aria: s,
+          bus: o
+        }
+      };
+    },
+    setup() {
+      return {};
+    },
+    render() {
+      var d, c;
+      return be(ie, {}, (c = (d = this.$slots).default) == null ? void 0 : c.call(d));
+    }
+  });
+  return {
+    bus: o,
+    component: u
+  };
+}
+function Ua({
+  role: t,
+  expanded: l
+}) {
+  const e = n(
+    () => t.value === je.listbox ? mt.option : mt.presentation
+  );
+  return gt(Zt, {
+    role: e,
+    expanded: l
+  }), { itemRole: e };
+}
+function Fa({
+  expanded: t
+}) {
+  gt(el, {
+    role: Ft.menuitem,
+    expanded: t
+  });
+}
+const Ka = ["id", "tabindex", "role", "aria-labelledby"], za = {
   name: "VvDropdown",
   inheritAttrs: !1
-}, kt = /* @__PURE__ */ q({
-  ...Yo,
-  props: Ko,
+}, il = /* @__PURE__ */ j({
+  ...za,
+  props: ja,
   emits: ["update:modelValue"],
-  setup(o, { emit: a }) {
-    const e = o, { id: s } = toRefs(e), l = useUniqueId(s), i = useAttrs(), u = ref("auto"), c = ref("auto"), p = ref(null), v = ref(null), n = ref(null), r = ref(null), f = computed({
-      get: () => e.reference ?? p.value,
-      set: (m) => {
-        p.value = m;
+  setup(t, { emit: l }) {
+    const e = t, { id: s } = G(e), o = Le(s), u = yt(), d = N("auto"), c = N("auto"), v = N(null), p = N(null), r = N(null), i = N(null), b = n({
+      get: () => e.reference ?? v.value,
+      set: (h) => {
+        v.value = h;
       }
-    }), g = computed(() => {
-      const m = [];
-      if (e.autoPlacement ? typeof e.autoPlacement == "boolean" ? m.push(Ze()) : m.push(
-        Ze(e.autoPlacement)
-      ) : e.flip && (typeof e.flip == "boolean" ? m.push(et()) : m.push(et(e.flip))), e.shift && (typeof e.shift == "boolean" ? m.push(tt()) : m.push(tt(e.shift))), e.size) {
-        const M = ({
-          availableWidth: ue,
-          availableHeight: ye
+    }), _ = n(() => {
+      const h = [];
+      if (e.autoPlacement ? typeof e.autoPlacement == "boolean" ? h.push(Et()) : h.push(
+        Et(e.autoPlacement)
+      ) : e.flip && (typeof e.flip == "boolean" ? h.push(Pt()) : h.push(Pt(e.flip))), e.shift && (typeof e.shift == "boolean" ? h.push(Ot()) : h.push(Ot(e.shift))), e.size) {
+        const U = ({
+          availableWidth: ce,
+          availableHeight: $e
         }) => {
-          u.value = `${ue}px`, c.value = `${ye}px`;
+          d.value = `${ce}px`, c.value = `${$e}px`;
         };
-        typeof e.size == "boolean" ? m.push(
-          ot({
-            apply: M
+        typeof e.size == "boolean" ? h.push(
+          Dt({
+            apply: U
           })
-        ) : m.push(
-          ot({
+        ) : h.push(
+          Dt({
             ...e.size,
-            apply: M
+            apply: U
           })
         );
       }
-      return e.offset && (m.push(Ge(Number(e.offset))), ["string", "number"].includes(typeof e.offset) ? m.push(Ge(Number(e.offset))) : m.push(Ge(e.offset))), e.arrow && m.push(
-        Lt({
-          element: n
+      return e.offset && (h.push(ct(Number(e.offset))), ["string", "number"].includes(typeof e.offset) ? h.push(ct(Number(e.offset))) : h.push(ct(e.offset))), e.arrow && h.push(
+        Cl({
+          element: r
         })
-      ), m;
-    }), { x: k, y: A, strategy: b, middlewareData: S, placement: I } = Ht(
-      f,
-      v,
+      ), h;
+    }), { x: k, y: A, strategy: y, middlewareData: m, placement: I } = wl(
+      b,
+      p,
       {
-        whileElementsMounted: Gt,
+        whileElementsMounted: Il,
         placement: e.placement,
-        middleware: g
+        middleware: _
       }
-    ), B = computed(() => ({
-      position: b.value,
+    ), O = n(() => ({
+      position: y.value,
       top: `${A.value ?? 0}px`,
       left: `${k.value ?? 0}px`,
-      maxWidth: u.value,
+      maxWidth: d.value,
       maxHeight: c.value,
-      width: e.triggerWidth && f.value ? `${f.value.offsetWidth}px` : void 0
-    })), E = computed(() => I.value.split("-")[0]), O = computed(
+      width: e.triggerWidth && b.value ? `${b.value.offsetWidth}px` : void 0
+    })), D = n(() => I.value.split("-")[0]), L = n(
       () => ({
         top: "bottom",
         right: "left",
         bottom: "top",
         left: "right"
-      })[E.value] ?? "bottom"
-    ), L = computed(() => {
-      var m, M, ue, ye;
-      return ["bottom", "top"].includes(O.value) ? {
-        right: `${((m = S.value.arrow) == null ? void 0 : m.x) ?? 0}px`,
-        [O.value]: `${-(((M = n.value) == null ? void 0 : M.offsetWidth) ?? 0) / 2}px`
+      })[D.value] ?? "bottom"
+    ), M = n(() => {
+      var h, U, ce, $e;
+      return ["bottom", "top"].includes(L.value) ? {
+        right: `${((h = m.value.arrow) == null ? void 0 : h.x) ?? 0}px`,
+        [L.value]: `${-(((U = r.value) == null ? void 0 : U.offsetWidth) ?? 0) / 2}px`
       } : {
-        top: `${((ue = S.value.arrow) == null ? void 0 : ue.y) ?? 0}px`,
-        [O.value]: `${-(((ye = n.value) == null ? void 0 : ye.offsetWidth) ?? 0) / 2}px`
+        top: `${((ce = m.value.arrow) == null ? void 0 : ce.y) ?? 0}px`,
+        [L.value]: `${-((($e = r.value) == null ? void 0 : $e.offsetWidth) ?? 0) / 2}px`
       };
-    }), K = useVModel(e, "modelValue", a), ee = ref(!1), P = computed({
-      get: () => K.value ?? ee.value,
-      set: (m) => {
-        if (K.value === void 0) {
-          ee.value = m;
+    }), C = et(e, "modelValue", l), se = N(!1), P = n({
+      get: () => C.value ?? se.value,
+      set: (h) => {
+        if (C.value === void 0) {
+          se.value = h;
           return;
         }
-        K.value = m;
+        C.value = h;
       }
-    }), T = () => {
+    }), W = () => {
       P.value = !0;
-    }, U = () => {
+    }, F = () => {
       P.value = !1;
-    }, te = () => {
+    }, ue = () => {
       P.value = !P.value;
-    }, re = (m) => {
-      f.value = m;
+    }, he = (h) => {
+      b.value = h;
     };
-    watch(P, (m) => {
-      m && e.autofocusFirst && nextTick(() => {
-        const M = ae(
-          v.value
+    ve(P, (h) => {
+      h && e.autofocusFirst && Xe(() => {
+        const U = ae(
+          p.value
         );
-        M.length > 0 && M[0].focus();
+        U.length > 0 && U[0].focus();
       });
-    }), onClickOutside(
-      v,
+    }), jt(
+      p,
       () => {
         e.autoClose && (P.value = !1);
       },
-      { ignore: [f] }
+      { ignore: [b] }
     );
-    const ie = computed(() => {
-      var m;
-      return ((m = f.value) == null ? void 0 : m.getAttribute("id")) ?? void 0;
-    }), C = computed(() => ({
-      "aria-controls": l.value,
+    const ye = n(() => {
+      var h;
+      return ((h = b.value) == null ? void 0 : h.getAttribute("id")) ?? void 0;
+    }), ne = n(() => ({
+      "aria-controls": o.value,
       "aria-haspopup": !0,
       "aria-expanded": P.value
-    })), { component: oe, bus: fe } = useProvideDropdownTrigger({
-      reference: f,
-      id: l,
+    })), { component: de, bus: _e } = Wa({
+      reference: b,
+      id: o,
       expanded: P,
-      aria: C
+      aria: ne
     });
-    fe.on("click", te);
-    const { role: se, modifiers: he } = toRefs(e), { itemRole: z } = useProvideDropdownItem({ role: se, expanded: P }), R = useBemModifiers(
+    _e.on("click", ue);
+    const { role: re, modifiers: Ve } = G(e), { itemRole: J } = Ua({ role: re, expanded: P }), B = X(
       "vv-dropdown",
-      he,
-      computed(() => ({
+      Ve,
+      n(() => ({
         arrow: e.arrow
       }))
-    ), { focused: Y } = useFocusWithin(v);
-    function ae(m) {
-      return m ? [
-        ...m.querySelectorAll(
+    ), { focused: Q } = Vt(p);
+    function ae(h) {
+      return h ? [
+        ...h.querySelectorAll(
           'a[href], button, input, textarea, select, details,[tabindex]:not([tabindex="-1"])'
         )
       ].filter(
-        (M) => !M.hasAttribute("disabled") && !M.getAttribute("aria-hidden")
+        (U) => !U.hasAttribute("disabled") && !U.getAttribute("aria-hidden")
       ) : [];
     }
-    const me = () => {
-      nextTick(() => {
-        if (Y.value) {
-          const m = ae(
-            v.value
+    const Se = () => {
+      Xe(() => {
+        if (Q.value) {
+          const h = ae(
+            p.value
           );
-          if (m.length === 0 || !document.activeElement)
+          if (h.length === 0 || !document.activeElement)
             return;
-          const M = m.indexOf(
+          const U = h.indexOf(
             document.activeElement
           );
-          M < m.length - 1 ? m[M + 1].focus() : m[0].focus();
+          U < h.length - 1 ? h[U + 1].focus() : h[0].focus();
         }
       });
-    }, pe = () => {
-      nextTick(() => {
-        if (Y.value) {
-          const m = ae(
-            v.value
+    }, Ce = () => {
+      Xe(() => {
+        if (Q.value) {
+          const h = ae(
+            p.value
           );
-          if (m.length === 0 || !document.activeElement)
+          if (h.length === 0 || !document.activeElement)
             return;
-          const M = m.indexOf(
+          const U = h.indexOf(
             document.activeElement
           );
-          M > 0 ? m[M - 1].focus() : m[m.length - 1].focus();
+          U > 0 ? h[U - 1].focus() : h[h.length - 1].focus();
         }
       });
     };
-    return onKeyStroke("Escape", (m) => {
-      P.value && (m.preventDefault(), U());
-    }), onKeyStroke("ArrowDown", (m) => {
-      P.value && Y.value && (m.preventDefault(), me());
-    }), onKeyStroke("ArrowUp", (m) => {
-      P.value && Y.value && (m.preventDefault(), pe());
-    }), onKeyStroke([" ", "Enter"], (m) => {
-      P.value && Y.value && (m.preventDefault(), document.activeElement.click());
-    }), (m, M) => (d(), y(ne, null, [
-      de(t(oe), null, {
-        default: ve(() => [
-          $(m.$slots, "default", j(F({ init: re, show: T, hide: U, toggle: te, expanded: t(P), aria: t(C) })))
+    return He("Escape", (h) => {
+      P.value && (h.preventDefault(), F());
+    }), He("ArrowDown", (h) => {
+      P.value && Q.value && (h.preventDefault(), Se());
+    }), He("ArrowUp", (h) => {
+      P.value && Q.value && (h.preventDefault(), Ce());
+    }), He([" ", "Enter"], (h) => {
+      P.value && Q.value && (h.preventDefault(), document.activeElement.click());
+    }), (h, U) => (f(), g(ie, null, [
+      pe(a(de), null, {
+        default: te(() => [
+          V(h.$slots, "default", K(z({ init: he, show: W, hide: F, toggle: ue, expanded: a(P), aria: a(ne) })))
         ]),
         _: 3
       }),
-      de(dt, { name: m.transitionName }, {
-        default: ve(() => [
-          Se(N("div", {
+      pe(xt, { name: h.transitionName }, {
+        default: te(() => [
+          Oe(x("div", {
             ref_key: "floatingEl",
-            ref: v,
-            style: Qe(t(B)),
-            class: Z(t(R))
+            ref: p,
+            style: It(a(O)),
+            class: le(a(B))
           }, [
-            e.arrow ? (d(), y("div", {
+            e.arrow ? (f(), g("div", {
               key: 0,
               ref_key: "arrowEl",
-              ref: n,
-              style: Qe(t(L)),
+              ref: r,
+              style: It(a(M)),
               class: "vv-dropdown__arrow"
             }, null, 4)) : w("", !0),
-            $(m.$slots, "before", j(F({ expanded: t(P) }))),
-            N("ul", G(t(i), {
-              id: t(l),
+            V(h.$slots, "before", K(z({ expanded: a(P) }))),
+            x("ul", R(a(u), {
+              id: a(o),
               ref_key: "listEl",
-              ref: r,
-              tabindex: t(P) ? void 0 : -1,
-              role: t(se),
-              "aria-labelledby": t(ie),
+              ref: i,
+              tabindex: a(P) ? void 0 : -1,
+              role: a(re),
+              "aria-labelledby": a(ye),
               class: "vv-dropdown__list"
             }), [
-              $(m.$slots, "items", j(F({
-                role: t(z)
+              V(h.$slots, "items", K(z({
+                role: a(J)
               })))
-            ], 16, zo),
-            $(m.$slots, "after", j(F({ expanded: t(P) })))
+            ], 16, Ka),
+            V(h.$slots, "after", K(z({ expanded: a(P) })))
           ], 6), [
-            [qe, t(P)]
+            [St, a(P)]
           ])
         ]),
         _: 3
       }, 8, ["name"])
     ], 64));
   }
-}), Jo = {
+}), qa = {
   name: "VvDropdownItem"
-}, Ct = /* @__PURE__ */ q({
-  ...Jo,
-  setup(o) {
-    const { role: a, expanded: e } = useInjectedDropdownItem(), s = ref(null);
-    useProvideDropdownAction({ expanded: e });
-    const l = useElementHover(s), { focused: i } = useFocus(s), { focused: u } = useFocusWithin(s);
-    return watch(l, (c) => {
-      c && (i.value = !0);
-    }), (c, p) => (d(), y("li", G({ role: t(a) }, {
+}, Ya = /* @__PURE__ */ j({
+  ...qa,
+  setup(t) {
+    const { role: l, expanded: e } = da(), s = N(null);
+    Fa({ expanded: e });
+    const o = kl(s), { focused: u } = Wt(s), { focused: d } = Vt(s);
+    return ve(o, (c) => {
+      c && (u.value = !0);
+    }), (c, v) => (f(), g("li", R({ role: a(l) }, {
       ref_key: "element",
       ref: s,
-      class: ["vv-dropdown__item", { "focus-visible": t(i) || t(u) }]
+      class: ["vv-dropdown__item", { "focus-visible": a(u) || a(d) }]
     }), [
-      $(c.$slots, "default")
+      V(c.$slots, "default")
     ], 16));
   }
-}), Xo = {
-  ...Le,
-  ...ht,
-  ...yt,
-  ...Me,
-  ...Pe,
-  ...Oe,
-  ...Be,
-  ...Ke,
-  ...Ae,
-  ...De,
-  ...ce,
+}), Ja = { class: "vv-dropdown-option__hint" }, Xa = {
+  name: "VvDropdownOption"
+}, Qe = /* @__PURE__ */ j({
+  ...Xa,
+  props: {
+    ...De,
+    ...zl,
+    ...qe,
+    ...me,
+    deselectHintLabel: {
+      type: String
+    },
+    selectHintLabel: {
+      type: String
+    },
+    selectedHintLabel: {
+      type: String
+    }
+  },
+  setup(t) {
+    const l = t, { modifiers: e } = G(l), s = X(
+      "vv-dropdown-option",
+      e,
+      n(() => ({
+        disabled: l.disabled,
+        selected: l.selected,
+        unselectable: l.unselectable && l.selected
+      }))
+    );
+    return (o, u) => (f(), H(Ya, {
+      class: le(a(s)),
+      tabindex: o.disabled ? -1 : 0,
+      "aria-selected": o.selected,
+      "aria-disabled": o.disabled
+    }, {
+      default: te(() => [
+        V(o.$slots, "default"),
+        x("span", Ja, [
+          V(o.$slots, "hint", K(z({ disabled: o.disabled, selected: o.selected, unselectable: o.unselectable })), () => [
+            o.selected ? (f(), g(ie, { key: 0 }, [
+              Y(T(o.unselectable ? t.deselectHintLabel : t.selectedHintLabel), 1)
+            ], 64)) : o.disabled ? w("", !0) : (f(), g(ie, { key: 1 }, [
+              Y(T(t.selectHintLabel), 1)
+            ], 64))
+          ])
+        ])
+      ]),
+      _: 3
+    }, 8, ["class", "tabindex", "aria-selected", "aria-disabled"]));
+  }
+}), Qa = {
+  ...nt,
+  ...tl,
+  ...ll,
+  ...ot,
+  ...Ue,
+  ...Fe,
   ...ze,
-  ...Ye,
-  ...Je,
+  ...at,
+  ...De,
+  ...Ke,
+  ...me,
+  ...kt,
+  ...At,
+  ...Ct,
+  ...qe,
   ...xe,
   /**
    * This Boolean attribute indicates that multiple options can be selected in the list.
@@ -1880,270 +2150,299 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
     type: [String, Number, Boolean, Object, Array],
     default: void 0
   },
-  /**
-   * <label> value for the select
-   */
-  label: String,
   /**
    * Select placeholder
    */
   placeholder: String
-}, Qo = ["update:modelValue", "focus", "blur"], Zo = ["for"], ea = { class: "vv-select__wrapper" }, ta = {
+}, Za = ["update:modelValue", "focus", "blur"];
+function it(t, l) {
+  const { focused: e } = Wt(t);
+  return ve(e, (s) => {
+    l(s ? "focus" : "blur", a(t));
+  }), {
+    focused: e
+  };
+}
+function ut(t, l) {
+  const e = n(
+    () => Boolean((t == null ? void 0 : t.value) && l.value === Ge.before)
+  ), s = n(
+    () => Boolean((t == null ? void 0 : t.value) && l.value === Ge.after)
+  ), o = n(
+    () => Boolean((t == null ? void 0 : t.value) && l.value === fe.left)
+  ), u = n(
+    () => Boolean((t == null ? void 0 : t.value) && l.value === fe.right)
+  ), d = n(
+    () => Boolean((t == null ? void 0 : t.value) && l.value === fe.top)
+  ), c = n(
+    () => Boolean((t == null ? void 0 : t.value) && l.value === fe.bottom)
+  );
+  return {
+    hasIcon: n(() => typeof (t == null ? void 0 : t.value) == "string" ? { name: t == null ? void 0 : t.value } : t == null ? void 0 : t.value),
+    hasIconLeft: o,
+    hasIconRight: u,
+    hasIconTop: d,
+    hasIconBottom: c,
+    hasIconBefore: e,
+    hasIconAfter: s
+  };
+}
+const eo = ["for"], to = { class: "vv-select__wrapper" }, lo = {
   key: 0,
   class: "vv-select__input-before"
-}, oa = { class: "vv-select__inner" }, aa = ["id"], la = ["disabled", "hidden"], sa = ["disabled", "value"], na = {
+}, ao = { class: "vv-select__inner" }, oo = ["id"], so = ["disabled", "hidden"], no = ["disabled", "value"], ro = {
   key: 1,
   class: "vv-select__input-after"
-}, ra = {
+}, io = {
   name: "VvSelect"
-}, ia = /* @__PURE__ */ q({
-  ...ra,
-  props: Xo,
-  emits: Qo,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), l = ref(), { HintSlot: i, hasHint: u, hasInvalid: c } = Ve(e, s), {
-      id: p,
-      modifiers: v,
-      disabled: n,
-      readonly: r,
-      loading: f,
-      icon: g,
+}, uo = /* @__PURE__ */ j({
+  ...io,
+  props: Qa,
+  emits: Za,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), o = N(), { HintSlot: u, hasHint: d, hasInvalid: c } = Be(e, s), {
+      id: v,
+      modifiers: p,
+      disabled: r,
+      readonly: i,
+      loading: b,
+      icon: _,
       iconPosition: k,
       invalid: A,
-      valid: b,
-      floating: S,
+      valid: y,
+      floating: m,
       multiple: I
-    } = toRefs(e), B = useUniqueId(p), E = computed(() => `${B.value}-hint`), { focused: O } = useComponentFocus(l, a), L = useElementVisibility(l);
-    watch(L, (R) => {
-      R && e.autofocus && (O.value = !0);
+    } = G(e), O = Le(v), D = n(() => `${O.value}-hint`), { focused: L } = it(o, l), M = $t(o);
+    ve(M, (B) => {
+      B && e.autofocus && (L.value = !0);
     });
-    const { hasIcon: K, hasIconBefore: ee, hasIconAfter: P } = useComponentIcon(
-      g,
+    const { hasIcon: C, hasIconBefore: se, hasIconAfter: P } = ut(
+      _,
       k
-    ), T = computed(() => !isEmpty(e.modelValue)), U = computed(() => e.disabled || e.readonly), te = computed(() => U.value ? -1 : e.tabindex), re = computed(() => {
+    ), W = n(() => !ge(e.modelValue)), F = n(() => e.disabled || e.readonly), ue = n(() => F.value ? -1 : e.tabindex), he = n(() => {
       if (e.invalid === !0)
         return !0;
       if (e.valid === !0)
         return !1;
-    }), ie = useBemModifiers(
+    }), ye = X(
       "vv-select",
-      v,
-      computed(() => ({
-        valid: b.value,
+      p,
+      n(() => ({
+        valid: y.value,
         invalid: A.value,
-        loading: f.value,
-        disabled: n.value,
-        readonly: r.value,
-        "icon-before": ee.value,
+        loading: b.value,
+        disabled: r.value,
+        readonly: i.value,
+        "icon-before": se.value,
         "icon-after": P.value,
-        dirty: T.value,
-        focus: O.value,
-        floating: S.value,
+        dirty: W.value,
+        focus: L.value,
+        floating: m.value,
         multiple: I.value
       }))
-    ), C = computed(() => ({
+    ), ne = n(() => ({
       name: e.name,
-      tabindex: te.value,
-      disabled: U.value,
+      tabindex: ue.value,
+      disabled: F.value,
       required: e.required,
       size: e.size,
       autocomplete: e.autocomplete,
       multiple: e.multiple,
-      "aria-invalid": re.value,
-      "aria-describedby": !c.value && u.value ? E.value : void 0,
-      "aria-errormessage": c.value ? E.value : void 0
-    })), oe = computed(() => ({
+      "aria-invalid": he.value,
+      "aria-describedby": !c.value && d.value ? D.value : void 0,
+      "aria-errormessage": c.value ? D.value : void 0
+    })), de = n(() => ({
       valid: e.valid,
       invalid: e.invalid,
       modelValue: e.modelValue
-    })), { getOptionLabel: fe, getOptionValue: se, getOptionDisabled: he } = useOptions(e), z = computed({
+    })), { getOptionLabel: _e, getOptionValue: re, getOptionDisabled: Ve } = rt(e), J = n({
       get: () => e.modelValue,
-      set: (R) => {
-        Array.isArray(R) && (R = R.filter((Y) => Y !== void 0)), a("update:modelValue", R);
+      set: (B) => {
+        Array.isArray(B) && (B = B.filter((Q) => Q !== void 0)), l("update:modelValue", B);
       }
     });
-    return (R, Y) => (d(), y("div", {
-      class: Z(t(ie))
+    return (B, Q) => (f(), g("div", {
+      class: le(a(ye))
     }, [
-      R.label ? (d(), y("label", {
+      B.label ? (f(), g("label", {
         key: 0,
-        for: t(B)
-      }, x(R.label), 9, Zo)) : w("", !0),
-      N("div", ea, [
-        R.$slots.before ? (d(), y("div", ta, [
-          $(R.$slots, "before", j(F(t(oe))))
+        for: a(O)
+      }, T(B.label), 9, eo)) : w("", !0),
+      x("div", to, [
+        B.$slots.before ? (f(), g("div", lo, [
+          V(B.$slots, "before", K(z(a(de))))
         ])) : w("", !0),
-        N("div", oa, [
-          t(ee) ? (d(), W(Q, G({
+        x("div", ao, [
+          a(se) ? (f(), H(ee, R({
             key: 0,
             class: "vv-select__icon"
-          }, t(K)), null, 16)) : w("", !0),
-          Se(N("select", G({
-            id: t(B),
+          }, a(C)), null, 16)) : w("", !0),
+          Oe(x("select", R({
+            id: a(O),
             ref_key: "select",
-            ref: l,
-            "onUpdate:modelValue": Y[0] || (Y[0] = (ae) => Ce(z) ? z.value = ae : null)
-          }, t(C)), [
-            R.placeholder ? (d(), y("option", {
+            ref: o,
+            "onUpdate:modelValue": Q[0] || (Q[0] = (ae) => Ee(J) ? J.value = ae : null)
+          }, a(ne)), [
+            B.placeholder ? (f(), g("option", {
               key: 0,
               value: void 0,
-              disabled: !R.unselectable,
-              hidden: !R.unselectable
-            }, x(R.placeholder), 9, la)) : w("", !0),
-            (d(!0), y(ne, null, ke(R.options, (ae, me) => (d(), y("option", {
-              key: me,
-              disabled: t(he)(ae),
-              value: t(se)(ae)
-            }, x(t(fe)(ae)), 9, sa))), 128))
-          ], 16, aa), [
-            [Bt, t(z)]
+              disabled: !B.unselectable,
+              hidden: !B.unselectable
+            }, T(B.placeholder), 9, so)) : w("", !0),
+            (f(!0), g(ie, null, Ne(B.options, (ae, Se) => (f(), g("option", {
+              key: Se,
+              disabled: a(Ve)(ae),
+              value: a(re)(ae)
+            }, T(a(_e)(ae)), 9, no))), 128))
+          ], 16, oo), [
+            [hl, a(J)]
           ]),
-          t(P) ? (d(), W(Q, G({
+          a(P) ? (f(), H(ee, R({
             key: 1,
             class: "vv-select__icon vv-select__icon-after"
-          }, t(K)), null, 16)) : w("", !0)
+          }, a(C)), null, 16)) : w("", !0)
         ]),
-        R.$slots.after ? (d(), y("div", na, [
-          $(R.$slots, "after", j(F(t(oe))))
+        B.$slots.after ? (f(), g("div", ro, [
+          V(B.$slots, "after", K(z(a(de))))
         ])) : w("", !0)
       ]),
-      de(t(i), {
-        id: t(E),
+      pe(a(u), {
+        id: a(D),
         class: "vv-select__hint"
       }, null, 8, ["id"])
     ], 2));
   }
-}), ua = ["id"], da = ["id", "for"], ca = ["id", "aria-controls", "aria-labelledby", "aria-describedby", "placeholder"], va = {
+}), co = ["id"], vo = ["id", "for"], fo = ["id", "aria-controls", "aria-labelledby", "aria-describedby", "placeholder"], po = {
   key: 0,
   class: "vv-select__input-before"
-}, pa = { class: "vv-select__inner" }, fa = ["aria-labelledby", "tabindex"], ma = ["aria-label", "onClick"], ba = {
+}, mo = { class: "vv-select__inner" }, bo = ["aria-labelledby", "tabindex"], ho = ["aria-label", "onClick"], yo = {
   key: 1,
   class: "vv-select__input-after"
-}, ha = { class: "vv-dropdown-action__hint" }, ya = {
+}, go = {
   name: "VvCombobox",
-  components: { VvDropdown: kt, VvDropdownItem: Ct }
-}, _l = /* @__PURE__ */ q({
-  ...ya,
-  props: qo,
-  emits: Fo,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), { HintSlot: l } = Ve(e, s), i = ref(null), u = ref(null), c = ref(null), { focused: p } = useComponentFocus(i, a), { focused: v } = useFocusWithin(c);
-    watch(p, (_) => {
+  components: { VvDropdown: il, VvDropdownOption: Qe }
+}, Vs = /* @__PURE__ */ j({
+  ...go,
+  props: Ga,
+  emits: Ma,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), { HintSlot: o } = Be(e, s), u = N(null), d = N(null), c = N(null), { focused: v } = it(u, l), { focused: p } = Vt(c);
+    ve(v, (S) => {
       if (e.autoOpen) {
-        if (_ && !f.value) {
+        if (S && !b.value) {
           k();
           return;
         }
-        !_ && f.value && !v.value && A();
+        !S && b.value && !p.value && A();
       }
-    }), watch(v, (_) => {
-      !p.value && !_ && f.value && A();
+    }), ve(p, (S) => {
+      !v.value && !S && b.value && A();
     });
-    const n = ref(""), r = refDebounced(
-      n,
+    const r = N(""), i = Al(
+      r,
       Number(e.debounceSearch)
     );
-    watch(
-      r,
-      () => a("change:search", r.value)
+    ve(
+      i,
+      () => l("change:search", i.value)
     );
-    const f = ref(!1), g = () => {
-      e.disabled || e.readonly || (f.value = !f.value);
+    const b = N(!1), _ = () => {
+      e.disabled || e.readonly || (b.value = !b.value);
     }, k = () => {
-      e.disabled || e.readonly || f.value || (f.value = !0);
+      e.disabled || e.readonly || b.value || (b.value = !0);
     }, A = () => {
-      e.disabled || e.readonly || !f.value || (f.value = !1);
+      e.disabled || e.readonly || !b.value || (b.value = !1);
     };
-    watch(f, (_) => {
-      T.value && nextTick(() => {
-        if (_) {
-          u.value && u.value.focus();
+    ve(b, (S) => {
+      W.value && Xe(() => {
+        if (S) {
+          d.value && d.value.focus();
           return;
         }
-        n.value = "";
+        r.value = "";
       });
     });
     const {
-      id: b,
-      icon: S,
+      id: y,
+      icon: m,
       iconPosition: I,
-      modifiers: B,
-      disabled: E,
-      readonly: O,
-      loading: L,
-      valid: K,
-      invalid: ee,
+      modifiers: O,
+      disabled: D,
+      readonly: L,
+      loading: M,
+      valid: C,
+      invalid: se,
       floating: P,
-      searchable: T
-    } = toRefs(e), U = useUniqueId(b), te = computed(() => `${U.value}-hint`), re = computed(() => `${U.value}-dropdown`), ie = computed(() => `${U.value}-search`), C = computed(() => `${U.value}-label`), { hasIcon: oe, hasIconBefore: fe, hasIconAfter: se } = useComponentIcon(
-      S,
+      searchable: W
+    } = G(e), F = Le(y), ue = n(() => `${F.value}-hint`), he = n(() => `${F.value}-dropdown`), ye = n(() => `${F.value}-search`), ne = n(() => `${F.value}-label`), { hasIcon: de, hasIconBefore: _e, hasIconAfter: re } = ut(
+      m,
       I
-    ), he = computed(() => !isEmpty(e.modelValue)), z = computed(() => E.value || O.value ? -1 : e.tabindex), R = useBemModifiers(
+    ), Ve = n(() => !ge(e.modelValue)), J = n(() => D.value || L.value ? -1 : e.tabindex), B = X(
       "vv-select",
-      B,
-      computed(() => ({
-        disabled: E.value,
-        loading: L.value,
-        readonly: O.value,
-        "icon-before": Boolean(fe.value),
-        "icon-after": Boolean(se.value),
-        valid: K.value,
-        invalid: ee.value,
-        dirty: he.value,
-        focus: p.value,
+      O,
+      n(() => ({
+        disabled: D.value,
+        loading: M.value,
+        readonly: L.value,
+        "icon-before": Boolean(_e.value),
+        "icon-after": Boolean(re.value),
+        valid: C.value,
+        invalid: se.value,
+        dirty: Ve.value,
+        focus: v.value,
         floating: P.value
       }))
-    ), Y = computed(
-      () => e.searchable ? m.value : e.options
-    ), { getOptionLabel: ae, getOptionValue: me, getOptionDisabled: pe } = useOptions(e), m = computed(() => {
-      var _;
-      return (_ = e.options) == null ? void 0 : _.filter((J) => ae(J).toLowerCase().includes(r.value.toLowerCase().trim()));
+    ), Q = n(
+      () => e.searchable ? h.value : e.options
+    ), { getOptionLabel: ae, getOptionValue: Se, getOptionDisabled: Ce } = rt(e), h = n(() => {
+      var S;
+      return (S = e.options) == null ? void 0 : S.filter((Z) => ae(Z).toLowerCase().includes(i.value.toLowerCase().trim()));
     });
-    function M(_) {
-      return Array.isArray(e.modelValue) ? contains(_, e.modelValue) || contains(me(_), e.modelValue) : equals(_, e.modelValue) || equals(me(_), e.modelValue);
+    function U(S) {
+      return Array.isArray(e.modelValue) ? we(S, e.modelValue) || we(Se(S), e.modelValue) : Pe(S, e.modelValue) || Pe(Se(S), e.modelValue);
     }
-    const ue = computed(() => {
-      let _ = [];
-      return Array.isArray(e.modelValue) ? _ = e.modelValue : e.modelValue && (_ = [e.modelValue]), e.options.filter(
-        (J) => _.includes(me(J))
+    const ce = n(() => {
+      let S = [];
+      return Array.isArray(e.modelValue) ? S = e.modelValue : e.modelValue && (S = [e.modelValue]), e.options.filter(
+        (Z) => S.includes(Se(Z))
       );
-    }), ye = computed(() => ue.value.map((_) => ae(_)).join(e.separator));
-    watch(ue, () => {
+    }), $e = n(() => ce.value.map((S) => ae(S)).join(e.separator));
+    ve(ce, () => {
       !e.multiple && e.autoClose && A();
     });
-    const He = () => {
-      e.autoOpen ? k() : g();
-    }, Ee = (_) => {
-      var $e;
+    const dt = () => {
+      e.autoOpen ? k() : _();
+    }, Me = (S) => {
+      var Te;
       if (e.disabled || e.readonly)
         return;
-      const J = me(_);
-      let H = J;
+      const Z = Se(S);
+      let q = Z;
       if (e.multiple)
         if (Array.isArray(e.modelValue)) {
-          if (e.maxValues !== void 0 && e.maxValues >= 0 && (($e = e.modelValue) == null ? void 0 : $e.length) >= e.maxValues && !contains(J, e.modelValue))
+          if (e.maxValues !== void 0 && e.maxValues >= 0 && ((Te = e.modelValue) == null ? void 0 : Te.length) >= e.maxValues && !we(Z, e.modelValue))
             return;
-          H = contains(J, e.modelValue) ? removeFromList(J, e.modelValue) : [...e.modelValue, J];
+          q = we(Z, e.modelValue) ? Ll(Z, e.modelValue) : [...e.modelValue, Z];
         } else
-          H = [J];
+          q = [Z];
       else
-        e.unselectable && J === e.modelValue && (H = void 0);
-      a("update:modelValue", H);
-    }, D = computed(() => ({
-      id: U.value,
+        e.unselectable && Z === e.modelValue && (q = void 0);
+      l("update:modelValue", q);
+    }, E = n(() => ({
+      id: F.value,
       name: e.name,
-      tabindex: z.value,
-      valid: K.value,
+      tabindex: J.value,
+      valid: C.value,
       validLabel: e.validLabel,
-      invalid: ee.value,
+      invalid: se.value,
       invalidLabel: e.invalidLabel,
       hintLabel: e.hintLabel,
-      loading: L.value,
+      loading: M.value,
       loadingLabel: e.loadingLabel,
-      disabled: E.value,
-      readonly: O.value,
+      disabled: D.value,
+      readonly: L.value,
       modifiers: e.modifiers,
-      options: Y.value,
+      options: Q.value,
       labelKey: e.labelKey,
       valueKey: e.valueKey,
       icon: e.icon,
@@ -2154,8 +2453,8 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
       label: e.label,
       placeholder: e.placeholder,
       modelValue: e.modelValue
-    })), le = computed(() => ({
-      id: re.value,
+    })), oe = n(() => ({
+      id: he.value,
       reference: c.value,
       placement: e.placement,
       transitionName: e.transitionName,
@@ -2165,161 +2464,184 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
       autoPlacement: e.autoPlacement,
       arrow: e.arrow,
       autoClose: e.autoClose,
-      autofocusFirst: T.value ? !1 : e.autofocusFirst,
+      autofocusFirst: W.value ? !1 : e.autofocusFirst,
       triggerWidth: e.triggerWidth,
       modifiers: e.dropdownModifiers
-    })), we = computed(() => ({
+    })), Re = n(() => ({
       valid: e.valid,
       invalid: e.invalid,
       modelValue: e.modelValue
     }));
-    return onKeyStroke([" ", "Enter"], (_) => {
-      e.autoOpen || !f.value && p.value && (_.preventDefault(), _.stopImmediatePropagation(), g());
-    }), (_, J) => _.native ? (d(), W(ia, G({ key: 1 }, t(D), {
-      "onUpdate:modelValue": J[2] || (J[2] = (H) => a("update:modelValue", H))
-    }), null, 16)) : (d(), y("div", {
+    return He([" ", "Enter"], (S) => {
+      e.autoOpen || !b.value && v.value && (S.preventDefault(), S.stopImmediatePropagation(), _());
+    }), (S, Z) => S.native ? (f(), H(uo, R({ key: 1 }, a(E), {
+      "onUpdate:modelValue": Z[2] || (Z[2] = (q) => l("update:modelValue", q))
+    }), null, 16)) : (f(), g("div", {
       key: 0,
-      id: t(U),
-      class: Z(t(R))
+      id: a(F),
+      class: le(a(B))
     }, [
-      _.label ? (d(), y("label", {
+      S.label ? (f(), g("label", {
         key: 0,
-        id: t(C),
-        for: t(T) ? t(ie) : void 0
-      }, x(_.label), 9, da)) : w("", !0),
-      N("div", {
+        id: a(ne),
+        for: a(W) ? a(ye) : void 0
+      }, T(S.label), 9, vo)) : w("", !0),
+      x("div", {
         ref_key: "wrapperEl",
         ref: c,
         class: "vv-select__wrapper"
       }, [
-        de(kt, G({
-          modelValue: t(f),
-          "onUpdate:modelValue": J[1] || (J[1] = (H) => Ce(f) ? f.value = H : null)
-        }, t(le), { role: "listbox" }), Rt({
-          default: ve(({ aria: H }) => [
-            _.$slots.before ? (d(), y("div", va, [
-              $(_.$slots, "before", j(F(t(we))))
+        pe(il, R({
+          modelValue: a(b),
+          "onUpdate:modelValue": Z[1] || (Z[1] = (q) => Ee(b) ? b.value = q : null)
+        }, a(oe), {
+          role: a(je).listbox
+        }), yl({
+          default: te(({ aria: q }) => [
+            S.$slots.before ? (f(), g("div", po, [
+              V(S.$slots, "before", K(z(a(Re))))
             ])) : w("", !0),
-            N("div", pa, [
-              t(fe) ? (d(), W(Q, G({
+            x("div", mo, [
+              a(_e) ? (f(), H(ee, R({
                 key: 0,
                 class: "vv-select__icon"
-              }, t(oe)), null, 16)) : w("", !0),
-              N("div", G({
+              }, a(de)), null, 16)) : w("", !0),
+              x("div", R({
                 ref_key: "inputEl",
-                ref: i
-              }, H, {
-                "aria-labelledby": t(C),
+                ref: u
+              }, q, {
+                "aria-labelledby": a(ne),
                 class: "vv-select__input",
                 role: "combobox",
-                tabindex: t(z),
-                onClickPassive: He
+                tabindex: a(J),
+                onClickPassive: dt
               }), [
-                $(_.$slots, "value", j(F({ selectedOptions: t(ue), onInput: Ee })), () => [
-                  t(ye) ? (d(), y(ne, { key: 0 }, [
-                    _.badges ? (d(!0), y(ne, { key: 1 }, ke(t(ue), ($e, Xe) => (d(), W(co, {
-                      key: Xe,
-                      modifiers: _.badgeModifiers,
+                V(S.$slots, "value", K(z({ selectedOptions: a(ce), onInput: Me })), () => [
+                  a($e) ? (f(), g(ie, { key: 0 }, [
+                    S.badges ? (f(!0), g(ie, { key: 1 }, Ne(a(ce), (Te, wt) => (f(), H(ea, {
+                      key: wt,
+                      modifiers: S.badgeModifiers,
                       class: "vv-select__badge"
                     }, {
-                      default: ve(() => [
-                        X(x(t(ae)($e)) + " ", 1),
-                        _.unselectable && !t(O) && !t(E) ? (d(), y("button", {
+                      default: te(() => [
+                        Y(T(a(ae)(Te)) + " ", 1),
+                        S.unselectable && !a(L) && !a(D) ? (f(), g("button", {
                           key: 0,
-                          "aria-label": _.deselectLabel,
-                          onClick: it((rl) => Ee($e), ["stop"])
+                          "aria-label": S.deselectActionLabel,
+                          onClick: Rt((is) => Me(Te), ["stop"])
                         }, [
-                          de(Q, { name: "close" })
-                        ], 8, ma)) : w("", !0)
+                          pe(ee, { name: "close" })
+                        ], 8, ho)) : w("", !0)
                       ]),
                       _: 2
-                    }, 1032, ["modifiers"]))), 128)) : (d(), y(ne, { key: 0 }, [
-                      X(x(t(ye)), 1)
+                    }, 1032, ["modifiers"]))), 128)) : (f(), g(ie, { key: 0 }, [
+                      Y(T(a($e)), 1)
                     ], 64))
-                  ], 64)) : (d(), y(ne, { key: 1 }, [
-                    X(x(_.placeholder), 1)
+                  ], 64)) : (f(), g(ie, { key: 1 }, [
+                    Y(T(S.placeholder), 1)
                   ], 64))
                 ])
-              ], 16, fa),
-              t(se) ? (d(), W(Q, G({
+              ], 16, bo),
+              a(re) ? (f(), H(ee, R({
                 key: 1,
                 class: "vv-select__icon vv-select__icon-after"
-              }, t(oe)), null, 16)) : w("", !0)
+              }, a(de)), null, 16)) : w("", !0)
             ]),
-            _.$slots.after ? (d(), y("div", ba, [
-              $(_.$slots, "after", j(F(t(we))))
+            S.$slots.after ? (f(), g("div", yo, [
+              V(S.$slots, "after", K(z(a(Re))))
             ])) : w("", !0)
           ]),
-          items: ve(() => [
-            (d(!0), y(ne, null, ke(t(m), (H, $e) => (d(), W(Ct, {
-              key: $e,
-              class: Z(["vv-dropdown-action", {
-                disabled: t(pe)(H),
-                selected: M(H),
-                "vv-dropdown-action--unselectable": _.unselectable && M(H)
-              }]),
-              tabindex: t(pe)(H) ? -1 : 0,
-              "aria-selected": M(H),
-              "aria-disabled": t(pe)(H),
-              onClickPassive: (Xe) => Ee(H)
+          items: te(() => [
+            a(h).length ? (f(!0), g(ie, { key: 0 }, Ne(a(h), (q, Te) => (f(), H(Qe, R({
+              disabled: a(Ce)(q),
+              selected: U(q),
+              unselectable: S.unselectable,
+              deselectHintLabel: S.deselectHintLabel,
+              selectHintLabel: S.selectHintLabel,
+              selectedHintLabel: S.selectedHintLabel
             }, {
-              default: ve(() => [
-                $(_.$slots, "option", j(F({
-                  option: H,
-                  selectedOptions: t(ue),
-                  selected: M(H),
-                  disabled: t(pe)(H)
+              key: Te,
+              class: "vv-dropdown-option",
+              onClickPassive: (wt) => Me(q)
+            }), {
+              default: te(() => [
+                V(S.$slots, "option", K(z({
+                  option: q,
+                  selectedOptions: a(ce),
+                  selected: U(q),
+                  disabled: a(Ce)(q)
                 })), () => [
-                  X(x(t(ae)(H)) + " ", 1),
-                  N("span", ha, [
-                    M(H) ? (d(), y(ne, { key: 0 }, [
-                      X(x(_.unselectable ? _.pressToDeselectLabel : _.selectedLabel), 1)
-                    ], 64)) : t(pe)(H) ? w("", !0) : (d(), y(ne, { key: 1 }, [
-                      X(x(_.pressToSelectLabel), 1)
-                    ], 64))
-                  ])
+                  Y(T(a(ae)(q)), 1)
                 ])
               ]),
               _: 2
-            }, 1032, ["tabindex", "class", "aria-selected", "aria-disabled", "onClickPassive"]))), 128))
+            }, 1040, ["onClickPassive"]))), 128)) : S.options.length ? (f(), H(Qe, {
+              key: 2,
+              modifiers: "inert"
+            }, {
+              default: te(() => [
+                V(S.$slots, "no-results", {}, () => [
+                  Y(T(S.noResultsLabel), 1)
+                ])
+              ]),
+              _: 3
+            })) : (f(), H(Qe, {
+              key: 1,
+              modifiers: "inert"
+            }, {
+              default: te(() => [
+                V(S.$slots, "no-options", {}, () => [
+                  Y(T(S.noOptionsLabel), 1)
+                ])
+              ]),
+              _: 3
+            }))
           ]),
           _: 2
         }, [
-          t(T) ? {
+          a(W) || S.$slots["dropdown::before"] ? {
             name: "before",
-            fn: ve(() => [
-              t(T) ? Se((d(), y("input", {
+            fn: te(() => [
+              V(S.$slots, "dropdown::before"),
+              a(W) ? Oe((f(), g("input", {
                 key: 0,
-                id: t(ie),
+                id: a(ye),
                 ref_key: "inputSearchEl",
-                ref: u,
-                "onUpdate:modelValue": J[0] || (J[0] = (H) => Ce(n) ? n.value = H : null),
+                ref: d,
+                "onUpdate:modelValue": Z[0] || (Z[0] = (q) => Ee(r) ? r.value = q : null),
                 "aria-autocomplete": "list",
-                "aria-controls": t(re),
-                "aria-labelledby": t(C),
-                "aria-describedby": t(te),
+                "aria-controls": a(he),
+                "aria-labelledby": a(ne),
+                "aria-describedby": a(ue),
                 autocomplete: "off",
                 spellcheck: "false",
                 type: "search",
                 class: "vv-dropdown__search",
-                placeholder: _.searchPlaceholder
-              }, null, 8, ca)), [
-                [qe, t(f)],
-                [ct, t(n)]
+                placeholder: S.searchPlaceholder
+              }, null, 8, fo)), [
+                [St, a(b)],
+                [Mt, a(r)]
               ]) : w("", !0)
             ]),
             key: "0"
+          } : void 0,
+          S.$slots["dropdown::after"] ? {
+            name: "after",
+            fn: te(() => [
+              V(S.$slots, "dropdown::after")
+            ]),
+            key: "1"
           } : void 0
-        ]), 1040, ["modelValue"])
+        ]), 1040, ["modelValue", "role"])
       ], 512),
-      de(t(l), {
-        id: t(te),
+      pe(a(o), {
+        id: a(ue),
         class: "vv-select__hint"
       }, null, 8, ["id"])
-    ], 10, ua));
+    ], 10, co));
   }
-}), ga = ["open", "close", "update:modelValue"], _a = {
-  ...Ne,
+}), _o = ["open", "close", "update:modelValue"], So = {
+  ...st,
   /**
    * Dialog title
    */
@@ -2340,77 +2662,77 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    * Close dialog on click outside
    */
   autoClose: { type: Boolean, default: !0 }
-}, Sa = {
+}, Vo = {
   key: 0,
   class: "vv-dialog__header"
-}, Va = { class: "vv-dialog__content" }, $a = {
+}, $o = { class: "vv-dialog__content" }, ko = {
   key: 1,
   class: "vv-dialog__footer"
-}, ka = {
+}, Ao = {
   name: "VvDialog"
-}, Sl = /* @__PURE__ */ q({
-  ...ka,
-  props: _a,
-  emits: ga,
-  setup(o, { emit: a }) {
-    const e = o, s = useVModel(e, "modelValue", a), l = ref(!0), i = ref(null), u = computed(() => {
-      const { id: r } = e;
+}, $s = /* @__PURE__ */ j({
+  ...Ao,
+  props: So,
+  emits: _o,
+  setup(t, { emit: l }) {
+    const e = t, s = et(e, "modelValue", l), o = N(!0), u = N(null), d = n(() => {
+      const { id: i } = e;
       return {
-        id: r,
-        open: l.value
+        id: i,
+        open: o.value
       };
-    }), c = computed(() => e.size ? ["vv-dialog", `vv-dialog--${e.size}`] : "vv-dialog"), p = computed(() => `vv-dialog--${e.transition}`), v = {
+    }), c = n(() => e.size ? ["vv-dialog", `vv-dialog--${e.size}`] : "vv-dialog"), v = n(() => `vv-dialog--${e.transition}`), p = {
       "before-enter": () => {
-        l.value = !0, a("open");
+        o.value = !0, l("open");
       },
       "after-leave": () => {
-        l.value = !1, a("close");
+        o.value = !1, l("close");
       }
     };
-    onClickOutside(i, () => {
+    jt(u, () => {
       e.autoClose && (s.value = !1);
     });
-    function n() {
+    function r() {
       s.value = !1;
     }
-    return onKeyStroke("Escape", (r) => {
-      s.value && (r.preventDefault(), n());
-    }), (r, f) => (d(), W(dt, G({ name: t(p) }, Tt(v)), {
-      default: ve(() => [
-        Se(N("dialog", G(t(u), { class: t(c) }), [
-          N("article", {
+    return He("Escape", (i) => {
+      s.value && (i.preventDefault(), r());
+    }), (i, b) => (f(), H(xt, R({ name: a(v) }, gl(p)), {
+      default: te(() => [
+        Oe(x("dialog", R(a(d), { class: a(c) }), [
+          x("article", {
             ref_key: "modalWrapper",
-            ref: i,
+            ref: u,
             class: "vv-dialog__wrapper"
           }, [
-            r.$slots.header || r.title ? (d(), y("header", Sa, [
-              $(r.$slots, "header", {}, () => [
-                X(x(r.title) + " ", 1),
-                N("button", {
+            i.$slots.header || i.title ? (f(), g("header", Vo, [
+              V(i.$slots, "header", {}, () => [
+                Y(T(i.title) + " ", 1),
+                x("button", {
                   type: "button",
                   "aria-label": "Close",
                   class: "vv-dialog__close",
-                  onClickPassive: n
+                  onClickPassive: r
                 }, [
-                  de(Q, { name: "close" })
+                  pe(ee, { name: "close" })
                 ], 32)
               ])
             ])) : w("", !0),
-            N("div", Va, [
-              $(r.$slots, "default")
+            x("div", $o, [
+              V(i.$slots, "default")
             ]),
-            r.$slots.footer ? (d(), y("footer", $a, [
-              $(r.$slots, "footer")
+            i.$slots.footer ? (f(), g("footer", ko, [
+              V(i.$slots, "footer")
             ])) : w("", !0)
           ], 512)
         ], 16), [
-          [qe, t(s)]
+          [St, a(s)]
         ])
       ]),
       _: 3
     }, 16, ["name"]));
   }
-}), V = {
+}), $ = {
   TEXT: "text",
   PASSWORD: "password",
   NUMBER: "number",
@@ -2424,15 +2746,15 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
   DATETIME_LOCAL: "datetime-local",
   MONTH: "month",
   WEEK: "week"
-}, _e = {
+}, Ie = {
   PASSWORD_SHOW: "eye-on",
   PASSWORD_HIDE: "eye-off",
   DATE: "calendar",
   TIME: "time",
   COLOR: "color",
   SEARCH: "close"
-}, Ca = ["update:modelValue", "focus", "blur", "keyup"], Aa = {
-  ...gt,
+}, Co = ["update:modelValue", "focus", "blur", "keyup"], wo = {
+  ...al,
   /**
    * Input value
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value
@@ -2444,8 +2766,8 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    */
   type: {
     type: String,
-    default: V.TEXT,
-    validator: (o) => Object.values(V).includes(o)
+    default: $.TEXT,
+    validator: (t) => Object.values($).includes(t)
   },
   /**
    * Minimum value
@@ -2483,7 +2805,7 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    */
   iconShowPassword: {
     type: String,
-    default: _e.PASSWORD_SHOW
+    default: Ie.PASSWORD_SHOW
   },
   /**
    * VvIcon name for hide password button
@@ -2491,7 +2813,7 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    */
   iconHidePassword: {
     type: String,
-    default: _e.PASSWORD_HIDE
+    default: Ie.PASSWORD_HIDE
   },
   /**
    * VvIcon name for clear button
@@ -2499,7 +2821,7 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
    */
   iconClear: {
     type: String,
-    default: _e.SEARCH
+    default: Ie.SEARCH
   },
   /**
    * Label for step up button
@@ -2536,9 +2858,9 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
     type: String,
     default: "Clear"
   }
-}, st = defineComponent({
+}, Bt = j({
   components: {
-    VvIcon: Q
+    VvIcon: ee
   },
   props: {
     disabled: {
@@ -2555,33 +2877,33 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
     },
     iconShow: {
       type: String,
-      default: _e.PASSWORD_SHOW
+      default: Ie.PASSWORD_SHOW
     },
     iconHide: {
       type: String,
-      default: _e.PASSWORD_HIDE
+      default: Ie.PASSWORD_HIDE
     }
   },
   emits: ["toggle-password"],
-  setup(o, { emit: a }) {
-    const e = ref(!1), s = computed(
-      () => e.value ? o.iconHide : o.iconShow
+  setup(t, { emit: l }) {
+    const e = N(!1), s = n(
+      () => e.value ? t.iconHide : t.iconShow
     );
-    function l(i) {
-      i == null || i.stopPropagation(), o.disabled || (e.value = !e.value, a("toggle-password", e.value));
+    function o(u) {
+      u == null || u.stopPropagation(), t.disabled || (e.value = !e.value, l("toggle-password", e.value));
     }
     return {
       active: e,
       activeIcon: s,
-      onClick: l
+      onClick: o
     };
   },
   render() {
-    const o = h(Q, {
+    const t = be(ee, {
       name: this.activeIcon,
       class: "vv-input-text__action-icon"
     });
-    return h(
+    return be(
       "button",
       {
         disabled: this.disabled,
@@ -2590,12 +2912,12 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
         type: "button",
         onClick: this.onClick
       },
-      o
+      t
     );
   }
-}), Ue = defineComponent({
+}), vt = j({
   components: {
-    VvIcon: Q
+    VvIcon: ee
   },
   props: {
     disabled: {
@@ -2607,22 +2929,22 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
     },
     mode: {
       type: String,
-      validator: (o) => ["up", "down"].includes(o),
+      validator: (t) => ["up", "down"].includes(t),
       default: "up"
     }
   },
   emits: ["step-up", "step-down"],
-  setup(o, { emit: a }) {
-    const e = computed(() => o.mode === "up");
+  setup(t, { emit: l }) {
+    const e = n(() => t.mode === "up");
     return {
       isUp: e,
-      onClick: (l) => {
-        l == null || l.stopPropagation(), o.disabled || a(e.value ? "step-up" : "step-down");
+      onClick: (o) => {
+        o == null || o.stopPropagation(), t.disabled || l(e.value ? "step-up" : "step-down");
       }
     };
   },
   render() {
-    return h("button", {
+    return be("button", {
       class: [
         "vv-input-text__action-chevron",
         this.isUp && "vv-input-text__action-chevron-up"
@@ -2632,9 +2954,9 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
       onClick: this.onClick
     });
   }
-}), nt = defineComponent({
+}), Tt = j({
   components: {
-    VvIcon: Q
+    VvIcon: ee
   },
   props: {
     disabled: {
@@ -2651,20 +2973,20 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
     }
   },
   emits: ["clear"],
-  setup(o, { emit: a }) {
+  setup(t, { emit: l }) {
     function e(s) {
-      s == null || s.stopPropagation(), o.disabled || a("clear");
+      s == null || s.stopPropagation(), t.disabled || l("clear");
     }
     return {
       onClick: e
     };
   },
   render() {
-    const o = h(Q, {
+    const t = be(ee, {
       name: this.icon,
       class: "vv-input-text__action-icon"
     });
-    return h(
+    return be(
       "button",
       {
         disabled: this.disabled,
@@ -2673,38 +2995,38 @@ const Mo = ["for"], xo = ["id", "name", "disabled", "value", "tabindex", "aria-i
         type: "button",
         onClick: this.onClick
       },
-      o
+      t
     );
   }
 });
-function We(o, a) {
+function ft(t, l) {
   return {
     name: "VvInputTextActions",
     components: {
-      VvIcon: Q,
-      VvInputPasswordAction: st,
-      VvInputStepAction: Ue,
-      VvInputClearAction: nt
+      VvIcon: ee,
+      VvInputPasswordAction: Bt,
+      VvInputStepAction: vt,
+      VvInputClearAction: Tt
     },
     setup() {
       return {
-        isDisabled: computed(() => a.disabled || a.readonly),
-        labelStepUp: a.labelStepUp,
-        labelStepDown: a.labelStepDown,
-        labelShowPassword: a.labelShowPassword,
-        labelHidePassword: a.labelHidePassword,
-        labelClear: a.labelClear,
-        iconShowPassword: a.iconShowPassword,
-        iconHidePassword: a.iconHidePassword
+        isDisabled: n(() => l.disabled || l.readonly),
+        labelStepUp: l.labelStepUp,
+        labelStepDown: l.labelStepDown,
+        labelShowPassword: l.labelShowPassword,
+        labelHidePassword: l.labelHidePassword,
+        labelClear: l.labelClear,
+        iconShowPassword: l.iconShowPassword,
+        iconHidePassword: l.iconHidePassword
       };
     },
     render() {
       let e = null;
-      switch (o) {
-        case V.SEARCH: {
+      switch (t) {
+        case $.SEARCH: {
           const { onClear: s } = this.$attrs;
           e = [
-            h(nt, {
+            be(Tt, {
               disabled: this.isDisabled,
               label: this.labelShowPassword,
               onClear: s
@@ -2712,10 +3034,10 @@ function We(o, a) {
           ];
           break;
         }
-        case V.PASSWORD: {
+        case $.PASSWORD: {
           const { onTogglePassword: s } = this.$attrs;
           e = [
-            h(st, {
+            be(Bt, {
               disabled: this.isDisabled,
               onTogglePassword: s,
               labelShow: this.labelShowPassword,
@@ -2726,207 +3048,226 @@ function We(o, a) {
           ];
           break;
         }
-        case V.NUMBER: {
-          const { onStepUp: s, onStepDown: l } = this.$attrs;
+        case $.NUMBER: {
+          const { onStepUp: s, onStepDown: o } = this.$attrs;
           e = [
-            h(Ue, {
+            be(vt, {
               mode: "up",
-              disabled: this.isDisabled || a.max !== void 0 && a.modelValue === a.max,
+              disabled: this.isDisabled || l.max !== void 0 && l.modelValue === l.max,
               label: this.labelStepUp,
               onStepUp: s,
-              onStepDown: l
+              onStepDown: o
             }),
-            h(Ue, {
+            be(vt, {
               mode: "down",
-              disabled: this.isDisabled || a.min !== void 0 && a.modelValue === a.min,
+              disabled: this.isDisabled || l.min !== void 0 && l.modelValue === l.min,
               label: this.labelStepDown,
               onStepUp: s,
-              onStepDown: l
+              onStepDown: o
             })
           ];
           break;
         }
       }
-      return Array.isArray(e) ? h("div", { class: "vv-input-text__actions-group" }, e) : e;
+      return Array.isArray(e) ? be("div", { class: "vv-input-text__actions-group" }, e) : e;
     }
   };
 }
-const wa = ["for"], Ea = { class: "vv-input-text__wrapper" }, Ia = {
+function ul(t, l, e = 0) {
+  let s;
+  return typeof e == "string" && (e = parseInt(e)), n({
+    get: () => t == null ? void 0 : t.value,
+    set: (o) => {
+      s && clearTimeout(s), s = setTimeout(() => {
+        l("update:modelValue", o);
+      }, e);
+    }
+  });
+}
+function dl(t, l) {
+  const e = n(() => (a(t) ?? "").length), s = n(() => (l == null ? void 0 : l.lowerLimit) !== void 0 && e.value < (l == null ? void 0 : l.lowerLimit) ? e.value - l.lowerLimit : (l == null ? void 0 : l.upperLimit) !== void 0 && e.value < (l == null ? void 0 : l.upperLimit) ? l.upperLimit - e.value : 0), o = n(() => (l == null ? void 0 : l.mode) === !1 ? "" : (l == null ? void 0 : l.mode) === "limit" && (l != null && l.upperLimit) ? `${e.value} / ${l.lowerLimit ? `${l.lowerLimit}-` : ""}${l.upperLimit}` : (l == null ? void 0 : l.mode) === "countdown" ? s.value === 0 ? void 0 : s : e.value);
+  return {
+    length: e,
+    gap: s,
+    formatted: o
+  };
+}
+const Io = ["for"], Eo = { class: "vv-input-text__wrapper" }, Po = {
   key: 0,
   class: "vv-input-text__input-before"
-}, Pa = { class: "vv-input-text__inner" }, Oa = ["id"], Da = {
+}, Oo = { class: "vv-input-text__inner" }, Do = ["id"], Lo = {
   key: 1,
   class: "vv-input-text__input-after"
-}, Ba = {
+}, Bo = {
   key: 2,
   class: "vv-input-text__limit"
-}, Ra = {
+}, To = {
   name: "VvInputText"
-}, Vl = /* @__PURE__ */ q({
-  ...Ra,
-  props: Aa,
-  emits: Ca,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), l = ref(), {
-      id: i,
-      icon: u,
+}, ks = /* @__PURE__ */ j({
+  ...To,
+  props: wo,
+  emits: Co,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), o = N(), {
+      id: u,
+      icon: d,
       iconPosition: c,
-      label: p,
-      modelValue: v,
-      count: n,
-      valid: r,
-      invalid: f,
-      loading: g
-    } = toRefs(e), k = useUniqueId(i), A = computed(() => `${k.value}-hint`), b = computed(
-      () => e.floating && isEmpty(e.placeholder) ? " " : e.placeholder
-    ), S = useDebouncedInput(v, a, e.debounce), { focused: I } = useComponentFocus(l, a), B = useElementVisibility(l);
-    watch(B, (D) => {
-      D && e.autofocus && (I.value = !0);
+      label: v,
+      modelValue: p,
+      count: r,
+      valid: i,
+      invalid: b,
+      loading: _
+    } = G(e), k = Le(u), A = n(() => `${k.value}-hint`), y = n(
+      () => e.floating && ge(e.placeholder) ? " " : e.placeholder
+    ), m = ul(p, l, e.debounce), { focused: I } = it(o, l), O = $t(o);
+    ve(O, (E) => {
+      E && e.autofocus && (I.value = !0);
     });
-    const E = ref(!1), O = computed(() => e.type === V.PASSWORD), L = () => {
-      E.value = !E.value;
-    }, K = computed(
-      () => e.type === V.TIME || e.type === V.DATETIME_LOCAL || e.type === V.DATE || e.type === V.WEEK || e.type === V.MONTH
-    ), ee = computed(() => e.type === V.NUMBER), P = () => {
-      se.value && (l.value.stepUp(), S.value = unref(l).value);
-    }, T = () => {
-      se.value && (l.value.stepDown(), S.value = unref(l).value);
-    }, U = computed(() => e.type === V.SEARCH), te = () => {
-      S.value = void 0;
-    }, { hasIcon: re, hasIconBefore: ie, hasIconAfter: C } = useComponentIcon(
-      u,
+    const D = N(!1), L = n(() => e.type === $.PASSWORD), M = () => {
+      D.value = !D.value;
+    }, C = n(
+      () => e.type === $.TIME || e.type === $.DATETIME_LOCAL || e.type === $.DATE || e.type === $.WEEK || e.type === $.MONTH
+    ), se = n(() => e.type === $.NUMBER), P = () => {
+      re.value && (o.value.stepUp(), m.value = a(o).value);
+    }, W = () => {
+      re.value && (o.value.stepDown(), m.value = a(o).value);
+    }, F = n(() => e.type === $.SEARCH), ue = () => {
+      m.value = void 0;
+    }, { hasIcon: he, hasIconBefore: ye, hasIconAfter: ne } = ut(
+      d,
       c
-    ), oe = computed(() => {
+    ), de = n(() => {
       switch (e.type) {
-        case V.COLOR:
-          return { name: _e.COLOR };
-        case V.DATE:
-        case V.DATETIME_LOCAL:
-        case V.WEEK:
-        case V.MONTH:
-          return { name: _e.DATE };
-        case V.TIME:
-          return { name: _e.TIME };
+        case $.COLOR:
+          return { name: Ie.COLOR };
+        case $.DATE:
+        case $.DATETIME_LOCAL:
+        case $.WEEK:
+        case $.MONTH:
+          return { name: Ie.DATE };
+        case $.TIME:
+          return { name: Ie.TIME };
         default:
           return "";
       }
-    }), { formatted: fe } = useTextCount(S, {
+    }), { formatted: _e } = dl(m, {
       mode: e.count,
       upperLimit: e.maxlength,
       lowerLimit: e.minlength
-    }), se = computed(() => !e.disabled && !e.readonly), he = computed(
-      () => se.value ? e.tabindex : -1
-    ), z = computed(() => !isEmpty(v)), R = computed(() => {
-      if (f.value === !0)
+    }), re = n(() => !e.disabled && !e.readonly), Ve = n(
+      () => re.value ? e.tabindex : -1
+    ), J = n(() => !ge(p)), B = n(() => {
+      if (b.value === !0)
         return !0;
-      if (r.value === !0)
+      if (i.value === !0)
         return !1;
-    }), { modifiers: Y } = toRefs(e), ae = useBemModifiers(
+    }), { modifiers: Q } = G(e), ae = X(
       "vv-input-text",
-      Y,
-      computed(() => ({
-        valid: r.value,
-        invalid: f.value,
-        loading: g.value,
+      Q,
+      n(() => ({
+        valid: i.value,
+        invalid: b.value,
+        loading: _.value,
         disabled: e.disabled,
         readonly: e.readonly,
-        "icon-before": ie.value,
-        "icon-after": C.value || !isEmpty(oe),
-        floating: e.floating && !isEmpty(e.label),
-        dirty: z.value,
+        "icon-before": ye.value,
+        "icon-after": ne.value || !ge(de),
+        floating: e.floating && !ge(e.label),
+        dirty: J.value,
         focus: I.value
       }))
-    ), me = computed(() => {
-      const D = (() => O.value && E.value || K.value && !z.value && !I.value ? V.TEXT : e.type)(), le = {
-        type: D,
+    ), Se = n(() => {
+      const E = (() => L.value && D.value || C.value && !J.value && !I.value ? $.TEXT : e.type)(), oe = {
+        type: E,
         name: e.name,
-        tabindex: he.value,
+        tabindex: Ve.value,
         disabled: e.disabled,
         readonly: e.readonly,
         required: e.required,
         autocomplete: e.autocomplete,
-        "aria-invalid": R.value,
-        "aria-describedby": !ue.value && M.value ? A.value : void 0,
-        "aria-errormessage": ue.value ? A.value : void 0
+        "aria-invalid": B.value,
+        "aria-describedby": !ce.value && U.value ? A.value : void 0,
+        "aria-errormessage": ce.value ? A.value : void 0
       };
-      return (D === V.DATE || D === V.MONTH || D === V.WEEK || D === V.TIME || D === V.DATETIME_LOCAL || D === V.NUMBER) && (le.step = e.step, le.max = String(e.max), le.min = String(e.min)), (D === V.TEXT || D === V.SEARCH || D === V.URL || D === V.TEL || D === V.EMAIL || D === V.PASSWORD || D === V.NUMBER) && (le.placeholder = b.value), (D === V.TEXT || D === V.SEARCH || D === V.URL || D === V.TEL || D === V.EMAIL || D === V.PASSWORD) && (le.minlength = e.minlength, le.maxlength = e.maxlength, le.pattern = e.pattern), D === V.EMAIL && (le.multiple = e.multiple), le;
-    }), pe = computed(() => ({
+      return (E === $.DATE || E === $.MONTH || E === $.WEEK || E === $.TIME || E === $.DATETIME_LOCAL || E === $.NUMBER) && (oe.step = e.step, oe.max = String(e.max), oe.min = String(e.min)), (E === $.TEXT || E === $.SEARCH || E === $.URL || E === $.TEL || E === $.EMAIL || E === $.PASSWORD || E === $.NUMBER) && (oe.placeholder = y.value), (E === $.TEXT || E === $.SEARCH || E === $.URL || E === $.TEL || E === $.EMAIL || E === $.PASSWORD) && (oe.minlength = e.minlength, oe.maxlength = e.maxlength, oe.pattern = e.pattern), E === $.EMAIL && (oe.multiple = e.multiple), oe;
+    }), Ce = n(() => ({
       valid: e.valid,
       invalid: e.invalid,
       modelValue: e.modelValue,
-      togglePassword: L,
+      togglePassword: M,
       stepUp: P,
-      stepDown: T,
-      clear: te
-    })), { HintSlot: m, hasHint: M, hasInvalid: ue } = Ve(e, s), ye = We(
-      V.PASSWORD,
+      stepDown: W,
+      clear: ue
+    })), { HintSlot: h, hasHint: U, hasInvalid: ce } = Be(e, s), $e = ft(
+      $.PASSWORD,
       e
-    ), He = We(
-      V.NUMBER,
+    ), dt = ft(
+      $.NUMBER,
       e
-    ), Ee = We(
-      V.SEARCH,
+    ), Me = ft(
+      $.SEARCH,
       e
     );
-    return (D, le) => (d(), y("div", {
-      class: Z(t(ae))
+    return (E, oe) => (f(), g("div", {
+      class: le(a(ae))
     }, [
-      t(p) ? (d(), y("label", {
+      a(v) ? (f(), g("label", {
         key: 0,
-        for: t(k),
+        for: a(k),
         class: "vv-input-text__label"
-      }, x(t(p)), 9, wa)) : w("", !0),
-      N("div", Ea, [
-        D.$slots.before ? (d(), y("div", Ia, [
-          $(D.$slots, "before", j(F(t(pe))))
+      }, T(a(v)), 9, Io)) : w("", !0),
+      x("div", Eo, [
+        E.$slots.before ? (f(), g("div", Po, [
+          V(E.$slots, "before", K(z(a(Ce))))
         ])) : w("", !0),
-        N("div", Pa, [
-          t(ie) ? (d(), W(Q, G({
+        x("div", Oo, [
+          a(ye) ? (f(), H(ee, R({
             key: 0,
             class: "vv-input-text__icon"
-          }, t(re)), null, 16)) : w("", !0),
-          Se(N("input", G({
-            id: t(k),
+          }, a(he)), null, 16)) : w("", !0),
+          Oe(x("input", R({
+            id: a(k),
             ref_key: "input",
-            ref: l,
-            "onUpdate:modelValue": le[0] || (le[0] = (we) => Ce(S) ? S.value = we : null)
-          }, t(me), {
-            onKeyup: le[1] || (le[1] = (we) => a("keyup", we))
-          }), null, 16, Oa), [
-            [Mt, t(S)]
+            ref: o,
+            "onUpdate:modelValue": oe[0] || (oe[0] = (Re) => Ee(m) ? m.value = Re : null)
+          }, a(Se), {
+            onKeyup: oe[1] || (oe[1] = (Re) => l("keyup", Re))
+          }), null, 16, Do), [
+            [_l, a(m)]
           ]),
-          t(C) || t(oe) ? (d(), W(Q, G({
+          a(ne) || a(de) ? (f(), H(ee, R({
             key: 1,
             class: "vv-input-text__icon vv-input-text__icon-after"
-          }, t(C) ? t(re) : t(oe)), null, 16)) : t(O) ? (d(), W(t(ye), {
+          }, a(ne) ? a(he) : a(de)), null, 16)) : a(L) ? (f(), H(a($e), {
             key: 2,
-            onTogglePassword: L
-          })) : t(ee) ? (d(), W(t(He), {
+            onTogglePassword: M
+          })) : a(se) ? (f(), H(a(dt), {
             key: 3,
             onStepUp: P,
-            onStepDown: T
-          })) : t(U) ? (d(), W(t(Ee), {
+            onStepDown: W
+          })) : a(F) ? (f(), H(a(Me), {
             key: 4,
-            onClear: te
+            onClear: ue
           })) : w("", !0)
         ]),
-        D.$slots.after ? (d(), y("div", Da, [
-          $(D.$slots, "after", j(F(t(pe))))
+        E.$slots.after ? (f(), g("div", Lo, [
+          V(E.$slots, "after", K(z(a(Ce))))
         ])) : w("", !0),
-        t(n) ? (d(), y("span", Ba, [
-          $(D.$slots, "count", j(F(t(pe))), () => [
-            X(x(t(fe)), 1)
+        a(r) ? (f(), g("span", Bo, [
+          V(E.$slots, "count", K(z(a(Ce))), () => [
+            Y(T(a(_e)), 1)
           ])
         ])) : w("", !0)
       ]),
-      de(t(m), {
-        id: t(A),
+      pe(a(h), {
+        id: a(A),
         class: "vv-input-text__hint"
       }, null, 8, ["id"])
     ], 2));
   }
-}), Ta = {
-  ...ce,
+}), No = {
+  ...me,
   /**
    * Progress value
    * This attribute specifies how much of the task that has been completed.
@@ -2954,155 +3295,155 @@ const wa = ["for"], Ea = { class: "vv-input-text__wrapper" }, Ia = {
     type: String,
     required: !0
   }
-}, Ma = {
+}, Ro = {
   name: "VvProgress"
-}, $l = /* @__PURE__ */ q({
-  ...Ma,
-  props: Ta,
-  setup(o) {
-    const a = o, { value: e, max: s, label: l } = toRefs(a), i = computed(() => a.value === void 0), { modifiers: u } = toRefs(a), c = useBemModifiers(
+}, As = /* @__PURE__ */ j({
+  ...Ro,
+  props: No,
+  setup(t) {
+    const l = t, { value: e, max: s, label: o } = G(l), u = n(() => l.value === void 0), { modifiers: d } = G(l), c = X(
       "vv-progress",
-      u,
-      computed(() => ({ indeterminate: i.value }))
+      d,
+      n(() => ({ indeterminate: u.value }))
     );
-    return (p, v) => (d(), y("progress", G({ role: "progressbar" }, {
-      class: t(c),
-      ariaLabel: t(l),
-      max: t(s),
-      value: t(e)
+    return (v, p) => (f(), g("progress", R({ role: "progressbar" }, {
+      class: a(c),
+      ariaLabel: a(o),
+      max: a(s),
+      value: a(e)
     }), null, 16));
   }
-}), xa = _t, Na = ["click", "update:modelValue", "change", "blur"];
-function La(o, a) {
-  const { id: e } = toRefs(o), { group: s, isInGroup: l, getGroupOrLocalRef: i } = useInjectedGroupState(ft), u = i("modelValue", o, a), c = i("readonly", o), p = i("disabled", o), v = i("valid", o), n = i("invalid", o);
+}), Ho = ol, xo = ["click", "update:modelValue", "change", "blur"];
+function Mo(t, l) {
+  const { id: e } = G(t), { group: s, isInGroup: o, getGroupOrLocalRef: u } = tt(Yt), d = u("modelValue", t, l), c = u("readonly", t), v = u("disabled", t), p = u("valid", t), r = u("invalid", t);
   return {
     // local props
     id: e,
     // global props
     group: s,
-    isInGroup: l,
-    modelValue: u,
+    isInGroup: o,
+    modelValue: d,
     readonly: c,
-    disabled: p,
-    valid: v,
-    invalid: n
+    disabled: v,
+    valid: p,
+    invalid: r
   };
 }
-const Ha = ["for"], Ga = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], Ua = {
+const Go = ["for"], jo = ["id", "name", "disabled", "value", "tabindex", "aria-invalid"], Wo = {
   name: "VvRadio"
-}, Wa = /* @__PURE__ */ q({
-  ...Ua,
-  props: xa,
-  emits: Na,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), { id: l, disabled: i, readonly: u, modelValue: c, valid: p, invalid: v } = La(e, a), n = useUniqueId(l), r = computed(() => g.value ? -1 : e.tabindex), f = ref(), g = computed(() => i.value || u.value), k = computed(() => {
-      if (v.value === !0)
-        return !0;
+}, Uo = /* @__PURE__ */ j({
+  ...Wo,
+  props: Ho,
+  emits: xo,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), { id: o, disabled: u, readonly: d, modelValue: c, valid: v, invalid: p } = Mo(e, l), r = Le(o), i = n(() => _.value ? -1 : e.tabindex), b = N(), _ = n(() => u.value || d.value), k = n(() => {
       if (p.value === !0)
+        return !0;
+      if (v.value === !0)
         return !1;
-    }), A = computed(
-      () => Array.isArray(c.value) ? contains(e.value, c.value) : equals(e.value, c.value)
-    ), b = computed(
+    }), A = n(
+      () => Array.isArray(c.value) ? we(e.value, c.value) : Pe(e.value, c.value)
+    ), y = n(
       () => ["string", "number", "boolean"].includes(typeof e.value) ? e.value : !0
-    ), S = computed({
+    ), m = n({
       get() {
-        return A.value ? b.value : null;
+        return A.value ? y.value : null;
       },
-      set(O) {
-        Array.isArray(c.value) ? c.value = [e.value] : c.value = e.value, a("change", O);
+      set(L) {
+        Array.isArray(c.value) ? c.value = [e.value] : c.value = e.value, l("change", L);
       }
-    }), { modifiers: I } = toRefs(e), B = useBemModifiers(
+    }), { modifiers: I } = G(e), O = X(
       "vv-radio",
       I,
-      computed(() => ({
-        valid: p.value,
-        invalid: v.value,
-        disabled: i.value,
-        readonly: u.value
+      n(() => ({
+        valid: v.value,
+        invalid: p.value,
+        disabled: u.value,
+        readonly: d.value
       }))
-    ), { HintSlot: E } = Ve(e, s);
-    return (O, L) => (d(), y("label", {
-      class: Z(t(B)),
-      for: t(n)
+    ), { HintSlot: D } = Be(e, s);
+    return (L, M) => (f(), g("label", {
+      class: le(a(O)),
+      for: a(r)
     }, [
-      Se(N("input", {
-        id: t(n),
+      Oe(x("input", {
+        id: a(r),
         ref_key: "input",
-        ref: f,
-        "onUpdate:modelValue": L[0] || (L[0] = (K) => Ce(S) ? S.value = K : null),
+        ref: b,
+        "onUpdate:modelValue": M[0] || (M[0] = (C) => Ee(m) ? m.value = C : null),
         type: "radio",
         class: "vv-radio__input",
-        name: O.name,
-        disabled: t(g),
-        value: t(b),
-        tabindex: t(r),
-        "aria-invalid": t(k)
-      }, null, 8, Ga), [
-        [xt, t(S)]
+        name: L.name,
+        disabled: a(_),
+        value: a(y),
+        tabindex: a(i),
+        "aria-invalid": a(k)
+      }, null, 8, jo), [
+        [Sl, a(m)]
       ]),
-      $(O.$slots, "default", { value: t(c) }, () => [
-        X(x(O.label), 1)
+      V(L.$slots, "default", { value: a(c) }, () => [
+        Y(T(L.label), 1)
       ]),
-      de(t(E), {
+      pe(a(D), {
         class: "vv-radio__hint",
-        params: { value: t(c) }
+        params: { value: a(c) }
       }, null, 8, ["params"])
-    ], 10, Ha));
+    ], 10, Go));
   }
-}), ja = St, Fa = ["update:modelValue", "change"], qa = ["textContent"], Ka = { class: "vv-radio-group__wrapper" }, za = {
+}), Fo = sl, Ko = ["update:modelValue", "change"], zo = ["textContent"], qo = { class: "vv-radio-group__wrapper" }, Yo = {
   name: "VvRadioGroup"
-}, kl = /* @__PURE__ */ q({
-  ...za,
-  props: ja,
-  emits: Fa,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), l = useVModel(e, "modelValue", a), { disabled: i, readonly: u, vertical: c, valid: p, invalid: v, modifiers: n } = toRefs(e);
-    useProvideGroupState({
-      key: ft,
-      modelValue: l,
-      disabled: i,
-      readonly: u,
-      valid: p,
-      invalid: v
+}, Cs = /* @__PURE__ */ j({
+  ...Yo,
+  props: Fo,
+  emits: Ko,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), o = et(e, "modelValue", l), { disabled: u, readonly: d, vertical: c, valid: v, invalid: p, modifiers: r } = G(e);
+    lt({
+      key: Yt,
+      modelValue: o,
+      disabled: u,
+      readonly: d,
+      valid: v,
+      invalid: p
     });
-    const { getOptionLabel: r, getOptionValue: f } = useOptions(e), g = useBemModifiers(
+    const { getOptionLabel: i, getOptionValue: b } = rt(e), _ = X(
       "vv-radio-group",
-      n,
-      computed(() => ({
-        disabled: i.value,
-        readonly: u.value,
+      r,
+      n(() => ({
+        disabled: u.value,
+        readonly: d.value,
         horizontal: !c.value,
-        valid: p.value,
-        invalid: v.value
+        valid: v.value,
+        invalid: p.value
       }))
-    ), k = (b, S) => ({
-      id: `${e.name}_opt${S}`,
+    ), k = (y, m) => ({
+      id: `${e.name}_opt${m}`,
       name: e.name,
-      label: r(b),
-      value: f(b)
-    }), { HintSlot: A } = Ve(e, s);
-    return (b, S) => (d(), y("fieldset", {
-      class: Z(t(g))
+      label: i(y),
+      value: b(y)
+    }), { HintSlot: A } = Be(e, s);
+    return (y, m) => (f(), g("fieldset", {
+      class: le(a(_))
     }, [
-      b.label ? (d(), y("legend", {
+      y.label ? (f(), g("legend", {
         key: 0,
-        textContent: x(b.label)
-      }, null, 8, qa)) : w("", !0),
-      N("div", Ka, [
-        b.options.length > 0 ? (d(!0), y(ne, { key: 0 }, ke(b.options, (I, B) => (d(), W(Wa, G({ key: B }, k(I, B)), null, 16))), 128)) : $(b.$slots, "default", { key: 1 })
+        textContent: T(y.label)
+      }, null, 8, zo)) : w("", !0),
+      x("div", qo, [
+        y.options.length > 0 ? (f(!0), g(ie, { key: 0 }, Ne(y.options, (I, O) => (f(), H(Uo, R({ key: O }, k(I, O)), null, 16))), 128)) : V(y.$slots, "default", { key: 1 })
       ]),
-      de(t(A), { class: "vv-radio-group__hint" })
+      pe(a(A), { class: "vv-radio-group__hint" })
     ], 2));
   }
-}), Ya = {
+}), Jo = {
   hard: "hard",
   soft: "soft"
-}, Ja = {
+}, Xo = {
   true: !0,
   false: !1,
   default: "default"
-}, Xa = ["update:modelValue", "focus", "blur", "keyup"], Qa = {
-  ...gt,
+}, Qo = ["update:modelValue", "focus", "blur", "keyup"], Zo = {
+  ...al,
   /**
    * Textarea value
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#value
@@ -3122,84 +3463,84 @@ const Ha = ["for"], Ga = ["id", "name", "disabled", "value", "tabindex", "aria-i
    * Indicates how the control should wrap the value for form submission.
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#wrap
    */
-  wrap: { type: String, default: Ya.soft },
+  wrap: { type: String, default: Jo.soft },
   /**
    * Specifies whether the <textarea> is subject to spell checking by the underlying browser/OS.
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#wrap
    */
-  spellcheck: { type: [Boolean, String], default: Ja.default },
+  spellcheck: { type: [Boolean, String], default: Xo.default },
   /**
    * If true, the textarea will be resizable
    */
   resizable: Boolean
-}, Za = ["for"], el = { class: "vv-textarea__wrapper" }, tl = {
+}, es = ["for"], ts = { class: "vv-textarea__wrapper" }, ls = {
   key: 0,
   class: "vv-textarea__input-before"
-}, ol = { class: "vv-textarea__inner" }, al = ["id"], ll = {
+}, as = { class: "vv-textarea__inner" }, os = ["id"], ss = {
   key: 1,
   class: "vv-textarea__input-after"
-}, sl = {
+}, ns = {
   key: 2,
   class: "vv-textarea__limit"
-}, nl = {
+}, rs = {
   name: "VvTextarea"
-}, Cl = /* @__PURE__ */ q({
-  ...nl,
-  props: Qa,
-  emits: Xa,
-  setup(o, { emit: a }) {
-    const e = o, s = useSlots(), l = ref(), {
-      id: i,
-      icon: u,
+}, ws = /* @__PURE__ */ j({
+  ...rs,
+  props: Zo,
+  emits: Qo,
+  setup(t, { emit: l }) {
+    const e = t, s = Ae(), o = N(), {
+      id: u,
+      icon: d,
       iconPosition: c,
-      label: p,
-      modelValue: v,
-      count: n,
-      valid: r,
-      invalid: f,
-      loading: g,
+      label: v,
+      modelValue: p,
+      count: r,
+      valid: i,
+      invalid: b,
+      loading: _,
       modifiers: k
-    } = toRefs(e), A = useUniqueId(i), b = computed(() => `${A.value}-hint`), S = computed(
-      () => e.floating && isEmpty(e.placeholder) ? " " : e.placeholder
-    ), I = useDebouncedInput(v, a, e.debounce), { hasIcon: B, hasIconBefore: E, hasIconAfter: O } = useComponentIcon(
-      u,
+    } = G(e), A = Le(u), y = n(() => `${A.value}-hint`), m = n(
+      () => e.floating && ge(e.placeholder) ? " " : e.placeholder
+    ), I = ul(p, l, e.debounce), { hasIcon: O, hasIconBefore: D, hasIconAfter: L } = ut(
+      d,
       c
-    ), { focused: L } = useComponentFocus(l, a), K = useElementVisibility(l);
-    watch(K, (z) => {
-      z && e.autofocus && (L.value = !0);
+    ), { focused: M } = it(o, l), C = $t(o);
+    ve(C, (J) => {
+      J && e.autofocus && (M.value = !0);
     });
-    const { formatted: ee } = useTextCount(I, {
+    const { formatted: se } = dl(I, {
       mode: e.count,
       upperLimit: e.maxlength,
       lowerLimit: e.minlength
-    }), P = computed(() => !e.disabled && !e.readonly), T = computed(
+    }), P = n(() => !e.disabled && !e.readonly), W = n(
       () => P.value ? e.tabindex : -1
-    ), U = computed(() => !isEmpty(v)), te = computed(() => {
+    ), F = n(() => !ge(p)), ue = n(() => {
       if (e.invalid === !0)
         return !0;
       if (e.valid === !0)
         return !1;
-    }), { HintSlot: re, hasHint: ie, hasInvalid: C } = Ve(e, s), oe = useBemModifiers(
+    }), { HintSlot: he, hasHint: ye, hasInvalid: ne } = Be(e, s), de = X(
       "vv-textarea",
       k,
-      computed(() => ({
-        valid: r.value,
-        invalid: f.value,
-        loading: g.value,
+      n(() => ({
+        valid: i.value,
+        invalid: b.value,
+        loading: _.value,
         disabled: e.disabled,
         readonly: e.readonly,
-        "icon-before": E.value,
-        "icon-after": O.value,
-        floating: e.floating && !isEmpty(e.label),
-        dirty: U.value,
-        focused: L.value,
+        "icon-before": D.value,
+        "icon-after": L.value,
+        floating: e.floating && !ge(e.label),
+        dirty: F.value,
+        focused: M.value,
         resizable: e.resizable
       }))
-    ), fe = computed(
+    ), _e = n(
       () => ({
         name: e.name,
-        placeholder: S.value,
-        tabindex: T.value,
+        placeholder: m.value,
+        tabindex: W.value,
         disabled: e.disabled,
         readonly: e.readonly,
         required: e.required,
@@ -3210,88 +3551,88 @@ const Ha = ["for"], Ga = ["id", "name", "disabled", "value", "tabindex", "aria-i
         rows: e.rows,
         wrap: e.wrap,
         spellcheck: e.spellcheck,
-        "aria-invalid": te.value,
-        "aria-describedby": !C.value && ie.value ? b.value : void 0,
-        "aria-errormessage": C.value ? b.value : void 0
+        "aria-invalid": ue.value,
+        "aria-describedby": !ne.value && ye.value ? y.value : void 0,
+        "aria-errormessage": ne.value ? y.value : void 0
       })
-    ), se = computed(() => ({
+    ), re = n(() => ({
       valid: e.valid,
       invalid: e.invalid,
       modelValue: e.modelValue,
       hintLabel: e.hintLabel,
       maxlength: e.maxlength,
       minlength: e.minlength,
-      clear: he
-    })), he = () => {
+      clear: Ve
+    })), Ve = () => {
       I.value = void 0;
     };
-    return (z, R) => (d(), y("div", {
-      class: Z(t(oe))
+    return (J, B) => (f(), g("div", {
+      class: le(a(de))
     }, [
-      t(p) ? (d(), y("label", {
+      a(v) ? (f(), g("label", {
         key: 0,
-        for: t(A),
+        for: a(A),
         class: "vv-textarea__label"
-      }, x(t(p)), 9, Za)) : w("", !0),
-      N("div", el, [
-        z.$slots.before ? (d(), y("div", tl, [
-          $(z.$slots, "before", j(F(t(se))))
+      }, T(a(v)), 9, es)) : w("", !0),
+      x("div", ts, [
+        J.$slots.before ? (f(), g("div", ls, [
+          V(J.$slots, "before", K(z(a(re))))
         ])) : w("", !0),
-        N("div", ol, [
-          t(E) ? (d(), W(Q, G({
+        x("div", as, [
+          a(D) ? (f(), H(ee, R({
             key: 0,
             class: "vv-textarea__icon"
-          }, t(B)), null, 16)) : w("", !0),
-          Se(N("textarea", G({
-            id: t(A),
+          }, a(O)), null, 16)) : w("", !0),
+          Oe(x("textarea", R({
+            id: a(A),
             ref_key: "textarea",
-            ref: l,
-            "onUpdate:modelValue": R[0] || (R[0] = (Y) => Ce(I) ? I.value = Y : null)
-          }, t(fe), {
-            onKeyup: R[1] || (R[1] = (Y) => a("keyup", Y))
-          }), null, 16, al), [
-            [ct, t(I)]
+            ref: o,
+            "onUpdate:modelValue": B[0] || (B[0] = (Q) => Ee(I) ? I.value = Q : null)
+          }, a(_e), {
+            onKeyup: B[1] || (B[1] = (Q) => l("keyup", Q))
+          }), null, 16, os), [
+            [Mt, a(I)]
           ]),
-          t(O) ? (d(), W(Q, G({
+          a(L) ? (f(), H(ee, R({
             key: 1,
             class: "vv-textarea__icon vv-textarea__icon-after"
-          }, t(B)), null, 16)) : w("", !0)
+          }, a(O)), null, 16)) : w("", !0)
         ]),
-        z.$slots.after ? (d(), y("div", ll, [
-          $(z.$slots, "after", j(F(t(se))))
+        J.$slots.after ? (f(), g("div", ss, [
+          V(J.$slots, "after", K(z(a(re))))
         ])) : w("", !0),
-        t(n) ? (d(), y("span", sl, [
-          $(z.$slots, "count", j(F(t(se))), () => [
-            X(x(t(ee)), 1)
+        a(r) ? (f(), g("span", ns, [
+          V(J.$slots, "count", K(z(a(re))), () => [
+            Y(T(a(se)), 1)
           ])
         ])) : w("", !0)
       ]),
-      de(t(re), {
-        id: t(b),
+      pe(a(he), {
+        id: a(y),
         class: "vv-textarea__hint"
       }, null, 8, ["id"])
     ], 2));
   }
 });
 export {
-  pl as VolverPlugin,
-  lo as VvAccordion,
-  fl as VvAccordionGroup,
-  co as VvBadge,
-  ml as VvBreadcrumb,
-  bl as VvButton,
-  hl as VvButtonGroup,
-  yl as VvCard,
-  Lo as VvCheckbox,
-  gl as VvCheckboxGroup,
-  _l as VvCombobox,
-  Sl as VvDialog,
-  kt as VvDropdown,
-  Q as VvIcon,
-  Vl as VvInputText,
-  $l as VvProgress,
-  Wa as VvRadio,
-  kl as VvRadioGroup,
-  ia as VvSelect,
-  Cl as VvTextarea
+  ms as VolverPlugin,
+  jl as VvAccordion,
+  bs as VvAccordionGroup,
+  ea as VvBadge,
+  hs as VvBreadcrumb,
+  ys as VvButton,
+  gs as VvButtonGroup,
+  _s as VvCard,
+  Ba as VvCheckbox,
+  Ss as VvCheckboxGroup,
+  Vs as VvCombobox,
+  $s as VvDialog,
+  il as VvDropdown,
+  ee as VvIcon,
+  ks as VvInputText,
+  As as VvProgress,
+  Uo as VvRadio,
+  Cs as VvRadioGroup,
+  uo as VvSelect,
+  ws as VvTextarea
 };