@codemonster-ru/vueforge 0.6.0 → 0.8.0

package/dist/index.ts.mjs

@@ -1,7 +1,7 @@
-import { defineComponent as X, ref as N, computed as w, watch as le, resolveComponent as be, openBlock as g, createElementBlock as h, normalizeClass as C, renderSlot as k, Fragment as oe, createTextVNode as J, toDisplayString as M, createBlock as W, withCtx as I, createCommentVNode as _, createElementVNode as B, renderList as ge, withKeys as K, withModifiers as G, unref as U, createVNode as he, nextTick as de, onMounted as Re, onBeforeUnmount as Se, Teleport as Le, withDirectives as me, vShow as ye, reactive as Ve, createSlots as ze } from "vue";
+import { defineComponent as K, ref as X, computed as w, watch as le, resolveComponent as be, openBlock as b, createElementBlock as m, normalizeClass as C, renderSlot as k, Fragment as oe, createTextVNode as ee, toDisplayString as H, createBlock as M, withCtx as Y, createCommentVNode as _, createElementVNode as B, renderList as he, withKeys as q, withModifiers as U, unref as J, createVNode as me, nextTick as ue, onMounted as Te, onBeforeUnmount as Re, Teleport as Se, withDirectives as ye, vShow as ke, reactive as Ve, createSlots as Le } from "vue";
 import { useRoute as We, useRouter as Me } from "vue-router";
-import { CmIcon as Z } from "@codemonster-ru/vueiconify";
-const He = ["href", "aria-disabled", "tabindex"], ke = /* @__PURE__ */ X({
+import { CmIcon as Q } from "@codemonster-ru/vueiconify";
+const He = ["href", "aria-disabled", "tabindex"], Ce = /* @__PURE__ */ K({
   __name: "link",
   props: {
     to: { default: void 0 },
@@ -15,12 +15,12 @@ const He = ["href", "aria-disabled", "tabindex"], ke = /* @__PURE__ */ X({
   },
   emits: ["click", "active", "update:active", "onActive"],
   setup(t, { emit: e }) {
-    const r = e, o = t, n = We(), c = Me(), s = N(null), i = w(() => o.href ?? o.url), l = w(() => o.as ? o.as === "router-link" && !o.to ? "a" : o.as : o.type === "router-link" || o.type === "a" ? o.type === "router-link" && !o.to ? "a" : o.type : o.to ? "router-link" : "a"), u = w(() => o.to), d = w(() => o.to ? c.resolve(o.to) : null), a = w(() => {
+    const r = e, o = t, n = We(), c = Me(), s = X(null), i = w(() => o.href ?? o.url), l = w(() => o.as ? o.as === "router-link" && !o.to ? "a" : o.as : o.type === "router-link" || o.type === "a" ? o.type === "router-link" && !o.to ? "a" : o.type : o.to ? "router-link" : "a"), u = w(() => o.to), d = w(() => o.to ? c.resolve(o.to) : null), a = w(() => {
       if (l.value !== "router-link")
         return !1;
       const p = d.value;
       return p ? p.name ? n.matched.some(({ name: y }) => y === p.name) : p.fullPath ? n.fullPath === p.fullPath : n.path === p.path : !1;
-    }), v = w(() => o.active === void 0 ? a.value : o.active), f = (p) => {
+    }), f = w(() => o.active === void 0 ? a.value : o.active), v = (p) => {
       if (!o.disabled) {
         r("click", p);
         return;
@@ -30,33 +30,33 @@ const He = ["href", "aria-disabled", "tabindex"], ke = /* @__PURE__ */ X({
     return le(a, (p) => {
       p && (r("active"), r("onActive")), r("update:active", p);
     }), (p, y) => {
-      const m = be("router-link");
-      return l.value === "a" ? (g(), h("a", {
+      const h = be("router-link");
+      return l.value === "a" ? (b(), m("a", {
         key: 0,
         href: i.value,
-        class: C(["vf-link", { "vf-link_active": v.value, "vf-link_disabled": p.disabled }]),
+        class: C(["vf-link", { "vf-link_active": f.value, "vf-link_disabled": p.disabled }]),
         "aria-disabled": p.disabled,
         tabindex: p.disabled ? -1 : void 0,
-        onClick: f
+        onClick: v
       }, [
-        p.$slots.default ? k(p.$slots, "default", { key: 0 }) : (g(), h(oe, { key: 1 }, [
-          J(M(p.label), 1)
+        p.$slots.default ? k(p.$slots, "default", { key: 0 }) : (b(), m(oe, { key: 1 }, [
+          ee(H(p.label), 1)
         ], 64))
-      ], 10, He)) : (g(), W(m, {
+      ], 10, He)) : (b(), M(h, {
         key: 1,
         ref_key: "link",
         ref: s,
         to: u.value,
-        class: C(["vf-link", { "vf-link_active": v.value }]),
+        class: C(["vf-link", { "vf-link_active": f.value }]),
         "aria-disabled": p.disabled,
         tabindex: p.disabled ? -1 : void 0,
         "active-class": "vf-link_partially-active",
         "exact-active-class": "vf-link_active",
-        onClick: f
+        onClick: v
       }, {
-        default: I(() => [
-          p.$slots.default ? k(p.$slots, "default", { key: 0 }) : (g(), h(oe, { key: 1 }, [
-            J(M(p.label), 1)
+        default: Y(() => [
+          p.$slots.default ? k(p.$slots, "default", { key: 0 }) : (b(), m(oe, { key: 1 }, [
+            ee(H(p.label), 1)
           ], 64))
         ]),
         _: 3
@@ -74,37 +74,37 @@ const He = ["href", "aria-disabled", "tabindex"], ke = /* @__PURE__ */ X({
 }, De = {
   key: 1,
   class: "vf-card__header"
-}, Ne = {
+}, je = {
   key: 2,
   class: "vf-card__body"
-}, Ie = {
+}, Ne = {
   key: 3,
   class: "vf-card__footer"
 };
-function je(t, e) {
-  return g(), h("div", Pe, [
-    t.$slots.default ? (g(), h("div", Ae, [
+function Xe(t, e) {
+  return b(), m("div", Pe, [
+    t.$slots.default ? (b(), m("div", Ae, [
       k(t.$slots, "default")
     ])) : _("", !0),
-    t.$slots.header ? (g(), h("div", De, [
+    t.$slots.header ? (b(), m("div", De, [
       k(t.$slots, "header")
     ])) : _("", !0),
-    t.$slots.body ? (g(), h("div", Ne, [
+    t.$slots.body ? (b(), m("div", je, [
       k(t.$slots, "body")
     ])) : _("", !0),
-    t.$slots.footer ? (g(), h("div", Ie, [
+    t.$slots.footer ? (b(), m("div", Ne, [
       k(t.$slots, "footer")
     ])) : _("", !0)
   ]);
 }
-const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
+const Ye = /* @__PURE__ */ Oe(Ee, [["render", Xe]]), Ie = {
   class: "vf-menu__list",
   role: "menu"
 }, Ke = {
   key: 1,
   class: "vf-menu__separator",
   role: "separator"
-}, Ge = ["aria-expanded", "onClick", "onKeydown"], io = /* @__PURE__ */ X({
+}, Ge = ["aria-expanded", "onClick", "onKeydown"], co = /* @__PURE__ */ K({
   name: "VfMenu",
   __name: "menu",
   props: {
@@ -113,7 +113,7 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
   },
   emits: ["active", "onActive"],
   setup(t, { emit: e }) {
-    const r = e, o = t, n = N([]), c = (d, a) => `${d.label ?? d.to ?? d.href ?? d.url ?? "item"}_${a.toString()}`, s = (d) => d.to ? "router-link" : "a", i = (d) => d.map((a) => ({
+    const r = e, o = t, n = X([]), c = (d, a) => `${d.label ?? d.to ?? d.href ?? d.url ?? "item"}_${a.toString()}`, s = (d) => d.to ? "router-link" : "a", i = (d) => d.map((a) => ({
       ...a,
       items: a.items ? i(a.items) : void 0
     })), l = (d) => {
@@ -122,9 +122,9 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
       }), d.subMenuVisible = !d.subMenuVisible) : Object.prototype.hasOwnProperty.call(d, "command") && typeof d.command == "function" && d.command();
     }, u = (d) => {
       var a;
-      for (const v in n.value) {
-        const f = n.value[v];
-        Object.prototype.hasOwnProperty.call(f, "items") && ((a = f.items) != null && a.some((p) => p === d) ? (f.active = !0, f.subMenuVisible = !0) : (f.active = !1, f.subMenuVisible = !1));
+      for (const f in n.value) {
+        const v = n.value[f];
+        Object.prototype.hasOwnProperty.call(v, "items") && ((a = v.items) != null && a.some((p) => p === d) ? (v.active = !0, v.subMenuVisible = !0) : (v.active = !1, v.subMenuVisible = !1));
       }
       r("active", d), r("onActive", d);
     };
@@ -135,65 +135,65 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
       },
       { deep: !0, immediate: !0 }
     ), (d, a) => {
-      const v = be("VfMenu");
-      return g(), h("div", {
+      const f = be("VfMenu");
+      return b(), m("div", {
         class: C(["vf-menu", `vf-menu_${d.orientation}`])
       }, [
-        B("ul", Ye, [
-          (g(!0), h(oe, null, ge(n.value, (f, p) => (g(), h("li", {
-            key: c(f, p),
+        B("ul", Ie, [
+          (b(!0), m(oe, null, he(n.value, (v, p) => (b(), m("li", {
+            key: c(v, p),
             class: "vf-menu__item",
             role: "none"
           }, [
-            d.$slots[c(f, p)] ? k(d.$slots, c(f, p), {
+            d.$slots[c(v, p)] ? k(d.$slots, c(v, p), {
               key: 0,
-              item: { ...f, class: "vf-menu__link" }
-            }) : f.separator ? (g(), h("hr", Ke)) : f.items && f.items.length ? (g(), h(oe, { key: 2 }, [
+              item: { ...v, class: "vf-menu__link" }
+            }) : v.separator ? (b(), m("hr", Ke)) : v.items && v.items.length ? (b(), m(oe, { key: 2 }, [
               B("div", {
-                class: C(["vf-menu__parent", { "vf-menu__parent_active": f.active }]),
+                class: C(["vf-menu__parent", { "vf-menu__parent_active": v.active }]),
                 role: "menuitem",
                 tabindex: "0",
-                "aria-expanded": f.subMenuVisible ? "true" : "false",
-                onClick: (y) => l(f),
+                "aria-expanded": v.subMenuVisible ? "true" : "false",
+                onClick: (y) => l(v),
                 onKeydown: [
-                  K(G((y) => l(f), ["prevent"]), ["enter"]),
-                  K(G((y) => l(f), ["prevent"]), ["space"])
+                  q(U((y) => l(v), ["prevent"]), ["enter"]),
+                  q(U((y) => l(v), ["prevent"]), ["space"])
                 ]
               }, [
-                f.icon ? (g(), W(U(Z), {
+                v.icon ? (b(), M(J(Q), {
                   key: 0,
-                  icon: f.icon,
+                  icon: v.icon,
                   class: "vf-menu__icon"
                 }, null, 8, ["icon"])) : _("", !0),
-                J(" " + M(f.label) + " ", 1),
-                he(U(Z), { icon: "chevronDown" })
+                ee(" " + H(v.label) + " ", 1),
+                me(J(Q), { icon: "chevronDown" })
               ], 42, Ge),
-              f.items ? (g(), W(v, {
+              v.items ? (b(), M(f, {
                 key: 0,
-                items: f.items,
-                class: C(["vf-menu__submenu", { "vf-menu__submenu_visible": f.subMenuVisible }]),
+                items: v.items,
+                class: C(["vf-menu__submenu", { "vf-menu__submenu_visible": v.subMenuVisible }]),
                 onOnActive: u
               }, null, 8, ["items", "class"])) : _("", !0)
-            ], 64)) : (g(), W(ke, {
+            ], 64)) : (b(), M(Ce, {
               key: 3,
-              to: f.to,
-              href: f.href ?? f.url,
-              as: s(f),
+              to: v.to,
+              href: v.href ?? v.url,
+              as: s(v),
               class: "vf-menu__link",
-              active: f.active,
-              disabled: f.disabled,
+              active: v.active,
+              disabled: v.disabled,
               role: "menuitem",
-              "aria-disabled": f.disabled ? "true" : "false",
-              onClick: (y) => l(f),
-              onActive: (y) => u(f)
+              "aria-disabled": v.disabled ? "true" : "false",
+              onClick: (y) => l(v),
+              onActive: (y) => u(v)
             }, {
-              default: I(() => [
-                f.icon ? (g(), W(U(Z), {
+              default: Y(() => [
+                v.icon ? (b(), M(J(Q), {
                   key: 0,
-                  icon: f.icon,
+                  icon: v.icon,
                   class: "vf-menu__icon"
                 }, null, 8, ["icon"])) : _("", !0),
-                J(" " + M(f.label), 1)
+                ee(" " + H(v.label), 1)
               ]),
               _: 2
             }, 1032, ["to", "href", "as", "active", "disabled", "aria-disabled", "onClick", "onActive"]))
@@ -202,7 +202,7 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
       ], 2);
     };
   }
-}), qe = ["type", "disabled"], co = /* @__PURE__ */ X({
+}), qe = ["type", "disabled"], uo = /* @__PURE__ */ K({
   __name: "button",
   props: {
     to: { default: void 0 },
@@ -225,33 +225,33 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
       let d = ["vf-button", `vf-button_${e.severity}`];
       return ["top", "bottom"].includes(e.iconPos) && d.push("vf-button_vertical"), e.variant === "text" && d.push("vf-button_text"), e.variant === "outlined" && d.push("vf-button_outlined"), ["small", "large"].indexOf(e.size) > -1 && d.push(`vf-button_${e.size}`), (e.loading || e.disabled) && d.push("vf-button_disabled"), e.rounded && d.push("vf-button_rounded"), d;
     }), l = w(() => ["vf-button__icon", `vf-button__icon_${e.iconPos}`]), u = w(() => ["vf-button__label"]);
-    return (d, a) => n.value ? (g(), h("button", {
+    return (d, a) => n.value ? (b(), m("button", {
       key: 0,
       type: c.value,
       class: C(i.value),
       disabled: e.loading || e.disabled
     }, [
-      e.icon && !e.loading ? (g(), W(U(Z), {
+      e.icon && !e.loading ? (b(), M(J(Q), {
         key: 0,
         icon: e.icon,
         class: C(l.value)
       }, null, 8, ["icon", "class"])) : _("", !0),
-      e.loading ? (g(), W(U(Z), {
+      e.loading ? (b(), M(J(Q), {
         key: 1,
         icon: "circleNotch",
         class: C(l.value),
         spin: ""
       }, null, 8, ["class"])) : _("", !0),
-      d.$slots.default ? (g(), h("span", {
+      d.$slots.default ? (b(), m("span", {
         key: 2,
         class: C(u.value)
       }, [
         k(d.$slots, "default")
-      ], 2)) : d.label ? (g(), h("span", {
+      ], 2)) : d.label ? (b(), m("span", {
         key: 3,
         class: C(u.value)
-      }, M(d.label), 3)) : _("", !0)
-    ], 10, qe)) : (g(), W(ke, {
+      }, H(d.label), 3)) : _("", !0)
+    ], 10, qe)) : (b(), M(Ce, {
       key: 1,
       to: e.to,
       href: e.href ?? e.url,
@@ -259,21 +259,21 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
       class: C(i.value),
       disabled: e.loading || e.disabled
     }, {
-      default: I(() => [
-        e.icon ? (g(), W(U(Z), {
+      default: Y(() => [
+        e.icon ? (b(), M(J(Q), {
           key: 0,
           icon: e.icon,
           class: C(l.value)
         }, null, 8, ["icon", "class"])) : _("", !0),
-        d.$slots.default ? (g(), h("span", {
+        d.$slots.default ? (b(), m("span", {
           key: 1,
           class: C(u.value)
         }, [
           k(d.$slots, "default")
-        ], 2)) : d.label ? (g(), h("span", {
+        ], 2)) : d.label ? (b(), m("span", {
           key: 2,
           class: C(u.value)
-        }, M(d.label), 3)) : _("", !0)
+        }, H(d.label), 3)) : _("", !0)
       ]),
       _: 3
     }, 8, ["to", "href", "as", "class", "disabled"]));
@@ -284,7 +284,7 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
 }, Ze = ["type", "value", "placeholder", "disabled", "readonly"], Je = {
   key: 1,
   class: "vf-input__suffix"
-}, uo = /* @__PURE__ */ X({
+}, fo = /* @__PURE__ */ K({
   __name: "input",
   props: {
     modelValue: { default: "" },
@@ -304,10 +304,10 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
       const d = u.target;
       r("update:modelValue", d.value), r("input", u);
     }, s = (u) => r("change", u), i = (u) => r("focus", u), l = (u) => r("blur", u);
-    return (u, d) => (g(), h("div", {
+    return (u, d) => (b(), m("div", {
       class: C(n.value)
     }, [
-      u.$slots.prefix ? (g(), h("span", Ue, [
+      u.$slots.prefix ? (b(), m("span", Ue, [
         k(u.$slots, "prefix")
       ])) : _("", !0),
       B("input", {
@@ -322,12 +322,12 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
         onFocus: i,
         onBlur: l
       }, null, 40, Ze),
-      u.$slots.suffix ? (g(), h("span", Je, [
+      u.$slots.suffix ? (b(), m("span", Je, [
         k(u.$slots, "suffix")
       ])) : _("", !0)
     ], 2));
   }
-}), ue = [
+}), fe = [
   "top",
   "top-start",
   "top-end",
@@ -340,7 +340,7 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
   "left",
   "left-start",
   "left-end"
-], P = (t) => {
+], A = (t) => {
   if (t == null || !(t instanceof HTMLElement))
     return null;
   if (typeof window < "u") {
@@ -348,13 +348,13 @@ const Xe = /* @__PURE__ */ Oe(Ee, [["render", je]]), Ye = {
     if (/(auto|scroll|overlay)/.test(r))
       return t;
   }
-  return t.scrollHeight > t.clientHeight || t.scrollWidth > t.clientWidth ? t : P(t.parentNode);
+  return t.scrollHeight > t.clientHeight || t.scrollWidth > t.clientWidth ? t : A(t.parentNode);
 };
 function Qe(t) {
   return typeof window > "u" ? !1 : window.getComputedStyle(t).position === "fixed";
 }
-const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y = (t, e) => et(t, e) === "fixed", R = (t, e, r = {}) => {
-  const o = t.getBoundingClientRect(), n = e ? e.offsetParent : null, c = e ? Y(r, e) : !1;
+const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", G = (t, e) => et(t, e) === "fixed", T = (t, e, r = {}) => {
+  const o = t.getBoundingClientRect(), n = e ? e.offsetParent : null, c = e ? G(r, e) : !1;
   if (n && !c) {
     const s = n.getBoundingClientRect(), i = n.scrollLeft, l = n.scrollTop;
     return {
@@ -370,52 +370,52 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
     width: o.width,
     height: o.height
   };
-}, j = (t, e) => {
+}, I = (t, e) => {
   var r;
   return (r = t.middleware) == null ? void 0 : r.find((o) => o.name === e);
-}, Ce = (t, e) => !!j(t, e), tt = (t) => {
-  const e = P(t);
+}, we = (t, e) => !!I(t, e), tt = (t) => {
+  const e = A(t);
   let r = "";
   return e !== null && ((e.dataset.scrollTop === void 0 || e.scrollTop === +e.dataset.scrollTop) && (e.dataset.scrollTop = "0"), (e.dataset.scrollLeft === void 0 || e.scrollLeft === +e.dataset.scrollLeft) && (e.dataset.scrollLeft = "0"), e.scrollTop > +e.dataset.scrollTop ? r = "bottom" : e.scrollTop < +e.dataset.scrollTop ? r = "top" : e.scrollLeft > +e.dataset.scrollLeft ? r = "right" : e.scrollLeft < +e.dataset.scrollLeft && (r = "left"), e.dataset.scrollTop = e.scrollTop <= 0 ? "0" : e.scrollTop.toString(), e.dataset.scrollLeft = e.scrollLeft <= 0 ? "0" : e.scrollLeft.toString()), r;
-}, ot = (t) => t.scrollLeft + t.clientWidth, rt = (t) => t.scrollTop + t.clientHeight, L = (t, e, r = null, o = {}, n) => {
-  if (r === null && typeof window < "u" && Y(o, e))
+}, ot = (t) => t.scrollLeft + t.clientWidth, rt = (t) => t.scrollTop + t.clientHeight, V = (t, e, r = null, o = {}, n) => {
+  if (r === null && typeof window < "u" && G(o, e))
     return t;
   let c = 0;
   if (r === null) {
-    const s = P(e);
+    const s = A(e);
     c = s ? s.scrollTop : 0;
   }
   return t - c;
-}, V = (t, e, r = null, o = {}, n) => {
+}, L = (t, e, r = null, o = {}, n) => {
   let c;
-  if (r === null && typeof window < "u" && Y(o, e))
+  if (r === null && typeof window < "u" && G(o, e))
     c = window.innerWidth;
   else if (r === null) {
-    const s = P(e);
+    const s = A(e);
     c = s ? ot(s) : 0;
   } else
     c = r.getBoundingClientRect().width;
   return -(t + e.clientWidth - c);
-}, O = (t, e, r = null, o = {}, n) => {
+}, E = (t, e, r = null, o = {}, n) => {
   let c;
-  if (r === null && typeof window < "u" && Y(o, e))
+  if (r === null && typeof window < "u" && G(o, e))
     c = window.innerHeight;
   else if (r === null) {
-    const s = P(e);
+    const s = A(e);
     c = s ? rt(s) : 0;
   } else
     c = r.getBoundingClientRect().height;
   return -(t + e.clientHeight - c);
-}, z = (t, e, r = null, o = {}, n) => {
-  if (r === null && typeof window < "u" && Y(o, e))
+}, W = (t, e, r = null, o = {}, n) => {
+  if (r === null && typeof window < "u" && G(o, e))
     return t;
   let c = 0;
   if (r === null) {
-    const s = P(e);
+    const s = A(e);
     c = s ? s.scrollLeft : 0;
   }
   return t - c;
-}, fe = ({
+}, ve = ({
   options: t,
   primaryX: e,
   primaryY: r,
@@ -424,7 +424,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
   reference: c,
   scrollDirection: s
 }) => {
-  const i = ae(c, o, n, t), l = j(t, "offset");
+  const i = ae(c, o, n, t), l = I(t, "offset");
   if (l) {
     const u = l.fn({
       x: i.x,
@@ -463,16 +463,16 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       x: e,
       y: r,
       placement: i
-    }, v = {
+    }, f = {
       ...o,
       middleware: (d = o.middleware) == null ? void 0 : d.filter((x) => x.name !== "shift")
-    }, f = (t == null ? void 0 : t.placements) ?? ue, p = !(t != null && t.placements), y = p ? ue : f;
-    let m = !1;
-    const Q = (x) => {
-      if (m)
+    }, v = (t == null ? void 0 : t.placements) ?? fe, p = !(t != null && t.placements), y = p ? fe : v;
+    let h = !1;
+    const R = (x) => {
+      if (h)
         return;
-      const $ = fe({
-        options: v,
+      const F = ve({
+        options: f,
         primaryX: n,
         primaryY: c,
         floating: s,
@@ -480,50 +480,50 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
         reference: l,
         scrollDirection: u
       });
-      $ && (a.x = $.x, a.y = $.y, a.placement = $.placement, m = !0);
-    }, ee = $t(l, s, v);
-    if (!p && f.includes(i) && Q(i), m || y.forEach(Q), !m) {
-      const x = f.reduce(
-        ($, H) => {
-          const A = fe({
-            options: v,
+      F && (a.x = F.x, a.y = F.y, a.placement = F.placement, h = !0);
+    }, D = Ft(l, s, f);
+    if (!p && v.includes(i) && R(i), h || y.forEach(R), !h) {
+      const x = v.reduce(
+        (F, O) => {
+          const j = ve({
+            options: f,
             primaryX: n,
             primaryY: c,
             floating: s,
-            placement: H,
+            placement: O,
             reference: l,
             scrollDirection: u
           });
-          if (!A)
-            return $;
-          const S = te(H), D = ee[S];
-          return !$ || D > $.space ? { result: A, space: D } : $;
+          if (!j)
+            return F;
+          const S = te(O), N = D[S];
+          return !F || N > F.space ? { result: j, space: N } : F;
         },
         null
       );
-      x && (a.x = x.result.x, a.y = x.result.y, a.placement = x.result.placement, m = !0);
+      x && (a.x = x.result.x, a.y = x.result.y, a.placement = x.result.placement, h = !0);
     }
-    if (!m && f.length > 0) {
+    if (!h && v.length > 0) {
       const x = te(i);
-      let $ = x, H = ee[x];
-      f.forEach((q) => {
-        const b = te(q), F = ee[b];
-        F > H && (H = F, $ = b);
+      let F = x, O = D[x];
+      v.forEach((Z) => {
+        const g = te(Z), $ = D[g];
+        $ > O && (O = $, F = g);
       });
-      const A = Ft($, i, f), S = ae(l, s, A, v), D = j(v, "offset");
-      if (D) {
-        const q = D.fn({
+      const j = $t(F, i, v), S = ae(l, s, j, f), N = I(f, "offset");
+      if (N) {
+        const Z = N.fn({
           x: S.x,
           y: S.y,
-          options: v,
+          options: f,
           primaryX: n,
           primaryY: c,
           floating: s,
-          placement: A,
+          placement: j,
           reference: l,
           scrollDirection: u
         });
-        S.x = q.x, S.y = q.y;
+        S.x = Z.x, S.y = Z.y;
       }
       a.x = S.x, a.y = S.y, a.placement = S.placement;
     }
@@ -533,32 +533,32 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
   var c, s, i;
   let l = 0;
   o.startsWith("right") ? l = -2 : o.startsWith("left") && (l = t);
-  const u = j(e, "arrow"), d = j(e, "shift");
+  const u = I(e, "arrow"), d = I(e, "shift");
   if (u) {
     const a = ((c = u.params) == null ? void 0 : c.arrow).getBoundingClientRect();
     o.startsWith("right") ? l -= a.width / 2 : o.startsWith("left") && (l += a.width / 2);
   }
-  if (Ce(e, "shift") && u) {
-    let a = null, v = 0;
+  if (we(e, "shift") && u) {
+    let a = null, f = 0;
     d && (a = (s = d.params) == null ? void 0 : s.parent);
-    const f = (i = u.params) == null ? void 0 : i.arrow;
-    v = f.getBoundingClientRect().width / 2, v += it(f), v -= t, o.startsWith("right") ? V(r - l, n, a, e) <= t ? V(r, n, a, e) > 0 ? l = t - V(r, n, a, e) : l = t : z(r - l - v, n, a, e) <= t && (z(r - l - v, n, a, e) >= 0 ? (l = -2 - (z(r - l - v, n, a, e) + t), a && (l = -2)) : l = -2) : o.startsWith("left") ? V(r - l + v, n, a, e) <= t ? (l = t + V(r - v, n, a, e), l <= t && (l = t)) : z(r - l, n, a, e) <= t && (l = -2 + z(r, n, a, e), l <= -2 && (l = -2)) : V(r - l, n, a, e) <= t ? V(r - l, n, a, e) <= t && V(r, n, a, e) > 0 ? l = t - V(r, n, a, e) : l = t : z(r - l, n, a, e) <= t && (z(r - l, n, a, e) <= t && z(r, n, a, e) > 0 ? l = -(t - z(r, n, a, e)) : l = -2);
+    const v = (i = u.params) == null ? void 0 : i.arrow;
+    f = v.getBoundingClientRect().width / 2, f += it(v), f -= t, o.startsWith("right") ? L(r - l, n, a, e) <= t ? L(r, n, a, e) > 0 ? l = t - L(r, n, a, e) : l = t : W(r - l - f, n, a, e) <= t && (W(r - l - f, n, a, e) >= 0 ? (l = -2 - (W(r - l - f, n, a, e) + t), a && (l = -2)) : l = -2) : o.startsWith("left") ? L(r - l + f, n, a, e) <= t ? (l = t + L(r - f, n, a, e), l <= t && (l = t)) : W(r - l, n, a, e) <= t && (l = -2 + W(r, n, a, e), l <= -2 && (l = -2)) : L(r - l, n, a, e) <= t ? L(r - l, n, a, e) <= t && L(r, n, a, e) > 0 ? l = t - L(r, n, a, e) : l = t : W(r - l, n, a, e) <= t && (W(r - l, n, a, e) <= t && W(r, n, a, e) > 0 ? l = -(t - W(r, n, a, e)) : l = -2);
   }
   return l;
 }, at = (t, e, r, o, n) => {
   var c, s, i;
   let l = 0;
   o.startsWith("top") ? l = t : o.startsWith("bottom") && (l = -2);
-  const u = j(e, "arrow"), d = j(e, "shift");
+  const u = I(e, "arrow"), d = I(e, "shift");
   if (u) {
     const a = ((c = u.params) == null ? void 0 : c.arrow).getBoundingClientRect();
     o.startsWith("top") ? l += a.height / 2 : o.startsWith("bottom") && (l -= a.height / 2);
   }
-  if (Ce(e, "shift") && u) {
-    let a = null, v = 0;
+  if (we(e, "shift") && u) {
+    let a = null, f = 0;
     d && (a = (s = d.params) == null ? void 0 : s.parent);
-    const f = (i = u.params) == null ? void 0 : i.arrow;
-    v = f.getBoundingClientRect().height / 2, v += ct(f), v -= t, o.startsWith("top") ? L(r - l, n, a, e) <= t ? L(r, n, a, e) >= 0 ? l = -(t - L(r, n, a, e)) : l = -2 : O(r - l + v, n, a, e) <= t && (l = t + O(r - v, n, a, e), l <= t && (l = t)) : o.startsWith("bottom") ? L(r - l - v, n, a, e) <= t ? L(r - l - v, n, a, e) >= 0 ? (l = -2 - (L(r - l - v, n, a, e) + t), a && (l = -2)) : l = -2 : O(r - l, n, a, e) <= t && (O(r, n, a, e) >= 0 ? l = t - O(r, n, a, e) : l = t) : L(r - l, n, a, e) <= t ? L(r - l, n, a, e) >= 0 ? l = -(t - L(r - l, n, a, e)) : l = -2 : O(r - l, n, a, e) <= t && (O(r - l, n, a, e) >= 0 ? l = t - O(r - l, n, a, e) : l = t);
+    const v = (i = u.params) == null ? void 0 : i.arrow;
+    f = v.getBoundingClientRect().height / 2, f += dt(v), f -= t, o.startsWith("top") ? V(r - l, n, a, e) <= t ? V(r, n, a, e) >= 0 ? l = -(t - V(r, n, a, e)) : l = -2 : E(r - l + f, n, a, e) <= t && (l = t + E(r - f, n, a, e), l <= t && (l = t)) : o.startsWith("bottom") ? V(r - l - f, n, a, e) <= t ? V(r - l - f, n, a, e) >= 0 ? (l = -2 - (V(r - l - f, n, a, e) + t), a && (l = -2)) : l = -2 : E(r - l, n, a, e) <= t && (E(r, n, a, e) >= 0 ? l = t - E(r, n, a, e) : l = t) : V(r - l, n, a, e) <= t ? V(r - l, n, a, e) >= 0 ? l = -(t - V(r - l, n, a, e)) : l = -2 : E(r - l, n, a, e) <= t && (E(r - l, n, a, e) >= 0 ? l = t - E(r - l, n, a, e) : l = t);
   }
   return l;
 }, st = (t) => ({
@@ -577,8 +577,8 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
     y: r - at(t, o, c, i, s),
     placement: i
   })
-}), it = (t) => t.getBoundingClientRect().width !== t.clientWidth ? (t.getBoundingClientRect().width - t.clientWidth) / 2 : 0, ct = (t) => t.getBoundingClientRect().height !== t.clientHeight ? (t.getBoundingClientRect().height - t.clientHeight) / 2 : 0, dt = (t, e) => {
-  const r = P(t), o = [];
+}), it = (t) => t.getBoundingClientRect().width !== t.clientWidth ? (t.getBoundingClientRect().width - t.clientWidth) / 2 : 0, dt = (t) => t.getBoundingClientRect().height !== t.clientHeight ? (t.getBoundingClientRect().height - t.clientHeight) / 2 : 0, ct = (t, e) => {
+  const r = A(t), o = [];
   if (r !== null) {
     const n = () => e();
     r.addEventListener("scroll", n, !1), o.push(() => r.removeEventListener("scroll", n, !1));
@@ -593,84 +593,84 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
   }
   return () => o.forEach((n) => n());
 }, ut = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left - e.getBoundingClientRect().width / 2 + o.width / 2,
     y: o.top - e.getBoundingClientRect().height,
     placement: "top"
   };
 }, ft = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left,
     y: o.top - e.getBoundingClientRect().height,
     placement: "top-start"
   };
 }, vt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left - e.getBoundingClientRect().width + o.width,
     y: o.top - e.getBoundingClientRect().height,
     placement: "top-end"
   };
 }, pt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left + o.width,
     y: o.top - e.getBoundingClientRect().height / 2 + o.height / 2,
     placement: "right"
   };
-}, bt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+}, gt = (t, e, r = {}) => {
+  const o = T(t, e, r);
   return {
     x: o.left + o.width,
     y: o.top,
     placement: "right-start"
   };
-}, gt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+}, bt = (t, e, r = {}) => {
+  const o = T(t, e, r);
   return {
     x: o.left + o.width,
     y: o.top + o.height - e.getBoundingClientRect().height,
     placement: "right-end"
   };
 }, ht = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left + o.width / 2 - e.getBoundingClientRect().width / 2,
     y: o.top + o.height,
     placement: "bottom"
   };
 }, mt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left,
     y: o.top + o.height,
     placement: "bottom-start"
   };
 }, yt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left - e.getBoundingClientRect().width + o.width,
     y: o.top + o.height,
     placement: "bottom-end"
   };
 }, kt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left - e.getBoundingClientRect().width,
     y: o.top + o.height / 2 - e.getBoundingClientRect().height / 2,
     placement: "left"
   };
 }, Ct = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left - e.getBoundingClientRect().width,
     y: o.top,
     placement: "left-start"
   };
 }, wt = (t, e, r = {}) => {
-  const o = R(t, e, r);
+  const o = T(t, e, r);
   return {
     x: o.left - e.getBoundingClientRect().width,
     y: o.top + o.height - e.getBoundingClientRect().height,
@@ -687,9 +687,9 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
     case "right":
       return pt(t, e, o);
     case "right-start":
-      return bt(t, e, o);
-    case "right-end":
       return gt(t, e, o);
+    case "right-end":
+      return bt(t, e, o);
     case "bottom":
       return ht(t, e, o);
     case "bottom-start":
@@ -710,24 +710,24 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       };
   }
 }, _t = (t, e, r, o = {}) => {
-  if (Y(o, e)) {
+  if (G(o, e)) {
     if (typeof window > "u")
       return !0;
-    const a = t.x, v = t.y, f = a + e.clientWidth, p = v + e.clientHeight;
-    return a >= 0 && v >= 0 && f <= window.innerWidth && p <= window.innerHeight;
+    const a = t.x, f = t.y, v = a + e.clientWidth, p = f + e.clientHeight;
+    return a >= 0 && f >= 0 && v <= window.innerWidth && p <= window.innerHeight;
   }
-  if (P(r) !== null)
-    return L(t.y, e, null, o) > 0 && V(t.x, e, null, o) > 0 && O(t.y, e, null, o) > 0 && z(t.x, e, null, o) > 0;
+  if (A(r) !== null)
+    return V(t.y, e, null, o) > 0 && L(t.x, e, null, o) > 0 && E(t.y, e, null, o) > 0 && W(t.x, e, null, o) > 0;
   if (typeof window > "u")
     return !0;
   const n = window.innerWidth, c = window.innerHeight, s = (r instanceof HTMLElement ? r.offsetParent : null) || e.offsetParent;
   if (s) {
-    const a = s.getBoundingClientRect(), v = a.left + t.x, f = a.top + t.y, p = v + e.clientWidth, y = f + e.clientHeight;
-    return v >= 0 && f >= 0 && p <= n && y <= c;
+    const a = s.getBoundingClientRect(), f = a.left + t.x, v = a.top + t.y, p = f + e.clientWidth, y = v + e.clientHeight;
+    return f >= 0 && v >= 0 && p <= n && y <= c;
   }
   const i = t.x, l = t.y, u = i + e.clientWidth, d = l + e.clientHeight;
   return i >= 0 && l >= 0 && u <= n && d <= c;
-}, te = (t) => t.startsWith("right") ? "right" : t.startsWith("left") ? "left" : t.startsWith("top") ? "top" : "bottom", Ft = (t, e, r) => te(e) === t && r.includes(e) ? e : r.find((o) => te(o) === t) ?? r[0], $t = (t, e, r = {}) => {
+}, te = (t) => t.startsWith("right") ? "right" : t.startsWith("left") ? "left" : t.startsWith("top") ? "top" : "bottom", $t = (t, e, r) => te(e) === t && r.includes(e) ? e : r.find((o) => te(o) === t) ?? r[0], Ft = (t, e, r = {}) => {
   if (typeof window > "u")
     return {
       top: 0,
@@ -735,7 +735,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       bottom: 0,
       left: 0
     };
-  const o = Y(r, e) ? null : P(t), n = t.getBoundingClientRect(), c = o ? o.getBoundingClientRect() : {
+  const o = G(r, e) ? null : A(t), n = t.getBoundingClientRect(), c = o ? o.getBoundingClientRect() : {
     top: 0,
     left: 0,
     right: window.innerWidth,
@@ -758,7 +758,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
   i.x = l.x, i.y = l.y, i.placement = l.placement;
   const u = i.x, d = i.y, a = tt(t);
   (n = r.middleware) == null || n.forEach((y) => {
-    const m = y.fn({
+    const h = y.fn({
       x: i.x,
       y: i.y,
       options: r,
@@ -769,17 +769,17 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       reference: t,
       scrollDirection: a
     });
-    i.x = m.x, i.y = m.y, i.placement = m.placement, y.name === "arrow" && (m.baseX = m.x, m.baseY = m.y, m.x = m.arrowX ?? m.x, m.y = m.arrowY ?? m.y), i.middlewareData[y.name] = m;
+    i.x = h.x, i.y = h.y, i.placement = h.placement, y.name === "arrow" && (h.baseX = h.x, h.baseY = h.y, h.x = h.arrowX ?? h.x, h.y = h.arrowY ?? h.y), i.middlewareData[y.name] = h;
   });
-  const v = ae(t, e, i.placement, r), f = j(r, "offset"), p = f ? (c = f.params) == null ? void 0 : c.value : 0;
-  if (Number.isFinite(i.x) || (i.x = v.x), !Number.isFinite(i.y))
-    if (Y(r, e)) {
-      const y = t.getBoundingClientRect(), m = e.getBoundingClientRect().height;
-      i.placement.startsWith("top") ? i.y = y.top - m - p : i.placement.startsWith("bottom") ? i.y = y.bottom + p : i.y = v.y;
+  const f = ae(t, e, i.placement, r), v = I(r, "offset"), p = v ? (c = v.params) == null ? void 0 : c.value : 0;
+  if (Number.isFinite(i.x) || (i.x = f.x), !Number.isFinite(i.y))
+    if (G(r, e)) {
+      const y = t.getBoundingClientRect(), h = e.getBoundingClientRect().height;
+      i.placement.startsWith("top") ? i.y = y.top - h - p : i.placement.startsWith("bottom") ? i.y = y.bottom + p : i.y = f.y;
     } else
-      i.y = v.y;
+      i.y = f.y;
   o(i);
-}), xt = ["disabled", "aria-expanded", "onKeydown"], Tt = ["data-placement"], Rt = ["disabled", "aria-selected", "onClick"], fo = /* @__PURE__ */ X({
+}), xt = ["disabled", "aria-expanded", "onKeydown"], zt = ["data-placement"], Tt = ["disabled", "aria-selected", "onClick"], vo = /* @__PURE__ */ K({
   __name: "select",
   props: {
     modelValue: { default: void 0 },
@@ -793,110 +793,110 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
   emits: ["update:modelValue", "change", "focus", "blur"],
   setup(t, { emit: e }) {
     let r = 0;
-    const o = e, n = t, c = N(null), s = N(null), i = N(null), l = N(!1), u = N("bottom"), d = N("bottom"), a = `vf-select-panel-${++r}`;
-    let v = null;
-    const f = w(() => n.options.map((b) => ({
-      label: b[n.optionLabel],
-      value: b[n.optionValue],
-      disabled: b.disabled
-    }))), p = w(() => f.value.find((b) => b.value === n.modelValue)), y = w(() => {
-      var b;
-      return ((b = p.value) == null ? void 0 : b.label) ?? "";
-    }), m = w(() => {
-      const b = ["vf-select", l.value ? "vf-select_open" : ""];
-      return n.size !== "normal" && b.push(`vf-select_${n.size}`), n.disabled && b.push("vf-select_disabled"), b.filter(Boolean);
-    }), Q = (b) => b.value === n.modelValue, ee = (b) => {
-      b.disabled || (o("update:modelValue", b.value), o("change", b.value), H());
-    }, x = (b) => o("focus", b), $ = (b) => o("blur", b), H = () => {
+    const o = e, n = t, c = X(null), s = X(null), i = X(null), l = X(!1), u = X("bottom"), d = X("bottom"), a = `vf-select-panel-${++r}`;
+    let f = null;
+    const v = w(() => n.options.map((g) => ({
+      label: g[n.optionLabel],
+      value: g[n.optionValue],
+      disabled: g.disabled
+    }))), p = w(() => v.value.find((g) => g.value === n.modelValue)), y = w(() => {
+      var g;
+      return ((g = p.value) == null ? void 0 : g.label) ?? "";
+    }), h = w(() => {
+      const g = ["vf-select", l.value ? "vf-select_open" : ""];
+      return n.size !== "normal" && g.push(`vf-select_${n.size}`), n.disabled && g.push("vf-select_disabled"), g.filter(Boolean);
+    }), R = (g) => g.value === n.modelValue, D = (g) => {
+      g.disabled || (o("update:modelValue", g.value), o("change", g.value), O());
+    }, x = (g) => o("focus", g), F = (g) => o("blur", g), O = () => {
       l.value = !1, u.value = "bottom", d.value = "bottom";
-    }, A = () => {
+    }, j = () => {
       n.disabled || (l.value = !l.value, l.value && (u.value = "bottom", d.value = "bottom"));
     }, S = async () => {
-      var b, F;
-      l.value || (l.value = !0, await de()), (F = (b = i.value) == null ? void 0 : b.querySelector(".vf-select__option:not(.is-disabled)")) == null || F.focus();
-    }, D = (b) => {
-      var T;
+      var g, $;
+      l.value || (l.value = !0, await ue()), ($ = (g = i.value) == null ? void 0 : g.querySelector(".vf-select__option:not(.is-disabled)")) == null || $.focus();
+    }, N = (g) => {
+      var z;
       if (!l.value || !c.value)
         return;
-      const F = b.target;
-      c.value.contains(F) || (T = i.value) != null && T.contains(F) || H();
-    }, q = () => {
+      const $ = g.target;
+      c.value.contains($) || (z = i.value) != null && z.contains($) || O();
+    }, Z = () => {
       if (!s.value || !i.value)
         return;
-      const b = s.value, F = i.value, T = async () => {
+      const g = s.value, $ = i.value, z = async () => {
         const {
           x: Be,
           y: xe,
-          placement: Te
-        } = await Bt(b, F, {
+          placement: ze
+        } = await Bt(g, $, {
           placement: u.value,
           strategy: "fixed",
           middleware: [st(2), nt({ placements: ["bottom", "top"] })]
         });
-        d.value = Te ?? u.value, F.style.minWidth = `${b.getBoundingClientRect().width}px`, F.style.left = `${Be}px`, F.style.top = `${xe}px`;
+        d.value = ze ?? u.value, $.style.minWidth = `${g.getBoundingClientRect().width}px`, $.style.left = `${Be}px`, $.style.top = `${xe}px`;
       }, re = async () => {
-        await T();
-      }, $e = dt(b, () => {
+        await z();
+      }, Fe = ct(g, () => {
         re();
       }), ne = () => {
         re();
       };
-      document.addEventListener("scroll", ne, !0), window.addEventListener("resize", ne, !1), v = {
+      document.addEventListener("scroll", ne, !0), window.addEventListener("resize", ne, !1), f = {
         update: re,
         destroy: () => {
-          $e(), document.removeEventListener("scroll", ne, !0), window.removeEventListener("resize", ne, !1);
+          Fe(), document.removeEventListener("scroll", ne, !0), window.removeEventListener("resize", ne, !1);
         }
-      }, v.update();
+      }, f.update();
     };
-    return le(l, async (b) => {
-      if (!b) {
-        v && (v.destroy(), v = null);
+    return le(l, async (g) => {
+      if (!g) {
+        f && (f.destroy(), f = null);
         return;
       }
-      await de(), v || q(), v == null || v.update();
+      await ue(), f || Z(), f == null || f.update();
     }), le(
       () => n.options,
       () => {
-        v == null || v.update();
+        f == null || f.update();
       },
       { deep: !0 }
-    ), Re(() => {
-      document.addEventListener("click", D);
-    }), Se(() => {
-      document.removeEventListener("click", D), v == null || v.destroy(), v = null;
-    }), (b, F) => (g(), h("div", {
+    ), Te(() => {
+      document.addEventListener("click", N);
+    }), Re(() => {
+      document.removeEventListener("click", N), f == null || f.destroy(), f = null;
+    }), (g, $) => (b(), m("div", {
       ref_key: "root",
       ref: c,
-      class: C(m.value)
+      class: C(h.value)
     }, [
       B("button", {
         ref_key: "trigger",
         ref: s,
         class: "vf-select__control",
         type: "button",
-        disabled: b.disabled,
+        disabled: g.disabled,
         "aria-expanded": l.value,
         "aria-controls": a,
         "aria-haspopup": "listbox",
-        onClick: A,
+        onClick: j,
         onKeydown: [
-          K(G(S, ["prevent"]), ["down"]),
-          K(G(A, ["prevent"]), ["enter"]),
-          K(G(H, ["prevent"]), ["esc"])
+          q(U(S, ["prevent"]), ["down"]),
+          q(U(j, ["prevent"]), ["enter"]),
+          q(U(O, ["prevent"]), ["esc"])
         ],
         onFocus: x,
-        onBlur: $
+        onBlur: F
       }, [
         B("span", {
           class: C(["vf-select__label", { "vf-select__label_placeholder": !y.value }])
-        }, M(y.value || b.placeholder), 3),
-        F[0] || (F[0] = B("span", {
+        }, H(y.value || g.placeholder), 3),
+        $[0] || ($[0] = B("span", {
           class: "vf-select__chevron",
           "aria-hidden": "true"
         }, "▾", -1))
       ], 40, xt),
-      (g(), W(Le, { to: "body" }, [
-        me(B("div", {
+      (b(), M(Se, { to: "body" }, [
+        ye(B("div", {
           id: a,
           ref_key: "panel",
           ref: i,
@@ -904,25 +904,25 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
           role: "listbox",
           "data-placement": d.value
         }, [
-          (g(!0), h(oe, null, ge(f.value, (T) => (g(), h("button", {
-            key: T.value,
-            class: C(["vf-select__option", { "is-active": Q(T), "is-disabled": T.disabled }]),
+          (b(!0), m(oe, null, he(v.value, (z) => (b(), m("button", {
+            key: z.value,
+            class: C(["vf-select__option", { "is-active": R(z), "is-disabled": z.disabled }]),
             type: "button",
             role: "option",
-            disabled: T.disabled,
-            "aria-selected": Q(T),
-            onClick: (re) => ee(T)
-          }, M(T.label), 11, Rt))), 128))
-        ], 8, Tt), [
-          [ye, l.value]
+            disabled: z.disabled,
+            "aria-selected": R(z),
+            onClick: (re) => D(z)
+          }, H(z.label), 11, Tt))), 128))
+        ], 8, zt), [
+          [ke, l.value]
         ])
       ]))
     ], 2));
   }
-}), St = ["checked", "disabled"], Lt = {
+}), Rt = ["checked", "disabled"], St = {
   key: 0,
   class: "vf-checkbox__label"
-}, vo = /* @__PURE__ */ X({
+}, po = /* @__PURE__ */ K({
   __name: "checkbox",
   props: {
     modelValue: { type: Boolean, default: !1 },
@@ -938,7 +938,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       const i = s.target;
       r("update:modelValue", i.checked), r("change", s);
     };
-    return (s, i) => (g(), h("label", {
+    return (s, i) => (b(), m("label", {
       class: C(n.value)
     }, [
       B("input", {
@@ -947,19 +947,19 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
         checked: s.modelValue,
         disabled: s.disabled,
         onChange: c
-      }, null, 40, St),
+      }, null, 40, Rt),
       i[0] || (i[0] = B("span", { class: "vf-checkbox__box" }, null, -1)),
-      s.label || s.$slots.default ? (g(), h("span", Lt, [
+      s.label || s.$slots.default ? (b(), m("span", St, [
         k(s.$slots, "default", {}, () => [
-          J(M(s.label), 1)
+          ee(H(s.label), 1)
         ])
       ])) : _("", !0)
     ], 2));
   }
-}), Vt = ["checked", "disabled"], zt = {
+}), Vt = ["checked", "disabled"], Lt = {
   key: 0,
   class: "vf-switch__label"
-}, po = /* @__PURE__ */ X({
+}, go = /* @__PURE__ */ K({
   __name: "switch",
   props: {
     modelValue: { type: Boolean, default: !1 },
@@ -975,7 +975,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       const i = s.target;
       r("update:modelValue", i.checked), r("change", s);
     };
-    return (s, i) => (g(), h("label", {
+    return (s, i) => (b(), m("label", {
       class: C(n.value)
     }, [
       B("input", {
@@ -988,14 +988,14 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       i[0] || (i[0] = B("span", { class: "vf-switch__track" }, [
         B("span", { class: "vf-switch__thumb" })
       ], -1)),
-      s.label || s.$slots.default ? (g(), h("span", zt, [
+      s.label || s.$slots.default ? (b(), m("span", Lt, [
         k(s.$slots, "default", {}, () => [
-          J(M(s.label), 1)
+          ee(H(s.label), 1)
         ])
       ])) : _("", !0)
     ], 2));
   }
-}), Wt = { class: "vf-popover" }, Mt = ["aria-expanded", "onKeydown"], bo = /* @__PURE__ */ X({
+}), Wt = { class: "vf-popover" }, Mt = ["aria-expanded", "onKeydown"], bo = /* @__PURE__ */ K({
   __name: "popover",
   emits: ["click", "onClick"],
   setup(t, { expose: e, emit: r }) {
@@ -1004,7 +1004,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
     const s = `vf-popover-panel-${++c}`, i = () => n.visible = !0, l = () => n.visible = !1, u = () => n.visible = !n.visible, d = () => {
       u(), o("click"), o("onClick");
     };
-    return e({ show: i, hide: l, toggle: u }), (a, v) => (g(), h("div", Wt, [
+    return e({ show: i, hide: l, toggle: u }), (a, f) => (b(), m("div", Wt, [
       B("div", {
         class: "vf-popover__button",
         role: "button",
@@ -1014,31 +1014,31 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
         "aria-controls": s,
         onClick: d,
         onKeydown: [
-          K(G(d, ["prevent"]), ["enter"]),
-          K(G(d, ["prevent"]), ["space"])
+          q(U(d, ["prevent"]), ["enter"]),
+          q(U(d, ["prevent"]), ["space"])
         ]
       }, [
         k(a.$slots, "button")
       ], 40, Mt),
-      me(he(Xe, {
+      ye(me(Ye, {
         id: s,
         class: "vf-popover__wrapper"
-      }, ze({
-        default: I(() => [
-          v[0] || (v[0] = B("div", { class: "vf-popover__arrow" }, null, -1))
+      }, Le({
+        default: Y(() => [
+          f[0] || (f[0] = B("div", { class: "vf-popover__arrow" }, null, -1))
         ]),
         _: 2
       }, [
         a.$slots.default ? {
           name: "default",
-          fn: I(() => [
+          fn: Y(() => [
             k(a.$slots, "default")
           ]),
           key: "0"
         } : void 0,
         a.$slots.header || a.$slots.popoverHeader ? {
           name: "header",
-          fn: I(() => [
+          fn: Y(() => [
             k(a.$slots, "header"),
             a.$slots.header ? _("", !0) : k(a.$slots, "popoverHeader", { key: 0 })
           ]),
@@ -1046,7 +1046,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
         } : void 0,
         a.$slots.body || a.$slots.popoverBody ? {
           name: "body",
-          fn: I(() => [
+          fn: Y(() => [
             k(a.$slots, "body"),
             a.$slots.body ? _("", !0) : k(a.$slots, "popoverBody", { key: 0 })
           ]),
@@ -1054,21 +1054,21 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
         } : void 0,
         a.$slots.footer || a.$slots.popoverFooter ? {
           name: "footer",
-          fn: I(() => [
+          fn: Y(() => [
             k(a.$slots, "footer"),
             a.$slots.footer ? _("", !0) : k(a.$slots, "popoverFooter", { key: 0 })
           ]),
           key: "3"
         } : void 0
       ]), 1536), [
-        [ye, n.visible]
+        [ke, n.visible]
       ])
     ]));
   }
 }), Ht = ["dark", "light", "theme", "preset", "colors", "components", "colorScheme"], Ot = (t) => {
   const e = t.replace(/([A-Z])/g, "-$1");
   return e.charAt(0).toUpperCase() + e.slice(1);
-}, Et = (t) => t.filter((e) => !Ht.includes(e)).map((e) => Ot(e)).join("-").toLowerCase(), Pt = (t) => /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(t), ie = (t) => {
+}, Et = (t) => t.filter((e) => !Ht.includes(e)).map((e) => Ot(e)).join("-").toLowerCase(), ie = (t) => t.join("."), Pt = (t) => /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(t), de = (t) => {
   if (!Pt(t))
     return null;
   if (t.length === 4) {
@@ -1076,14 +1076,14 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
     return `#${e}${e}${r}${r}${o}${o}`;
   }
   return t.toLowerCase();
-}, we = (t) => {
-  const e = ie(t);
+}, _e = (t) => {
+  const e = de(t);
   if (!e)
     return [0, 0, 0];
   const r = parseInt(e.slice(1), 16), o = r >> 16 & 255, n = r >> 8 & 255, c = r & 255;
   return [o, n, c];
-}, ve = (t) => {
-  const [e, r, o] = we(t);
+}, pe = (t) => {
+  const [e, r, o] = _e(t);
   return `${e}, ${r}, ${o}`;
 }, At = (t, e, r) => {
   const o = t / 255, n = e / 255, c = r / 255, s = Math.max(o, n, c), i = Math.min(o, n, c), l = s - i;
@@ -1108,22 +1108,14 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
   const o = e / 100, n = r / 100, c = (1 - Math.abs(2 * n - 1)) * o, s = c * (1 - Math.abs(t / 60 % 2 - 1)), i = n - c / 2;
   let l = 0, u = 0, d = 0;
   t >= 0 && t < 60 ? (l = c, u = s, d = 0) : t >= 60 && t < 120 ? (l = s, u = c, d = 0) : t >= 120 && t < 180 ? (l = 0, u = c, d = s) : t >= 180 && t < 240 ? (l = 0, u = s, d = c) : t >= 240 && t < 300 ? (l = s, u = 0, d = c) : (l = c, u = 0, d = s);
-  const a = Math.round((l + i) * 255), v = Math.round((u + i) * 255), f = Math.round((d + i) * 255);
-  return [a, v, f];
-}, Nt = (t, e, r) => `#${[t, e, r].map((o) => o.toString(16).padStart(2, "0")).join("")}`, It = (t, e, r) => Math.min(r, Math.max(e, t)), jt = (t, e) => {
-  const r = ie(t);
+  const a = Math.round((l + i) * 255), f = Math.round((u + i) * 255), v = Math.round((d + i) * 255);
+  return [a, f, v];
+}, jt = (t, e, r) => `#${[t, e, r].map((o) => o.toString(16).padStart(2, "0")).join("")}`, Nt = (t, e, r) => Math.min(r, Math.max(e, t)), Xt = (t, e) => {
+  const r = de(t);
   if (!r)
     return t;
-  const [o, n, c] = we(r), [s, i, l] = At(o, n, c), d = (e - 5) * 7, a = It(l + d, 0, 100), [v, f, p] = Dt(s, i, a);
-  return Nt(v, f, p);
-}, Xt = (t) => {
-  if (typeof document > "u")
-    return null;
-  const e = document.getElementById(t);
-  if (e && e.tagName.toLowerCase() === "style")
-    return e;
-  const r = document.createElement("style");
-  return r.id = t, document.head.appendChild(r), r;
+  const [o, n, c] = _e(r), [s, i, l] = At(o, n, c), d = (e - 5) * 7, a = Nt(l + d, 0, 100), [f, v, p] = Dt(s, i, a);
+  return jt(f, v, p);
 }, se = (t) => !!t && typeof t == "object" && !Array.isArray(t), ce = (t, e) => {
   if (!e)
     return { ...t };
@@ -1133,7 +1125,7 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
     se(c) && se(n) ? r[o] = ce(c, n) : r[o] = n;
   }
   return r;
-}, _e = (t) => {
+}, Yt = (t) => {
   if (!t)
     return null;
   if (se(t) && "preset" in t) {
@@ -1142,69 +1134,96 @@ const et = (t, e) => t.strategy ? t.strategy : Qe(e) ? "fixed" : "absolute", Y =
       preset: e.preset ?? {},
       overrides: e.overrides,
       selector: e.selector,
-      darkSelector: e.darkSelector
+      darkSelector: e.darkSelector,
+      strict: e.strict
     };
   }
   return { preset: t };
-}, Yt = (t) => {
-  const e = [], r = [], o = (n, c) => {
-    if (!(!n || typeof n != "object"))
-      for (const s in n) {
-        const i = n[s], l = c.concat([s]);
-        if (i && typeof i == "object") {
-          o(i, l);
+}, It = (t) => {
+  const e = [], r = [], o = [], n = [], c = (l) => o.push(l), s = (l) => n.push(l), i = (l, u) => {
+    if (!(!l || typeof l != "object"))
+      for (const d in l) {
+        const a = l[d], f = u.concat([d]);
+        if (se(a)) {
+          i(a, f);
           continue;
         }
-        if (typeof i != "string")
+        if (a && typeof a == "object") {
+          s(`Theme value "${ie(f)}" is not a plain object or string and will be ignored.`);
           continue;
-        const d = l.includes("colorScheme") && l.includes("dark") ? r : e, a = Et(l);
-        if (d.push(`--vf-${a}: ${i}`), l.includes("colors")) {
-          const v = ie(i);
-          if (!v)
+        }
+        if (typeof a != "string") {
+          s(`Theme value "${ie(f)}" is not a string and will be ignored.`);
+          continue;
+        }
+        const p = f.includes("colorScheme") && f.includes("dark") ? r : e, y = Et(f);
+        if (p.push(`--vf-${y}: ${a}`), f.includes("colors")) {
+          const h = de(a);
+          if (!h) {
+            c(
+              `Theme color "${ie(f)}" is not hex. Shade variables will not be generated for it.`
+            );
             continue;
-          if (d.push(`--vf-${a}-rgb: ${ve(v)}`), s !== "white")
-            for (let f = 1; f < 10; ++f) {
-              const p = jt(v, f);
-              d.push(`--vf-${a}-${f}00: ${p}`), d.push(`--vf-${a}-${f}00-rgb: ${ve(p)}`);
+          }
+          if (p.push(`--vf-${y}-rgb: ${pe(h)}`), d !== "white")
+            for (let R = 1; R < 10; ++R) {
+              const D = Xt(h, R);
+              p.push(`--vf-${y}-${R}00: ${D}`), p.push(`--vf-${y}-${R}00-rgb: ${pe(D)}`);
             }
         }
       }
   };
-  return o(t, []), { baseVars: e, darkVars: r };
-}, Kt = (t, e, r) => {
-  const { baseVars: o, darkVars: n } = Yt(t), c = Xt("vueforge-theme");
-  if (!c)
+  return i(t, []), { baseVars: e, darkVars: r, warnings: o, errors: n };
+}, Kt = (t) => {
+  if (typeof document > "u")
+    return null;
+  const e = document.getElementById(t);
+  if (e && e.tagName.toLowerCase() === "style")
+    return e;
+  const r = document.createElement("style");
+  return r.id = t, document.head.appendChild(r), r;
+}, Gt = (t) => ({
+  selector: t.selector ?? ":root",
+  darkSelector: t.darkSelector ?? ":root[data-theme=dark]"
+}), qt = (t, e, r, o) => {
+  const { baseVars: n, darkVars: c, warnings: s, errors: i } = It(t), l = Kt("vueforge-theme");
+  if (!l)
     return;
-  const s = [];
-  o.length && s.push(`${e} { ${o.join(";")} }`), n.length && s.push(`${r} { ${n.join(";")} }`), c.textContent = s.join(`
+  if (i.length) {
+    if (o)
+      throw new Error(`[VueForge] ${i.join(" ")}`);
+    for (const d of i)
+      console.warn(`[VueForge] ${d}`);
+  }
+  if (s.length)
+    for (const d of s)
+      console.warn(`[VueForge] ${d}`);
+  const u = [];
+  n.length && u.push(`${e} { ${n.join(";")} }`), c.length && u.push(`${r} { ${c.join(";")} }`), l.textContent = u.join(`
 `);
 };
-let E = null;
-const Gt = (t) => ({
-  selector: t.selector ?? ":root",
-  darkSelector: t.darkSelector ?? ":root[data-theme=dark]"
-}), Fe = (t) => {
-  const e = _e(t);
+let P = null;
+const $e = (t) => {
+  const e = Yt(t);
   if (!e)
     return;
   const r = ce(e.preset, e.overrides), { selector: o, darkSelector: n } = Gt(e);
-  E = { ...e }, Kt(r, o, n);
-}, go = (t) => {
-  if (!E)
+  P = { ...e }, qt(r, o, n, e.strict);
+}, ho = (t) => {
+  if (!P)
     return;
-  const e = t.overrides === void 0 ? E.overrides : ce(E.overrides ?? {}, t.overrides ?? {}), r = {
-    preset: t.preset ?? E.preset,
+  const e = t.overrides === void 0 ? P.overrides : ce(P.overrides ?? {}, t.overrides ?? {}), r = {
+    preset: t.preset ?? P.preset,
     overrides: e,
-    selector: t.selector ?? E.selector,
-    darkSelector: t.darkSelector ?? E.darkSelector
+    selector: t.selector ?? P.selector,
+    darkSelector: t.darkSelector ?? P.darkSelector
   };
-  Fe(r);
-}, ho = () => E ? { ...E } : null, mo = {
+  $e(r);
+}, mo = () => P ? { ...P } : null, yo = {
   install(t, e = {}) {
-    const r = _e(e.theme);
-    r && Fe(r);
+    e.theme && $e(e.theme);
   }
-}, pe = {
+}, ge = {
   colors: {
     white: "#ffffff",
     green: "#0cbc87",
@@ -1216,6 +1235,36 @@ const Gt = (t) => ({
     gray: "#adb5bd"
   },
   borderWidth: "1px",
+  controls: {
+    height: "2rem",
+    paddingY: "0.25rem",
+    paddingX: "0.6rem"
+  },
+  radii: {
+    sm: "4px",
+    md: "6px",
+    lg: "10px"
+  },
+  typography: {
+    fontSize: "1rem",
+    lineHeight: "1.4"
+  },
+  states: {
+    disabledOpacity: "0.6",
+    focusRingShadow: "0 0 0 3px rgba(var(--vf-blue-600-rgb), 0.12)"
+  },
+  sizes: {
+    sm: {
+      fontSize: "0.875rem",
+      paddingY: "0.2rem",
+      paddingX: "0.5rem"
+    },
+    lg: {
+      fontSize: "1.125rem",
+      paddingY: "0.5rem",
+      paddingX: "1rem"
+    }
+  },
   colorScheme: {
     light: {
       bgColor: "#ffffff",
@@ -1236,19 +1285,19 @@ const Gt = (t) => ({
       dividerColor: "#2e2e32"
     }
   }
-}, qt = {
-  fontSize: "1rem",
-  padding: "6px 10px",
-  borderRadius: "6px",
+}, Ut = {
+  fontSize: "var(--vf-typography-font-size)",
+  padding: "var(--vf-controls-padding-y) var(--vf-controls-padding-x)",
+  borderRadius: "var(--vf-radii-md)",
   roundedBorderRadius: "2rem",
   iconGap: "6px",
   small: {
-    fontSize: "0.875rem",
-    padding: "4px 8px"
+    fontSize: "var(--vf-sizes-sm-font-size)",
+    padding: "var(--vf-sizes-sm-padding-y) var(--vf-sizes-sm-padding-x)"
   },
   large: {
-    fontSize: "1.125rem",
-    padding: "4px 8px"
+    fontSize: "var(--vf-sizes-lg-font-size)",
+    padding: "var(--vf-sizes-lg-padding-y) var(--vf-sizes-lg-padding-x)"
   },
   colorScheme: {
     light: {
@@ -1378,34 +1427,35 @@ const Gt = (t) => ({
       }
     }
   }
-}, Ut = {
+}, Zt = {
   padding: "12px",
   borderColor: "var(--vf-border-color)",
-  borderRadius: "6px"
-}, Zt = {}, Jt = {
+  borderRadius: "var(--vf-radii-md)"
+}, Jt = {}, Qt = {
   gap: "0.5rem",
-  fontSize: "1rem",
-  padding: "0.5rem 0.75rem",
-  borderRadius: "6px",
+  fontSize: "var(--vf-typography-font-size)",
+  padding: "var(--vf-controls-padding-y) var(--vf-controls-padding-x)",
+  borderRadius: "var(--vf-radii-md)",
   borderColor: "var(--vf-border-color)",
   backgroundColor: "var(--vf-bg-color)",
   textColor: "var(--vf-text-color)",
   placeholderColor: "var(--vf-secondary-text-color)",
   focusBorderColor: "var(--vf-blue-600)",
+  focusRingShadow: "var(--vf-states-focus-ring-shadow)",
   hoverBorderColor: "var(--vf-blue-500)",
-  disabledOpacity: "0.6",
+  disabledOpacity: "var(--vf-states-disabled-opacity)",
   small: {
-    padding: "0.375rem 0.5rem",
-    fontSize: "0.875rem"
+    padding: "var(--vf-sizes-sm-padding-y) var(--vf-sizes-sm-padding-x)",
+    fontSize: "var(--vf-sizes-sm-font-size)"
   },
   large: {
-    padding: "0.625rem 0.875rem",
-    fontSize: "1.125rem"
+    padding: "var(--vf-sizes-lg-padding-y) var(--vf-sizes-lg-padding-x)",
+    fontSize: "var(--vf-sizes-lg-font-size)"
   }
-}, Qt = {
+}, eo = {
   hoverColor: "var(--vf-blue)",
   activeColor: "var(--vf-blue)"
-}, eo = {
+}, to = {
   iconGap: "6px",
   submenuOffset: "12px",
   separatorThickness: "1px",
@@ -1425,45 +1475,45 @@ const Gt = (t) => ({
     marginBottom: "0.5rem",
     marginLeft: "0.5rem"
   }
-}, to = {
-  backgroundColor: "var(--vf-bg-color)"
 }, oo = {
+  backgroundColor: "var(--vf-bg-color)"
+}, ro = {
   minWidth: "12rem",
-  fontSize: "1rem",
+  fontSize: "var(--vf-typography-font-size)",
   controlGap: "0.75rem",
   chevronSize: "0.9em",
-  padding: "0.5rem 0.75rem",
-  borderRadius: "6px",
+  padding: "var(--vf-controls-padding-y) var(--vf-controls-padding-x)",
+  borderRadius: "var(--vf-radii-md)",
   borderColor: "var(--vf-border-color)",
   backgroundColor: "var(--vf-bg-color)",
   textColor: "var(--vf-text-color)",
   focusBorderColor: "var(--vf-blue-600)",
   hoverBorderColor: "var(--vf-blue-500)",
-  disabledOpacity: "0.6",
+  disabledOpacity: "var(--vf-states-disabled-opacity)",
   panelBackgroundColor: "var(--vf-bg-color)",
   panelBorderColor: "var(--vf-border-color)",
   panelPadding: "0.35rem",
   panelMaxHeight: "16rem",
   panelRadiusOffset: "2px",
   panelShadow: "0 10px 30px rgba(0, 0, 0, 0.12)",
-  focusRingShadow: "0 0 0 3px rgba(var(--vf-blue-600-rgb), 0.12)",
+  focusRingShadow: "var(--vf-states-focus-ring-shadow)",
   optionPadding: "0.5rem 0.6rem",
-  optionBorderRadius: "6px",
+  optionBorderRadius: "var(--vf-radii-md)",
   optionHoverBackgroundColor: "rgba(var(--vf-blue-600-rgb), 0.08)",
   optionActiveBackgroundColor: "rgba(var(--vf-blue-600-rgb), 0.14)",
   optionActiveTextColor: "var(--vf-text-color)",
   small: {
-    padding: "0.375rem 0.5rem",
-    fontSize: "0.875rem"
+    padding: "var(--vf-sizes-sm-padding-y) var(--vf-sizes-sm-padding-x)",
+    fontSize: "var(--vf-sizes-sm-font-size)"
   },
   large: {
-    padding: "0.625rem 0.875rem",
-    fontSize: "1.125rem"
+    padding: "var(--vf-sizes-lg-padding-y) var(--vf-sizes-lg-padding-x)",
+    fontSize: "var(--vf-sizes-lg-font-size)"
   }
-}, ro = {
+}, no = {
   size: "1rem",
   gap: "0.5rem",
-  borderRadius: "4px",
+  borderRadius: "var(--vf-radii-sm)",
   checkBorderRadius: "2px",
   borderColor: "var(--vf-border-color)",
   backgroundColor: "var(--vf-bg-color)",
@@ -1471,8 +1521,8 @@ const Gt = (t) => ({
   checkedBorderColor: "var(--vf-blue)",
   checkColor: "#ffffff",
   textColor: "var(--vf-text-color)",
-  disabledOpacity: "0.6"
-}, no = {
+  disabledOpacity: "var(--vf-states-disabled-opacity)"
+}, lo = {
   width: "2.25rem",
   height: "1.25rem",
   thumbSize: "1rem",
@@ -1483,36 +1533,36 @@ const Gt = (t) => ({
   checkedBackgroundColor: "var(--vf-blue)",
   thumbColor: "#ffffff",
   textColor: "var(--vf-text-color)",
-  disabledOpacity: "0.6"
-}, yo = {
-  ...pe,
+  disabledOpacity: "var(--vf-states-disabled-opacity)"
+}, ko = {
+  ...ge,
   components: {
-    base: pe,
-    button: qt,
-    card: Ut,
-    codeBlock: Zt,
-    input: Jt,
-    link: Qt,
-    menu: eo,
-    popover: to,
-    select: oo,
-    checkbox: ro,
-    switch: no
+    base: ge,
+    button: Ut,
+    card: Zt,
+    codeBlock: Jt,
+    input: Qt,
+    link: eo,
+    menu: to,
+    popover: oo,
+    select: ro,
+    checkbox: no,
+    switch: lo
   }
 };
 export {
-  co as Button,
-  Xe as Card,
-  vo as Checkbox,
-  yo as DefaultTheme,
-  uo as Input,
-  ke as Link,
-  io as Menu,
+  uo as Button,
+  Ye as Card,
+  po as Checkbox,
+  ko as DefaultTheme,
+  fo as Input,
+  Ce as Link,
+  co as Menu,
   bo as Popover,
-  fo as Select,
-  po as Switch,
-  mo as VueForge,
-  ho as getTheme,
-  Fe as setTheme,
-  go as updateTheme
+  vo as Select,
+  go as Switch,
+  yo as VueForge,
+  mo as getTheme,
+  $e as setTheme,
+  ho as updateTheme
 };