@codemonster-ru/vueforge-core 1.0.0 → 1.1.0

package/dist/vueforge-core.js

@@ -1,345 +1,167 @@
-import { defineComponent as C, ref as x, inject as ge, computed as s, watch as W, onMounted as q, onBeforeUnmount as G, provide as Te, renderSlot as k, toValue as P, nextTick as Q, openBlock as m, createElementBlock as h, createElementVNode as S, unref as c, toDisplayString as R, normalizeClass as K, createVNode as ee, createCommentVNode as E, useAttrs as F, mergeProps as M, createTextVNode as he, useSlots as Se, createBlock as Y, Teleport as Z, normalizeStyle as j, Fragment as Ve, renderList as Ce, normalizeProps as Ee, guardReactiveProps as Oe } from "vue";
-import { VueIconify as te, icons as N } from "@codemonster-ru/vueiconify";
-import { autoUpdate as Be, computePosition as Ie, offset as oe, flip as ne, shift as ae, arrow as re } from "@codemonster-ru/floater.js";
-const ye = Symbol("VueForgeConfig"), De = {
-  name: "vueforge-default",
-  tokens: {
-    colorBg: "#fcfcfd",
-    colorSurface: "#ffffff",
-    colorSurfaceMuted: "#f5f7fb",
-    colorText: "#172033",
-    colorMuted: "#69738a",
-    colorBorder: "#d8e0ef",
-    colorPrimary: "#0b63f6",
-    colorPrimaryContrast: "#ffffff",
-    colorPrimarySoft: "color-mix(in srgb, var(--vf-color-primary) 12%, var(--vf-color-surface))",
-    colorPrimaryBorderSoft: "color-mix(in srgb, var(--vf-color-primary) 22%, var(--vf-color-border))",
-    colorFocusRing: "color-mix(in srgb, var(--vf-color-primary) 52%, var(--vf-color-surface))",
-    colorSuccess: "#16a34a",
-    colorDanger: "#dc2626",
-    colorSuccessSoft: "color-mix(in srgb, var(--vf-color-success) 12%, var(--vf-color-surface))",
-    colorDangerSoft: "color-mix(in srgb, var(--vf-color-danger) 12%, var(--vf-color-surface))",
-    colorSuccessBorderSoft: "color-mix(in srgb, var(--vf-color-success) 24%, var(--vf-color-border))",
-    colorDangerBorderSoft: "color-mix(in srgb, var(--vf-color-danger) 24%, var(--vf-color-border))",
-    radius: "0.75rem",
-    radiusControl: "calc(var(--vf-radius) - 0.125rem)",
-    radiusControlTight: "calc(var(--vf-radius) - 0.25rem)",
-    radiusSurface: "var(--vf-radius)",
-    radiusOverlay: "calc(var(--vf-radius) + 0.125rem)",
-    controlHeightSm: "1.75rem",
-    controlHeightMd: "2.25rem",
-    controlHeightLg: "2.5rem",
-    controlFontSizeSm: "0.875rem",
-    controlFontSizeMd: "0.9375rem",
-    controlFontSizeLg: "1rem",
-    buttonPaddingSm: "0.25rem 0.55rem",
-    buttonPaddingMd: "0.375rem 0.75rem",
-    buttonPaddingLg: "0.5rem 0.875rem",
-    buttonGap: "0.5rem",
-    fieldPaddingSm: "0.25rem 0.55rem",
-    fieldPaddingMd: "0.375rem 0.65rem",
-    fieldPaddingLg: "0.5rem 0.75rem",
-    textareaMinHeightSm: "4.5rem",
-    textareaMinHeightMd: "6rem",
-    textareaMinHeightLg: "7rem",
-    overlayPadding: "0.875rem",
-    overlayGap: "0.75rem",
-    overlayViewportPadding: "1rem",
-    menuPadding: "0.4rem",
-    menuGap: "0.2rem",
-    menuMinWidth: "12rem",
-    surfacePadding: "0.95rem",
-    surfaceGap: "0.625rem",
-    surfacePaddingCompact: "0.7rem",
-    surfaceGapCompact: "0.5rem",
-    sectionPadding: "0.75rem 0.9rem",
-    sectionGap: "0.75rem",
-    tabsGap: "0.875rem",
-    tabsListGap: "0.375rem",
-    tabsListPadding: "0.25rem",
-    tabsTabPaddingInline: "0.8rem",
-    tabsPanelPaddingTop: "0.75rem",
-    badgeHeight: "1.625rem",
-    badgePadding: "0.2rem 0.55rem",
-    badgeGap: "0.375rem",
-    badgeRadius: "999px",
-    badgeFontSize: "0.8125rem",
-    badgeLineHeight: "1.2",
-    tagHeight: "1.75rem",
-    tagPadding: "0.25rem 0.6rem",
-    tagFontSize: "0.8125rem",
-    tagLineHeight: "1.2",
-    tooltipPadding: "0.45rem 0.65rem",
-    tooltipMaxWidth: "16rem",
-    tooltipFontSize: "0.8125rem",
-    tooltipLineHeight: "1.4",
-    dialogWidthSm: "28rem",
-    dialogWidthMd: "36rem",
-    dialogWidthLg: "48rem",
-    dialogMaxHeight: "min(85vh, 48rem)",
-    dialogTitleFontSize: "1.125rem",
-    dialogHeaderGap: "0.75rem",
-    dialogActionsGap: "0.5rem",
-    popoverWidth: "min(100vw - 2rem, 22rem)",
-    floatingArrowSize: "0.625rem",
-    overlayBackdrop: "rgba(15, 23, 42, 0.56)",
-    overlayBackdropBlur: "6px",
-    alertPrimarySoft: "color-mix(in srgb, var(--vf-color-primary) 8%, var(--vf-color-surface))",
-    alertPrimaryBorderSoft: "color-mix(in srgb, var(--vf-color-primary) 22%, var(--vf-color-border))",
-    alertContentGap: "0.25rem",
-    alertTitleFontSize: "0.9375rem",
-    cardTitleFontSize: "1rem",
-    panelTitleFontSize: "0.9375rem",
-    textLineHeight: "1.5",
-    headingLineHeight: "1.3",
-    tabsLineHeight: "1.2",
-    spacing: "1rem",
-    shadow: "none"
-  },
-  dark: {
-    colorBg: "#0f172a",
-    colorSurface: "#162033",
-    colorSurfaceMuted: "#1b2840",
-    colorText: "#eff4ff",
-    colorMuted: "#9fb0cf",
-    colorBorder: "#2d405f",
-    colorPrimary: "#6ea8fe",
-    colorPrimaryContrast: "#081120",
-    colorPrimarySoft: "color-mix(in srgb, var(--vf-color-primary) 12%, var(--vf-color-surface))",
-    colorPrimaryBorderSoft: "color-mix(in srgb, var(--vf-color-primary) 22%, var(--vf-color-border))",
-    colorFocusRing: "color-mix(in srgb, var(--vf-color-primary) 52%, var(--vf-color-surface))",
-    colorSuccess: "#4ade80",
-    colorDanger: "#f87171",
-    colorSuccessSoft: "color-mix(in srgb, var(--vf-color-success) 12%, var(--vf-color-surface))",
-    colorDangerSoft: "color-mix(in srgb, var(--vf-color-danger) 12%, var(--vf-color-surface))",
-    colorSuccessBorderSoft: "color-mix(in srgb, var(--vf-color-success) 24%, var(--vf-color-border))",
-    colorDangerBorderSoft: "color-mix(in srgb, var(--vf-color-danger) 24%, var(--vf-color-border))",
-    shadow: "none"
-  }
-}, _e = "vf-theme", be = "data-vf-theme";
-function Pe(e) {
-  return e === "light" || e === "dark" || e === "system";
-}
-function Ae(e, o) {
-  return e === "system" ? o : e;
-}
-const $e = "vf", ze = "vf-theme-preset", Le = ":root";
-function Fe(e) {
-  return e.replace(/[A-Z]/g, (o) => `-${o.toLowerCase()}`);
-}
-function ve(...e) {
-  return Object.assign({}, ...e);
-}
-function Ft(e) {
-  return e;
-}
-function Me(e = {}) {
-  const o = e.prefix ?? $e, t = e.rootSelector ?? Le, a = e.attribute ?? be;
-  return {
-    prefix: o,
-    rootSelector: t,
-    darkModeSelector: e.darkModeSelector ?? `${t}[${a}='dark']`,
-    attribute: a,
-    storageKey: e.storageKey ?? _e,
-    styleId: e.styleId ?? ze
-  };
-}
-function He(e = {}) {
-  const o = e.preset ?? De, t = e.extend, a = ve(o.tokens, t, e.light), n = ve(o.tokens, o.dark, t, e.dark);
-  return {
-    name: o.name,
-    light: a,
-    dark: n
-  };
-}
-function Re(e = {}) {
+import { r as be, a as ge, b as $e, D as we, c as ke, i as Ve } from "./public-D2viaiWv.js";
+import { d as Gt, e as Jt } from "./public-D2viaiWv.js";
+import { defineComponent as D, ref as w, inject as pe, computed as r, watch as W, onMounted as Q, onBeforeUnmount as N, provide as Te, renderSlot as $, toValue as A, nextTick as G, openBlock as m, createElementBlock as h, createElementVNode as C, unref as c, toDisplayString as R, normalizeClass as M, createVNode as ee, createCommentVNode as I, useAttrs as P, mergeProps as F, createTextVNode as ve, useSlots as xe, createBlock as X, Teleport as J, normalizeStyle as U, Fragment as Ce, renderList as Oe, normalizeProps as De, guardReactiveProps as Ie } from "vue";
+import { d as Ee } from "./useScrollLock-B7pq1ybb.js";
+import { t as eo, a as to, u as oo, b as no, c as ao, v as so } from "./useScrollLock-B7pq1ybb.js";
+import { VueIconify as te, icons as H } from "@codemonster-ru/vueiconify";
+import { autoUpdate as Be, computePosition as Ae, offset as oe, flip as ne, shift as ae, arrow as se } from "@codemonster-ru/floater.js";
+const me = Symbol("VueForgeConfig");
+function Se() {
   return {
-    preset: He(e),
-    options: Me(e.options)
-  };
-}
-function pe(e, o = $e) {
-  return Object.fromEntries(
-    Object.entries(e).map(([t, a]) => [`--${o}-${Fe(t)}`, a])
-  );
-}
-function me(e) {
-  return Object.entries(e).map(([o, t]) => `  ${o}: ${t};`).join(`
-`);
-}
-function Ke(e) {
-  const { preset: o, options: t } = e, a = me(pe(o.light, t.prefix)), n = me(pe(o.dark, t.prefix));
-  return [
-    `${t.rootSelector} {
-${a}
-}`,
-    `${t.darkModeSelector} {
-${n}
-}`
-  ].join(`
-
-`);
-}
-function Ge(e, o = document) {
-  const t = e.options.styleId, a = o.getElementById(t) ?? Object.assign(o.createElement("style"), { id: t });
-  return a.textContent = Ke(e), a.parentNode || o.head.appendChild(a), a;
-}
-function We() {
-  return {
-    install(o, t = {}) {
-      const a = Re(t.theme);
-      o.provide(ye, { theme: a }), typeof document < "u" && Ge(a);
+    install(t, e = {}) {
+      const s = be(e.theme);
+      t.provide(me, { theme: s }), typeof document < "u" && ge(s);
     }
   };
 }
-const Mt = We(), we = Symbol("VfThemeContext"), Ht = /* @__PURE__ */ C({
+const It = Se(), _e = Symbol("VfThemeContext"), Et = /* @__PURE__ */ D({
   __name: "VfThemeProvider",
   props: {
     defaultTheme: { default: "system" },
     storageKey: {},
     attribute: {}
   },
-  setup(e) {
-    const o = e, t = x(o.defaultTheme), a = x("light"), n = x(null), r = ge(ye, null), u = s(() => Ae(t.value, a.value)), v = s(
-      () => o.storageKey ?? (r == null ? void 0 : r.theme.options.storageKey) ?? _e
-    ), g = s(
-      () => o.attribute ?? (r == null ? void 0 : r.theme.options.attribute) ?? be
+  setup(o) {
+    const t = o, e = w(t.defaultTheme), s = w("light"), n = w(null), l = pe(me, null), d = r(() => $e(e.value, s.value)), f = r(
+      () => t.storageKey ?? (l == null ? void 0 : l.theme.options.storageKey) ?? we
+    ), _ = r(
+      () => t.attribute ?? (l == null ? void 0 : l.theme.options.attribute) ?? ke
     );
-    function w() {
+    function b() {
       if (typeof window > "u")
         return;
-      const _ = window.localStorage.getItem(v.value);
-      Pe(_) && (t.value = _);
+      const y = window.localStorage.getItem(f.value);
+      Ve(y) && (e.value = y);
     }
-    function f(_) {
-      typeof document > "u" || document.documentElement.setAttribute(g.value, _);
+    function u(y) {
+      typeof document > "u" || document.documentElement.setAttribute(_.value, y);
     }
-    function $(_) {
-      var I;
-      if (_) {
-        a.value = _.matches ? "dark" : "light";
+    function V(y) {
+      var B;
+      if (y) {
+        s.value = y.matches ? "dark" : "light";
         return;
       }
-      a.value = (I = n.value) != null && I.matches ? "dark" : "light";
+      s.value = (B = n.value) != null && B.matches ? "dark" : "light";
     }
-    function T(_) {
-      t.value = _;
+    function k(y) {
+      e.value = y;
     }
-    function V() {
-      const _ = u.value === "dark" ? "light" : "dark";
-      t.value = _;
+    function O() {
+      const y = d.value === "dark" ? "light" : "dark";
+      e.value = y;
     }
-    return W(t, (_) => {
-      typeof window > "u" || window.localStorage.setItem(v.value, _);
+    return W(e, (y) => {
+      typeof window > "u" || window.localStorage.setItem(f.value, y);
     }), W(
-      u,
-      (_) => {
-        f(_);
+      d,
+      (y) => {
+        u(y);
       },
       { immediate: !0 }
-    ), q(() => {
-      w(), n.value = window.matchMedia("(prefers-color-scheme: dark)"), $(), n.value.addEventListener("change", $);
-    }), G(() => {
-      var _;
-      (_ = n.value) == null || _.removeEventListener("change", $);
-    }), Te(we, {
-      mode: t,
-      resolvedTheme: u,
-      setTheme: T,
-      toggleTheme: V
-    }), (_, I) => k(_.$slots, "default");
+    ), Q(() => {
+      b(), n.value = window.matchMedia("(prefers-color-scheme: dark)"), V(), n.value.addEventListener("change", V);
+    }), N(() => {
+      var y;
+      (y = n.value) == null || y.removeEventListener("change", V);
+    }), Te(_e, {
+      mode: e,
+      resolvedTheme: d,
+      setTheme: k,
+      toggleTheme: O
+    }), (y, B) => $(y.$slots, "default");
   }
 });
-function ke(e, o, t = {}) {
-  const a = t.event ?? "pointerdown", n = (r) => {
-    if (P(t.enabled) === !1)
+function he(o, t, e = {}) {
+  const s = e.event ?? "pointerdown", n = (l) => {
+    if (A(e.enabled) === !1)
       return;
-    const u = r.target;
-    if (!(u instanceof Node))
+    const d = l.target;
+    if (!(d instanceof Node))
       return;
-    const v = Array.isArray(e) ? e.map((g) => g.value).filter((g) => g instanceof HTMLElement) : [e.value].filter((g) => g instanceof HTMLElement);
-    v.length === 0 || v.some((g) => g.contains(u)) || o(r);
+    const f = Array.isArray(o) ? o.map((_) => _.value).filter((_) => _ instanceof HTMLElement) : [o.value].filter((_) => _ instanceof HTMLElement);
+    f.length === 0 || f.some((_) => _.contains(d)) || t(l);
   };
-  q(() => {
-    document.addEventListener(a, n);
-  }), G(() => {
-    document.removeEventListener(a, n);
+  Q(() => {
+    document.addEventListener(s, n);
+  }), N(() => {
+    document.removeEventListener(s, n);
   });
 }
-function J(e = {}) {
-  const o = s(() => P(e.open) !== void 0), t = x(e.defaultOpen ?? !1), a = s(() => o.value ? !!P(e.open) : t.value);
+function Z(o = {}) {
+  const t = r(() => A(o.open) !== void 0), e = w(o.defaultOpen ?? !1), s = r(() => t.value ? !!A(o.open) : e.value);
   W(
-    () => P(e.open),
-    (r) => {
-      r !== void 0 && (t.value = r);
+    () => A(o.open),
+    (l) => {
+      l !== void 0 && (e.value = l);
     }
   );
-  function n(r) {
-    var u;
-    o.value || (t.value = r), (u = e.onOpenChange) == null || u.call(e, r);
+  function n(l) {
+    var d;
+    t.value || (e.value = l), (d = o.onOpenChange) == null || d.call(o, l);
   }
   return {
-    isOpen: a,
+    isOpen: s,
     open: () => n(!0),
     close: () => n(!1),
-    toggle: () => n(!a.value),
+    toggle: () => n(!s.value),
     setOpen: n
   };
 }
-function le(e, o = {}) {
-  const t = o.event ?? "keydown", a = (n) => {
-    P(o.enabled) === !1 || n.key !== "Escape" || e(n);
+function le(o, t = {}) {
+  const e = t.event ?? "keydown", s = (n) => {
+    A(t.enabled) === !1 || n.key !== "Escape" || o(n);
   };
-  q(() => {
-    document.addEventListener(t, a);
-  }), G(() => {
-    document.removeEventListener(t, a);
+  Q(() => {
+    document.addEventListener(e, s);
+  }), N(() => {
+    document.removeEventListener(e, s);
   });
 }
-function se(e, o, t = {}) {
-  const a = x(0), n = x(0), r = x(P(t.placement) ?? "bottom"), u = x({}), v = x(null);
-  let g = 0;
-  const w = s(() => ({
-    left: `${a.value}px`,
+function re(o, t, e = {}) {
+  const s = w(0), n = w(0), l = w(A(e.placement) ?? "bottom"), d = w({}), f = w(null);
+  let _ = 0;
+  const b = r(() => ({
+    left: `${s.value}px`,
     top: `${n.value}px`
   }));
-  async function f() {
-    if (!e.value || !o.value)
+  async function u() {
+    if (!o.value || !t.value)
       return;
-    const T = await Ie(e.value, o.value, {
-      placement: P(t.placement) ?? r.value,
-      middleware: P(t.middleware),
-      strategy: P(t.strategy)
+    const k = await Ae(o.value, t.value, {
+      placement: A(e.placement) ?? l.value,
+      middleware: A(e.middleware),
+      strategy: A(e.strategy)
     });
-    a.value = T.x, n.value = T.y, r.value = T.placement, u.value = T.middlewareData ?? {};
+    s.value = k.x, n.value = k.y, l.value = k.placement, d.value = k.middlewareData ?? {};
   }
-  function $() {
-    var T;
-    (T = v.value) == null || T.call(v), v.value = null;
+  function V() {
+    var k;
+    (k = f.value) == null || k.call(f), f.value = null;
   }
   return W(
-    [() => P(t.enabled) !== !1, e, o],
-    async ([T]) => {
-      g += 1;
-      const V = g;
-      $(), !(!T || !e.value || !o.value) && (await Q(), !(V !== g || P(t.enabled) === !1 || !e.value || !o.value) && (await f(), !(V !== g || P(t.enabled) === !1 || !e.value || !o.value) && (v.value = Be(e.value, () => {
-        f();
+    [() => A(e.enabled) !== !1, o, t],
+    async ([k]) => {
+      _ += 1;
+      const O = _;
+      V(), !(!k || !o.value || !t.value) && (await G(), !(O !== _ || A(e.enabled) === !1 || !o.value || !t.value) && (await u(), !(O !== _ || A(e.enabled) === !1 || !o.value || !t.value) && (f.value = Be(o.value, () => {
+        u();
       }))));
     },
     { immediate: !0 }
-  ), G(() => {
-    $();
+  ), N(() => {
+    V();
   }), {
-    x: a,
+    x: s,
     y: n,
-    placement: r,
-    middlewareData: u,
-    styles: w,
-    update: f,
-    cleanup: $
+    placement: l,
+    middlewareData: d,
+    styles: b,
+    update: u,
+    cleanup: V
   };
 }
-const je = [
+const ze = [
   "a[href]",
   "button:not([disabled])",
   "input:not([disabled])",
@@ -347,53 +169,53 @@ const je = [
   "textarea:not([disabled])",
   '[tabindex]:not([tabindex="-1"])'
 ].join(", ");
-function Ue(e) {
-  return Array.from(e.querySelectorAll(je)).filter(
-    (o) => !o.hasAttribute("hidden") && o.getAttribute("aria-hidden") !== "true"
+function Pe(o) {
+  return Array.from(o.querySelectorAll(ze)).filter(
+    (t) => !t.hasAttribute("hidden") && t.getAttribute("aria-hidden") !== "true"
   );
 }
-function Ne(e, o = {}) {
-  const t = (a) => {
-    if (a.key !== "Tab" || P(o.enabled) === !1)
+function Fe(o, t = {}) {
+  const e = (s) => {
+    if (s.key !== "Tab" || A(t.enabled) === !1)
       return;
-    const n = e.value;
+    const n = o.value;
     if (!n)
       return;
-    const r = Ue(n);
-    if (r.length === 0) {
-      a.preventDefault(), n.focus();
+    const l = Pe(n);
+    if (l.length === 0) {
+      s.preventDefault(), n.focus();
       return;
     }
-    const u = r[0], v = r[r.length - 1], g = document.activeElement;
-    if (a.shiftKey) {
-      (g === u || g === n) && (a.preventDefault(), v.focus());
+    const d = l[0], f = l[l.length - 1], _ = document.activeElement;
+    if (s.shiftKey) {
+      (_ === d || _ === n) && (s.preventDefault(), f.focus());
       return;
     }
-    g === v && (a.preventDefault(), u.focus());
+    _ === f && (s.preventDefault(), d.focus());
   };
-  q(() => {
-    document.addEventListener("keydown", t);
-  }), G(() => {
-    document.removeEventListener("keydown", t);
+  Q(() => {
+    document.addEventListener("keydown", e);
+  }), N(() => {
+    document.removeEventListener("keydown", e);
   });
 }
-let Ye = 0;
-function H(e = {}) {
-  const o = `${e.prefix ?? "vf"}-${++Ye}`;
-  return s(() => P(e.providedId) ?? o);
+let Ke = 0;
+function K(o = {}) {
+  const t = `${o.prefix ?? "vf"}-${++Ke}`;
+  return r(() => A(o.providedId) ?? t);
 }
-function Rt() {
-  const e = ge(we);
-  if (!e)
+function Bt() {
+  const o = pe(_e);
+  if (!o)
     throw new Error("useTheme must be used inside VfThemeProvider.");
   return {
-    theme: e.mode,
-    resolvedTheme: e.resolvedTheme,
-    setTheme: e.setTheme,
-    toggleTheme: e.toggleTheme
+    theme: o.mode,
+    resolvedTheme: o.resolvedTheme,
+    setTheme: o.setTheme,
+    toggleTheme: o.toggleTheme
   };
 }
-const Xe = { class: "vf-accordion" }, qe = ["id", "aria-controls", "aria-expanded", "disabled"], Qe = ["id", "aria-labelledby"], Kt = /* @__PURE__ */ C({
+const Le = { class: "vf-accordion" }, Re = ["id", "aria-controls", "aria-expanded", "disabled"], Me = ["id", "aria-labelledby"], At = /* @__PURE__ */ D({
   __name: "VfAccordion",
   props: {
     open: { type: Boolean, default: void 0 },
@@ -402,113 +224,113 @@ const Xe = { class: "vf-accordion" }, qe = ["id", "aria-controls", "aria-expande
     disabled: { type: Boolean, default: !1 }
   },
   emits: ["update:open", "openChange"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = H({ prefix: "vf-accordion-trigger" }), r = H({ prefix: "vf-accordion-content" }), u = J({
-      defaultOpen: t.defaultOpen,
-      open: s(() => t.open),
-      onOpenChange: (f) => {
-        a("update:open", f), a("openChange", f);
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = K({ prefix: "vf-accordion-trigger" }), l = K({ prefix: "vf-accordion-content" }), d = Z({
+      defaultOpen: e.defaultOpen,
+      open: r(() => e.open),
+      onOpenChange: (u) => {
+        s("update:open", u), s("openChange", u);
       }
-    }), v = u.isOpen;
-    function g() {
-      t.disabled || u.toggle();
+    }), f = d.isOpen;
+    function _() {
+      e.disabled || d.toggle();
     }
-    function w(f) {
-      (f.key === "Enter" || f.key === " ") && (f.preventDefault(), g());
+    function b(u) {
+      (u.key === "Enter" || u.key === " ") && (u.preventDefault(), _());
     }
-    return (f, $) => (m(), h("section", Xe, [
-      S("button", {
+    return (u, V) => (m(), h("section", Le, [
+      C("button", {
         id: c(n),
-        "aria-controls": c(r),
-        "aria-expanded": c(v),
-        disabled: e.disabled,
+        "aria-controls": c(l),
+        "aria-expanded": c(f),
+        disabled: o.disabled,
         class: "vf-accordion__trigger",
         type: "button",
-        onClick: g,
-        onKeydown: w
+        onClick: _,
+        onKeydown: b
       }, [
-        k(f.$slots, "trigger", { open: c(v) }, () => [
-          S("span", null, R(e.title), 1)
+        $(u.$slots, "trigger", { open: c(f) }, () => [
+          C("span", null, R(o.title), 1)
         ]),
-        S("span", {
+        C("span", {
           "aria-hidden": "true",
-          class: K(["vf-accordion__icon", c(v) && "vf-accordion__icon--open"])
+          class: M(["vf-accordion__icon", c(f) && "vf-accordion__icon--open"])
         }, [
           ee(c(te), {
-            icon: c(N).chevronDown,
+            icon: c(H).chevronDown,
             size: "0.875rem"
           }, null, 8, ["icon"])
         ], 2)
-      ], 40, qe),
-      c(v) ? (m(), h("div", {
+      ], 40, Re),
+      c(f) ? (m(), h("div", {
         key: 0,
-        id: c(r),
+        id: c(l),
         "aria-labelledby": c(n),
         class: "vf-accordion__content",
         role: "region"
       }, [
-        k(f.$slots, "default", { open: c(v) })
-      ], 8, Qe)) : E("", !0)
+        $(u.$slots, "default", { open: c(f) })
+      ], 8, Me)) : I("", !0)
     ]));
   }
 });
-function A(...e) {
-  return e.filter(Boolean).join(" ");
+function S(...o) {
+  return o.filter(Boolean).join(" ");
 }
-const Ze = {
+const Ne = {
   class: "vf-alert__icon",
   "aria-hidden": "true"
-}, Je = { class: "vf-alert__content" }, et = {
+}, We = { class: "vf-alert__content" }, Ue = {
   key: 0,
   class: "vf-alert__title"
-}, tt = { class: "vf-alert__body" }, Gt = /* @__PURE__ */ C({
+}, Ye = { class: "vf-alert__body" }, St = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfAlert",
   props: {
     tone: { default: "primary" },
     title: { default: void 0 }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(
-      () => A("vf-alert", o.tone !== "primary" && `vf-alert--${o.tone}`)
-    ), n = s(() => o.tone === "success" ? N.checkCircle : o.tone === "danger" ? N.warning : N.info);
-    return (r, u) => (m(), h("section", M({
-      class: a.value,
+  setup(o) {
+    const t = o, e = P(), s = r(
+      () => S("vf-alert", t.tone !== "primary" && `vf-alert--${t.tone}`)
+    ), n = r(() => t.tone === "success" ? H.checkCircle : t.tone === "danger" ? H.warning : H.info);
+    return (l, d) => (m(), h("section", F({
+      class: s.value,
       role: "alert"
-    }, c(t)), [
-      S("div", Ze, [
+    }, c(e)), [
+      C("div", Ne, [
         ee(c(te), {
           icon: n.value,
           size: "2rem"
         }, null, 8, ["icon"])
       ]),
-      S("div", Je, [
-        o.title || r.$slots.title ? (m(), h("p", et, [
-          k(r.$slots, "title", {}, () => [
-            he(R(o.title), 1)
+      C("div", We, [
+        t.title || l.$slots.title ? (m(), h("p", Ue, [
+          $(l.$slots, "title", {}, () => [
+            ve(R(t.title), 1)
           ])
-        ])) : E("", !0),
-        S("div", tt, [
-          k(r.$slots, "default")
+        ])) : I("", !0),
+        C("div", Ye, [
+          $(l.$slots, "default")
         ])
       ])
     ], 16));
   }
-}), Wt = /* @__PURE__ */ C({
+}), zt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfBadge",
   props: {
     tone: { default: "neutral" }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(
-      () => A("vf-badge", o.tone !== "neutral" && `vf-badge--${o.tone}`)
+  setup(o) {
+    const t = o, e = P(), s = r(
+      () => S("vf-badge", t.tone !== "neutral" && `vf-badge--${t.tone}`)
     );
-    return (n, r) => (m(), h("span", M({ class: a.value }, c(t)), [
-      k(n.$slots, "default")
+    return (n, l) => (m(), h("span", F({ class: s.value }, c(e)), [
+      $(n.$slots, "default")
     ], 16));
   }
-}), ot = ["type"], jt = /* @__PURE__ */ C({
+}), He = ["type"], Pt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfButton",
   props: {
@@ -517,49 +339,49 @@ const Ze = {
     block: { type: Boolean, default: !1 },
     type: { default: "button" }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(
-      () => A(
+  setup(o) {
+    const t = o, e = P(), s = r(
+      () => S(
         "vf-button",
-        o.variant !== "primary" && `vf-button--${o.variant}`,
-        o.size !== "md" && `vf-button--${o.size}`,
-        o.block && "vf-button--block"
+        t.variant !== "primary" && `vf-button--${t.variant}`,
+        t.size !== "md" && `vf-button--${t.size}`,
+        t.block && "vf-button--block"
       )
     );
-    return (n, r) => (m(), h("button", M({
-      class: a.value,
-      type: o.type
-    }, c(t)), [
-      k(n.$slots, "default")
-    ], 16, ot));
+    return (n, l) => (m(), h("button", F({
+      class: s.value,
+      type: t.type
+    }, c(e)), [
+      $(n.$slots, "default")
+    ], 16, He));
   }
-}), nt = { key: 0 }, at = { class: "vf-card__title" }, rt = {
+}), Xe = { key: 0 }, qe = { class: "vf-card__title" }, je = {
   key: 1,
   class: "vf-card__body"
-}, lt = { key: 2 }, Ut = /* @__PURE__ */ C({
+}, Qe = { key: 2 }, Ft = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfCard",
   props: {
     title: { default: void 0 },
     compact: { type: Boolean, default: !1 }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(() => A("vf-card", o.compact && "vf-card--compact"));
-    return (n, r) => (m(), h("section", M({ class: a.value }, c(t)), [
-      o.title || n.$slots.header ? (m(), h("header", nt, [
-        k(n.$slots, "header", {}, () => [
-          S("h3", at, R(o.title), 1)
+  setup(o) {
+    const t = o, e = P(), s = r(() => S("vf-card", t.compact && "vf-card--compact"));
+    return (n, l) => (m(), h("section", F({ class: s.value }, c(e)), [
+      t.title || n.$slots.header ? (m(), h("header", Xe, [
+        $(n.$slots, "header", {}, () => [
+          C("h3", qe, R(t.title), 1)
         ])
-      ])) : E("", !0),
-      n.$slots.default ? (m(), h("div", rt, [
-        k(n.$slots, "default")
-      ])) : E("", !0),
-      n.$slots.footer ? (m(), h("footer", lt, [
-        k(n.$slots, "footer")
-      ])) : E("", !0)
+      ])) : I("", !0),
+      n.$slots.default ? (m(), h("div", je, [
+        $(n.$slots, "default")
+      ])) : I("", !0),
+      n.$slots.footer ? (m(), h("footer", Qe, [
+        $(n.$slots, "footer")
+      ])) : I("", !0)
     ], 16));
   }
-}), st = ["type"], it = /* @__PURE__ */ C({
+}), Ge = ["type"], Je = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfIconButton",
   props: {
@@ -568,38 +390,38 @@ const Ze = {
     size: { default: "md" },
     type: { default: "button" }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(
-      () => A(
+  setup(o) {
+    const t = o, e = P(), s = r(
+      () => S(
         "vf-icon-button",
-        o.variant !== "ghost" && `vf-icon-button--${o.variant}`,
-        o.size !== "md" && `vf-icon-button--${o.size}`
+        t.variant !== "ghost" && `vf-icon-button--${t.variant}`,
+        t.size !== "md" && `vf-icon-button--${t.size}`
       )
-    ), n = s(() => o.size === "sm" ? "0.875rem" : o.size === "lg" ? "1.125rem" : "1rem");
-    return (r, u) => (m(), h("button", M({
-      class: a.value,
-      type: o.type
-    }, c(t)), [
+    ), n = r(() => t.size === "sm" ? "0.875rem" : t.size === "lg" ? "1.125rem" : "1rem");
+    return (l, d) => (m(), h("button", F({
+      class: s.value,
+      type: t.type
+    }, c(e)), [
       ee(c(te), {
-        icon: o.icon,
+        icon: t.icon,
         size: n.value,
         "aria-hidden": "true"
       }, null, 8, ["icon", "size"])
-    ], 16, st));
+    ], 16, Ge));
   }
-}), ct = {
+}), Ze = {
   key: 0,
   class: "vf-dialog"
-}, ut = ["aria-describedby", "aria-labelledby"], dt = {
+}, et = ["aria-describedby", "aria-labelledby"], tt = {
   key: 0,
   class: "vf-dialog__header"
-}, ft = ["id"], vt = ["id"], pt = { class: "vf-dialog__actions" }, mt = {
+}, ot = ["id"], nt = ["id"], at = { class: "vf-dialog__actions" }, st = {
   key: 1,
   class: "vf-dialog__body"
-}, gt = {
+}, lt = {
   key: 2,
   class: "vf-dialog__footer"
-}, Nt = /* @__PURE__ */ C({
+}, Kt = /* @__PURE__ */ D({
   __name: "VfDialog",
   props: {
     open: { type: Boolean, default: void 0 },
@@ -612,138 +434,132 @@ const Ze = {
     closable: { type: Boolean, default: !0 }
   },
   emits: ["update:open", "openChange"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = x(null), r = x(null), u = x(null), v = Se(), g = H({ prefix: "vf-dialog-title" }), w = H({ prefix: "vf-dialog-description" }), f = J({
-      defaultOpen: t.defaultOpen,
-      open: s(() => t.open),
-      onOpenChange: (y) => {
-        a("update:open", y), a("openChange", y);
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = w(null), l = w(null), d = xe(), f = K({ prefix: "vf-dialog-title" }), _ = K({ prefix: "vf-dialog-description" }), b = Z({
+      defaultOpen: e.defaultOpen,
+      open: r(() => e.open),
+      onOpenChange: (a) => {
+        s("update:open", a), s("openChange", a);
       }
-    }), $ = f.isOpen, T = s(
-      () => A("vf-dialog__content", t.size !== "md" && `vf-dialog__content--${t.size}`)
-    ), V = s(() => !!v.header), _ = s(() => !!v.description), I = s(
-      () => t.title || V.value ? g.value : void 0
-    ), D = s(
-      () => t.description || _.value ? w.value : void 0
+    }), u = b.isOpen, V = r(
+      () => S("vf-dialog__content", e.size !== "md" && `vf-dialog__content--${e.size}`)
+    ), k = r(() => !!d.header), O = r(() => !!d.description), y = r(
+      () => e.title || k.value ? f.value : void 0
+    ), B = r(
+      () => e.description || O.value ? _.value : void 0
     );
-    function d() {
-      f.close();
+    function x() {
+      b.close();
     }
-    function O() {
-      t.closeOnOverlayClick && d();
+    function p() {
+      e.closeOnOverlayClick && x();
     }
-    function l() {
-      const y = n.value;
-      if (!y)
+    function E() {
+      const a = n.value;
+      if (!a)
         return;
-      const z = y.querySelector("[autofocus], [data-autofocus]");
-      if (z) {
-        z.focus();
+      const T = a.querySelector("[autofocus], [data-autofocus]");
+      if (T) {
+        T.focus();
         return;
       }
-      y.focus();
-    }
-    function B() {
-      typeof document > "u" || (u.value === null && (u.value = document.body.style.overflow), document.body.style.overflow = "hidden");
-    }
-    function b() {
-      typeof document > "u" || (document.body.style.overflow = u.value ?? "", u.value = null);
+      a.focus();
     }
     return le(
-      (y) => {
-        !t.closeOnEscape || !$.value || (y.preventDefault(), d());
+      (a) => {
+        !e.closeOnEscape || !u.value || (a.preventDefault(), x());
       },
       {
-        enabled: $
+        enabled: u
       }
-    ), Ne(n, {
-      enabled: $
-    }), W(
-      $,
-      async (y) => {
-        var z;
+    ), Fe(n, {
+      enabled: u
+    }), Ee(u), W(
+      u,
+      async (a) => {
+        var T;
         if (!(typeof document > "u")) {
-          if (y) {
-            r.value = document.activeElement instanceof HTMLElement ? document.activeElement : null, B(), await Q(), l();
+          if (a) {
+            l.value = document.activeElement instanceof HTMLElement ? document.activeElement : null, await G(), E();
             return;
           }
-          b(), (z = r.value) == null || z.focus();
+          (T = l.value) == null || T.focus();
         }
       },
       { immediate: !0 }
-    ), G(() => {
-      var y;
-      $.value && (b(), (y = r.value) == null || y.focus());
-    }), (y, z) => (m(), Y(Z, { to: "body" }, [
-      c($) ? (m(), h("div", ct, [
-        S("div", {
+    ), N(() => {
+      var a;
+      u.value && ((a = l.value) == null || a.focus());
+    }), (a, T) => (m(), X(J, { to: "body" }, [
+      c(u) ? (m(), h("div", Ze, [
+        C("div", {
           class: "vf-dialog__overlay",
           "aria-hidden": "true",
-          onClick: O
+          onClick: p
         }),
-        S("section", {
+        C("section", {
           ref_key: "contentRef",
           ref: n,
-          class: K(T.value),
-          "aria-describedby": D.value,
-          "aria-labelledby": I.value,
+          class: M(V.value),
+          "aria-describedby": B.value,
+          "aria-labelledby": y.value,
           "aria-modal": "true",
           role: "dialog",
           tabindex: "-1"
         }, [
-          e.title || e.description || y.$slots.header || y.$slots.description ? (m(), h("header", dt, [
-            S("div", null, [
-              k(y.$slots, "header", {}, () => [
-                e.title ? (m(), h("h2", {
+          o.title || o.description || a.$slots.header || a.$slots.description ? (m(), h("header", tt, [
+            C("div", null, [
+              $(a.$slots, "header", {}, () => [
+                o.title ? (m(), h("h2", {
                   key: 0,
-                  id: c(g),
+                  id: c(f),
                   class: "vf-dialog__title"
-                }, R(e.title), 9, ft)) : E("", !0)
+                }, R(o.title), 9, ot)) : I("", !0)
               ]),
-              k(y.$slots, "description", {}, () => [
-                e.description ? (m(), h("p", {
+              $(a.$slots, "description", {}, () => [
+                o.description ? (m(), h("p", {
                   key: 0,
-                  id: c(w),
+                  id: c(_),
                   class: "vf-dialog__description"
-                }, R(e.description), 9, vt)) : E("", !0)
+                }, R(o.description), 9, nt)) : I("", !0)
               ])
             ]),
-            S("div", pt, [
-              k(y.$slots, "actions", { close: d }),
-              t.closable ? (m(), Y(it, {
+            C("div", at, [
+              $(a.$slots, "actions", { close: x }),
+              e.closable ? (m(), X(Je, {
                 key: 0,
-                icon: c(N).xmark,
+                icon: c(H).xmark,
                 "aria-label": "Close dialog",
                 size: "sm",
-                onClick: d
-              }, null, 8, ["icon"])) : E("", !0)
+                onClick: x
+              }, null, 8, ["icon"])) : I("", !0)
             ])
-          ])) : E("", !0),
-          y.$slots.default ? (m(), h("div", mt, [
-            k(y.$slots, "default", { close: d })
-          ])) : E("", !0),
-          y.$slots.footer ? (m(), h("footer", gt, [
-            k(y.$slots, "footer", { close: d })
-          ])) : E("", !0)
-        ], 10, ut)
-      ])) : E("", !0)
+          ])) : I("", !0),
+          a.$slots.default ? (m(), h("div", st, [
+            $(a.$slots, "default", { close: x })
+          ])) : I("", !0),
+          a.$slots.footer ? (m(), h("footer", lt, [
+            $(a.$slots, "footer", { close: x })
+          ])) : I("", !0)
+        ], 10, et)
+      ])) : I("", !0)
     ]));
   }
-}), ht = ["aria-orientation", "role"], Yt = /* @__PURE__ */ C({
+}), rt = ["aria-orientation", "role"], Lt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfDivider",
   props: {
     orientation: { default: "horizontal" }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(() => o.orientation === "vertical"), n = s(() => A("vf-divider", `vf-divider--${o.orientation}`));
-    return (r, u) => (m(), h("div", M({
+  setup(o) {
+    const t = o, e = P(), s = r(() => t.orientation === "vertical"), n = r(() => S("vf-divider", `vf-divider--${t.orientation}`));
+    return (l, d) => (m(), h("div", F({
       class: n.value,
-      "aria-orientation": o.orientation,
-      role: a.value ? "separator" : void 0
-    }, c(t)), null, 16, ht));
+      "aria-orientation": t.orientation,
+      role: s.value ? "separator" : void 0
+    }, c(e)), null, 16, rt));
   }
-}), yt = { class: "vf-dropdown" }, _t = ["id", "aria-controls", "aria-expanded"], bt = ["id", "aria-labelledby"], Xt = /* @__PURE__ */ C({
+}), it = { class: "vf-dropdown" }, ut = ["id", "aria-controls", "aria-expanded"], ct = ["id", "aria-labelledby"], Rt = /* @__PURE__ */ D({
   __name: "VfDropdown",
   props: {
     open: { type: Boolean, default: void 0 },
@@ -752,148 +568,148 @@ const Ze = {
     closeOnSelect: { type: Boolean, default: !0 }
   },
   emits: ["update:open", "openChange"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = x(null), r = x(null), u = x(null), v = H({ prefix: "vf-dropdown-menu" }), g = H({ prefix: "vf-dropdown-trigger" }), w = J({
-      defaultOpen: t.defaultOpen,
-      open: s(() => t.open),
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = w(null), l = w(null), d = w(null), f = K({ prefix: "vf-dropdown-menu" }), _ = K({ prefix: "vf-dropdown-trigger" }), b = Z({
+      defaultOpen: e.defaultOpen,
+      open: r(() => e.open),
       onOpenChange: (i) => {
-        a("update:open", i), a("openChange", i);
+        s("update:open", i), s("openChange", i);
       }
-    }), f = w.isOpen, $ = s(() => [
+    }), u = b.isOpen, V = r(() => [
       "vf-dropdown__menu",
-      D.value.startsWith("top") && "vf-dropdown__menu--top"
-    ]), T = s(() => {
-      const i = d.value.arrow;
+      x.value.startsWith("top") && "vf-dropdown__menu--top"
+    ]), k = r(() => {
+      const i = p.value.arrow;
       return {
         x: (i == null ? void 0 : i.x) !== void 0 && (i == null ? void 0 : i.baseX) !== void 0 ? i.x - i.baseX : 0,
         y: (i == null ? void 0 : i.y) !== void 0 && (i == null ? void 0 : i.baseY) !== void 0 ? i.y - i.baseY : 0
       };
-    }), V = s(() => ({
-      left: `${T.value.x}px`,
-      top: `${T.value.y}px`
-    })), _ = s(() => [
+    }), O = r(() => ({
+      left: `${k.value.x}px`,
+      top: `${k.value.y}px`
+    })), y = r(() => [
       "vf-dropdown__arrow",
-      D.value.startsWith("top") ? "vf-dropdown__arrow--top" : "vf-dropdown__arrow--bottom"
-    ]), I = s(
-      () => t.placement === "bottom-end" ? ["bottom-end", "top-end"] : ["bottom-start", "top-start"]
-    ), { placement: D, middlewareData: d, styles: O } = se(n, r, {
-      enabled: f,
-      placement: s(() => t.placement),
-      middleware: s(
-        () => [oe(10), ne({ placements: I.value }), ae(), u.value ? re(u.value) : void 0].filter(
+      x.value.startsWith("top") ? "vf-dropdown__arrow--top" : "vf-dropdown__arrow--bottom"
+    ]), B = r(
+      () => e.placement === "bottom-end" ? ["bottom-end", "top-end"] : ["bottom-start", "top-start"]
+    ), { placement: x, middlewareData: p, styles: E } = re(n, l, {
+      enabled: u,
+      placement: r(() => e.placement),
+      middleware: r(
+        () => [oe(10), ne({ placements: B.value }), ae(), d.value ? se(d.value) : void 0].filter(
           (i) => i !== void 0
         )
       ),
       strategy: "fixed"
     });
-    function l() {
+    function a() {
       var i;
-      return Array.from(((i = r.value) == null ? void 0 : i.querySelectorAll('[role="menuitem"]')) ?? []);
+      return Array.from(((i = l.value) == null ? void 0 : i.querySelectorAll('[role="menuitem"]')) ?? []);
     }
-    async function B() {
+    async function T() {
       var i;
-      await Q(), (i = l()[0]) == null || i.focus();
+      await G(), (i = a()[0]) == null || i.focus();
     }
-    function b(i = {}) {
-      w.open(), i.focusFirstItem && B();
+    function g(i = {}) {
+      b.open(), i.focusFirstItem && T();
     }
-    function y() {
+    function L() {
       var i;
-      w.close(), (i = n.value) == null || i.focus();
+      b.close(), (i = n.value) == null || i.focus();
     }
-    function z() {
-      if (f.value) {
-        y();
+    function q() {
+      if (u.value) {
+        L();
         return;
       }
-      b();
+      g();
     }
-    function p(i) {
-      (i.key === "ArrowDown" || i.key === "Enter" || i.key === " ") && (i.preventDefault(), b({ focusFirstItem: !0 }));
+    function v(i) {
+      (i.key === "ArrowDown" || i.key === "Enter" || i.key === " ") && (i.preventDefault(), g({ focusFirstItem: !0 }));
     }
-    function U(i) {
-      var ce, ue, de, fe;
-      const L = l(), ie = L.findIndex((xe) => xe === document.activeElement);
+    function Y(i) {
+      var ue, ce, de, fe;
+      const z = a(), ie = z.findIndex((ye) => ye === document.activeElement);
       if (i.key === "ArrowDown") {
-        i.preventDefault(), (ce = L[(ie + 1 + L.length) % L.length]) == null || ce.focus();
+        i.preventDefault(), (ue = z[(ie + 1 + z.length) % z.length]) == null || ue.focus();
         return;
       }
       if (i.key === "ArrowUp") {
-        i.preventDefault(), (ue = L[(ie - 1 + L.length) % L.length]) == null || ue.focus();
+        i.preventDefault(), (ce = z[(ie - 1 + z.length) % z.length]) == null || ce.focus();
         return;
       }
       if (i.key === "Home") {
-        i.preventDefault(), (de = L[0]) == null || de.focus();
+        i.preventDefault(), (de = z[0]) == null || de.focus();
         return;
       }
-      i.key === "End" && (i.preventDefault(), (fe = L[L.length - 1]) == null || fe.focus());
+      i.key === "End" && (i.preventDefault(), (fe = z[z.length - 1]) == null || fe.focus());
     }
-    function X() {
-      t.closeOnSelect && y();
+    function j() {
+      e.closeOnSelect && L();
     }
-    return ke(
-      [n, r],
+    return he(
+      [n, l],
       () => {
-        f.value && y();
+        u.value && L();
       },
       {
-        enabled: f,
+        enabled: u,
         event: "click"
       }
     ), le(
       (i) => {
-        f.value && (i.preventDefault(), y());
+        u.value && (i.preventDefault(), L());
       },
       {
-        enabled: f
+        enabled: u
       }
-    ), (i, L) => (m(), h("div", yt, [
-      S("div", {
-        id: c(g),
+    ), (i, z) => (m(), h("div", it, [
+      C("div", {
+        id: c(_),
         ref_key: "triggerRef",
         ref: n,
         class: "vf-dropdown__trigger",
-        "aria-controls": c(v),
-        "aria-expanded": c(f),
+        "aria-controls": c(f),
+        "aria-expanded": c(u),
         "aria-haspopup": "menu",
         tabindex: "0",
-        onClick: z,
-        onKeydown: p
+        onClick: q,
+        onKeydown: v
       }, [
-        k(i.$slots, "trigger", {
-          open: c(f),
-          toggle: z
+        $(i.$slots, "trigger", {
+          open: c(u),
+          toggle: q
         })
-      ], 40, _t),
-      (m(), Y(Z, { to: "body" }, [
-        c(f) ? (m(), h("div", {
+      ], 40, ut),
+      (m(), X(J, { to: "body" }, [
+        c(u) ? (m(), h("div", {
           key: 0,
-          id: c(v),
+          id: c(f),
           ref_key: "menuRef",
-          ref: r,
-          class: K($.value),
-          style: j(c(O)),
-          "aria-labelledby": c(g),
+          ref: l,
+          class: M(V.value),
+          style: U(c(E)),
+          "aria-labelledby": c(_),
           role: "menu",
-          onClick: X,
-          onKeydown: U
+          onClick: j,
+          onKeydown: Y
         }, [
-          S("span", {
+          C("span", {
             ref_key: "arrowRef",
-            ref: u,
-            class: K(_.value),
-            style: j(V.value),
+            ref: d,
+            class: M(y.value),
+            style: U(O.value),
             "aria-hidden": "true"
           }, null, 6),
-          k(i.$slots, "default", {
-            close: y,
-            open: c(f)
+          $(i.$slots, "default", {
+            close: L,
+            open: c(u)
           })
-        ], 46, bt)) : E("", !0)
+        ], 46, ct)) : I("", !0)
       ]))
     ]));
   }
-}), $t = ["value", "aria-invalid"], qt = /* @__PURE__ */ C({
+}), dt = ["value", "aria-invalid"], Mt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfInput",
   props: {
@@ -902,24 +718,24 @@ const Ze = {
     invalid: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = F(), r = s(
-      () => A(
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = P(), l = r(
+      () => S(
         "vf-input",
-        t.size !== "md" && `vf-input--${t.size}`,
-        t.invalid && "vf-input--invalid"
+        e.size !== "md" && `vf-input--${e.size}`,
+        e.invalid && "vf-input--invalid"
       )
     );
-    function u(v) {
-      a("update:modelValue", v.target.value);
+    function d(f) {
+      s("update:modelValue", f.target.value);
     }
-    return (v, g) => (m(), h("input", M({
-      class: r.value,
-      value: t.modelValue,
-      "aria-invalid": t.invalid || void 0
-    }, c(n), { onInput: u }), null, 16, $t));
+    return (f, _) => (m(), h("input", F({
+      class: l.value,
+      value: e.modelValue,
+      "aria-invalid": e.invalid || void 0
+    }, c(n), { onInput: d }), null, 16, dt));
   }
-}), wt = ["href", "target", "rel"], Qt = /* @__PURE__ */ C({
+}), ft = ["href", "target", "rel"], Nt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfLink",
   props: {
@@ -929,42 +745,42 @@ const Ze = {
     underline: { type: Boolean, default: !1 },
     tone: { default: "default" }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(() => o.rel ? o.rel : o.target === "_blank" ? "noopener noreferrer" : void 0), n = s(
-      () => A(
+  setup(o) {
+    const t = o, e = P(), s = r(() => t.rel ? t.rel : t.target === "_blank" ? "noopener noreferrer" : void 0), n = r(
+      () => S(
         "vf-link",
-        o.underline && "vf-link--underline",
-        o.tone === "muted" && "vf-link--muted"
+        t.underline && "vf-link--underline",
+        t.tone === "muted" && "vf-link--muted"
       )
     );
-    return (r, u) => (m(), h("a", M({
+    return (l, d) => (m(), h("a", F({
       class: n.value,
-      href: o.href,
-      target: o.target,
-      rel: a.value
-    }, c(t)), [
-      k(r.$slots, "default")
-    ], 16, wt));
+      href: t.href,
+      target: t.target,
+      rel: s.value
+    }, c(e)), [
+      $(l.$slots, "default")
+    ], 16, ft));
   }
-}), kt = { key: 0 }, xt = { class: "vf-panel__title" }, Zt = /* @__PURE__ */ C({
+}), pt = { key: 0 }, vt = { class: "vf-panel__title" }, Wt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfPanel",
   props: {
     title: { default: void 0 },
     subtle: { type: Boolean, default: !1 }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(() => A("vf-panel", o.subtle && "vf-panel--subtle"));
-    return (n, r) => (m(), h("section", M({ class: a.value }, c(t)), [
-      o.title || n.$slots.header ? (m(), h("header", kt, [
-        k(n.$slots, "header", {}, () => [
-          S("h3", xt, R(o.title), 1)
+  setup(o) {
+    const t = o, e = P(), s = r(() => S("vf-panel", t.subtle && "vf-panel--subtle"));
+    return (n, l) => (m(), h("section", F({ class: s.value }, c(e)), [
+      t.title || n.$slots.header ? (m(), h("header", pt, [
+        $(n.$slots, "header", {}, () => [
+          C("h3", vt, R(t.title), 1)
         ])
-      ])) : E("", !0),
-      k(n.$slots, "default")
+      ])) : I("", !0),
+      $(n.$slots, "default")
     ], 16));
   }
-}), Tt = { class: "vf-popover" }, St = ["id", "aria-controls", "aria-expanded"], Vt = ["id", "aria-labelledby"], Jt = /* @__PURE__ */ C({
+}), mt = { class: "vf-popover" }, _t = ["id", "aria-controls", "aria-expanded"], ht = ["id", "aria-labelledby"], Ut = /* @__PURE__ */ D({
   __name: "VfPopover",
   props: {
     open: { type: Boolean, default: void 0 },
@@ -974,147 +790,147 @@ const Ze = {
     closeOnEscape: { type: Boolean, default: !0 }
   },
   emits: ["update:open", "openChange"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = x(null), r = x(null), u = x(null), v = H({ prefix: "vf-popover-content" }), g = H({ prefix: "vf-popover-trigger" }), w = J({
-      defaultOpen: t.defaultOpen,
-      open: s(() => t.open),
-      onOpenChange: (p) => {
-        a("update:open", p), a("openChange", p);
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = w(null), l = w(null), d = w(null), f = K({ prefix: "vf-popover-content" }), _ = K({ prefix: "vf-popover-trigger" }), b = Z({
+      defaultOpen: e.defaultOpen,
+      open: r(() => e.open),
+      onOpenChange: (v) => {
+        s("update:open", v), s("openChange", v);
       }
-    }), f = w.isOpen, $ = s(
-      () => t.placement === "bottom-end" ? ["bottom-end", "top-end"] : ["bottom-start", "top-start"]
-    ), { placement: T, middlewareData: V, styles: _ } = se(n, r, {
-      enabled: f,
-      placement: s(() => t.placement),
-      middleware: s(
-        () => [oe(10), ne({ placements: $.value }), ae(), u.value ? re(u.value) : void 0].filter(
-          (p) => p !== void 0
+    }), u = b.isOpen, V = r(
+      () => e.placement === "bottom-end" ? ["bottom-end", "top-end"] : ["bottom-start", "top-start"]
+    ), { placement: k, middlewareData: O, styles: y } = re(n, l, {
+      enabled: u,
+      placement: r(() => e.placement),
+      middleware: r(
+        () => [oe(10), ne({ placements: V.value }), ae(), d.value ? se(d.value) : void 0].filter(
+          (v) => v !== void 0
         )
       ),
       strategy: "fixed"
-    }), I = s(() => [
+    }), B = r(() => [
       "vf-popover__content",
-      T.value.startsWith("top") && "vf-popover__content--top"
-    ]), D = s(() => {
-      const p = V.value.arrow;
+      k.value.startsWith("top") && "vf-popover__content--top"
+    ]), x = r(() => {
+      const v = O.value.arrow;
       return {
-        x: (p == null ? void 0 : p.x) !== void 0 && (p == null ? void 0 : p.baseX) !== void 0 ? p.x - p.baseX : 0,
-        y: (p == null ? void 0 : p.y) !== void 0 && (p == null ? void 0 : p.baseY) !== void 0 ? p.y - p.baseY : 0
+        x: (v == null ? void 0 : v.x) !== void 0 && (v == null ? void 0 : v.baseX) !== void 0 ? v.x - v.baseX : 0,
+        y: (v == null ? void 0 : v.y) !== void 0 && (v == null ? void 0 : v.baseY) !== void 0 ? v.y - v.baseY : 0
       };
-    }), d = s(() => ({
-      left: `${D.value.x}px`,
-      top: `${D.value.y}px`
-    })), O = s(() => [
+    }), p = r(() => ({
+      left: `${x.value.x}px`,
+      top: `${x.value.y}px`
+    })), E = r(() => [
       "vf-popover__arrow",
-      T.value.startsWith("top") ? "vf-popover__arrow--top" : "vf-popover__arrow--bottom"
+      k.value.startsWith("top") ? "vf-popover__arrow--top" : "vf-popover__arrow--bottom"
     ]);
-    async function l() {
-      var U, X;
-      await Q();
-      const p = (U = r.value) == null ? void 0 : U.querySelector("[autofocus], [data-autofocus]");
-      if (p) {
-        p.focus();
+    async function a() {
+      var Y, j;
+      await G();
+      const v = (Y = l.value) == null ? void 0 : Y.querySelector("[autofocus], [data-autofocus]");
+      if (v) {
+        v.focus();
         return;
       }
-      (X = r.value) == null || X.focus();
+      (j = l.value) == null || j.focus();
     }
-    function B() {
-      w.open(), l();
+    function T() {
+      b.open(), a();
     }
-    function b() {
-      var p;
-      w.close(), (p = n.value) == null || p.focus();
+    function g() {
+      var v;
+      b.close(), (v = n.value) == null || v.focus();
     }
-    function y() {
-      if (f.value) {
-        b();
+    function L() {
+      if (u.value) {
+        g();
         return;
       }
-      B();
+      T();
     }
-    function z(p) {
-      (p.key === "Enter" || p.key === " ") && (p.preventDefault(), y()), p.key === "ArrowDown" && (p.preventDefault(), B());
+    function q(v) {
+      (v.key === "Enter" || v.key === " ") && (v.preventDefault(), L()), v.key === "ArrowDown" && (v.preventDefault(), T());
     }
-    return ke(
-      [n, r],
+    return he(
+      [n, l],
       () => {
-        f.value && t.closeOnOutsideClick && b();
+        u.value && e.closeOnOutsideClick && g();
       },
       {
-        enabled: f,
+        enabled: u,
         event: "click"
       }
     ), le(
-      (p) => {
-        !f.value || !t.closeOnEscape || (p.preventDefault(), b());
+      (v) => {
+        !u.value || !e.closeOnEscape || (v.preventDefault(), g());
       },
       {
-        enabled: f
+        enabled: u
       }
-    ), (p, U) => (m(), h("div", Tt, [
-      S("div", {
-        id: c(g),
+    ), (v, Y) => (m(), h("div", mt, [
+      C("div", {
+        id: c(_),
         ref_key: "triggerRef",
         ref: n,
         class: "vf-popover__trigger",
-        "aria-controls": c(v),
-        "aria-expanded": c(f),
+        "aria-controls": c(f),
+        "aria-expanded": c(u),
         "aria-haspopup": "dialog",
         tabindex: "0",
-        onClick: y,
-        onKeydown: z
+        onClick: L,
+        onKeydown: q
       }, [
-        k(p.$slots, "trigger", {
-          open: c(f),
-          toggle: y
+        $(v.$slots, "trigger", {
+          open: c(u),
+          toggle: L
         })
-      ], 40, St),
-      (m(), Y(Z, { to: "body" }, [
-        c(f) ? (m(), h("section", {
+      ], 40, _t),
+      (m(), X(J, { to: "body" }, [
+        c(u) ? (m(), h("section", {
           key: 0,
-          id: c(v),
+          id: c(f),
           ref_key: "contentRef",
-          ref: r,
-          class: K(I.value),
-          style: j(c(_)),
-          "aria-labelledby": c(g),
+          ref: l,
+          class: M(B.value),
+          style: U(c(y)),
+          "aria-labelledby": c(_),
           role: "dialog",
           tabindex: "-1"
         }, [
-          S("span", {
+          C("span", {
             ref_key: "arrowRef",
-            ref: u,
-            class: K(O.value),
-            style: j(d.value),
+            ref: d,
+            class: M(E.value),
+            style: U(p.value),
             "aria-hidden": "true"
           }, null, 6),
-          k(p.$slots, "default", {
-            open: c(f),
-            close: b
+          $(v.$slots, "default", {
+            open: c(u),
+            close: g
           })
-        ], 14, Vt)) : E("", !0)
+        ], 14, ht)) : I("", !0)
       ]))
     ]));
   }
-}), eo = /* @__PURE__ */ C({
+}), Yt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfTag",
   props: {
     tone: { default: "neutral" }
   },
-  setup(e) {
-    const o = e, t = F(), a = s(
-      () => A("vf-tag", o.tone !== "neutral" && `vf-tag--${o.tone}`)
+  setup(o) {
+    const t = o, e = P(), s = r(
+      () => S("vf-tag", t.tone !== "neutral" && `vf-tag--${t.tone}`)
     );
-    return (n, r) => (m(), h("span", M({ class: a.value }, c(t)), [
-      k(n.$slots, "default")
+    return (n, l) => (m(), h("span", F({ class: s.value }, c(e)), [
+      $(n.$slots, "default")
     ], 16));
   }
-}), Ct = { class: "vf-tabs" }, Et = {
+}), yt = { class: "vf-tabs" }, bt = {
   class: "vf-tabs__list",
   role: "tablist",
   "aria-orientation": "horizontal"
-}, Ot = ["id", "aria-controls", "aria-selected", "disabled", "tabindex", "onClick", "onKeydown"], Bt = ["id", "aria-labelledby"], to = /* @__PURE__ */ C({
+}, gt = ["id", "aria-controls", "aria-selected", "disabled", "tabindex", "onClick", "onKeydown"], $t = ["id", "aria-labelledby"], Ht = /* @__PURE__ */ D({
   __name: "VfTabs",
   props: {
     items: {},
@@ -1122,99 +938,99 @@ const Ze = {
     defaultValue: { default: void 0 }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = H({ prefix: "vf-tabs" }), r = x([]), u = s(() => {
-      var d;
-      return (d = t.items.find((O) => !O.disabled)) == null ? void 0 : d.value;
-    }), v = x(t.defaultValue ?? u.value), g = s(() => t.modelValue !== void 0), w = s(() => t.modelValue ?? v.value ?? u.value);
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = K({ prefix: "vf-tabs" }), l = w([]), d = r(() => {
+      var p;
+      return (p = e.items.find((E) => !E.disabled)) == null ? void 0 : p.value;
+    }), f = w(e.defaultValue ?? d.value), _ = r(() => e.modelValue !== void 0), b = r(() => e.modelValue ?? f.value ?? d.value);
     W(
-      () => t.items,
-      (d) => {
-        !d.some((l) => l.value === w.value && !l.disabled) && u.value && f(u.value);
+      () => e.items,
+      (p) => {
+        !p.some((a) => a.value === b.value && !a.disabled) && d.value && u(d.value);
       },
       { deep: !0 }
     );
-    function f(d) {
-      g.value || (v.value = d), a("update:modelValue", d), a("change", d);
+    function u(p) {
+      _.value || (f.value = p), s("update:modelValue", p), s("change", p);
     }
-    function $(d) {
-      d.disabled || f(d.value);
+    function V(p) {
+      p.disabled || u(p.value);
     }
-    function T() {
-      return t.items.filter((d) => !d.disabled);
+    function k() {
+      return e.items.filter((p) => !p.disabled);
     }
-    function V(d) {
-      var l;
-      const O = t.items.findIndex((B) => B.value === d);
-      (l = r.value[O]) == null || l.focus();
+    function O(p) {
+      var a;
+      const E = e.items.findIndex((T) => T.value === p);
+      (a = l.value[E]) == null || a.focus();
     }
-    function _(d, O) {
-      const l = T(), B = l.findIndex((b) => b.value === O.value);
-      if (B !== -1) {
-        if (d.key === "ArrowRight" || d.key === "ArrowDown") {
-          d.preventDefault();
-          const b = l[(B + 1) % l.length];
-          $(b), V(b.value);
+    function y(p, E) {
+      const a = k(), T = a.findIndex((g) => g.value === E.value);
+      if (T !== -1) {
+        if (p.key === "ArrowRight" || p.key === "ArrowDown") {
+          p.preventDefault();
+          const g = a[(T + 1) % a.length];
+          V(g), O(g.value);
           return;
         }
-        if (d.key === "ArrowLeft" || d.key === "ArrowUp") {
-          d.preventDefault();
-          const b = l[(B - 1 + l.length) % l.length];
-          $(b), V(b.value);
+        if (p.key === "ArrowLeft" || p.key === "ArrowUp") {
+          p.preventDefault();
+          const g = a[(T - 1 + a.length) % a.length];
+          V(g), O(g.value);
           return;
         }
-        if (d.key === "Home") {
-          d.preventDefault();
-          const b = l[0];
-          $(b), V(b.value);
+        if (p.key === "Home") {
+          p.preventDefault();
+          const g = a[0];
+          V(g), O(g.value);
           return;
         }
-        if (d.key === "End") {
-          d.preventDefault();
-          const b = l[l.length - 1];
-          $(b), V(b.value);
+        if (p.key === "End") {
+          p.preventDefault();
+          const g = a[a.length - 1];
+          V(g), O(g.value);
         }
       }
     }
-    function I(d) {
-      return `${n.value}-tab-${d}`;
+    function B(p) {
+      return `${n.value}-tab-${p}`;
     }
-    function D(d) {
-      return `${n.value}-panel-${d}`;
+    function x(p) {
+      return `${n.value}-panel-${p}`;
     }
-    return (d, O) => (m(), h("div", Ct, [
-      S("div", Et, [
-        (m(!0), h(Ve, null, Ce(e.items, (l, B) => (m(), h("button", {
-          id: I(l.value),
-          key: l.value,
+    return (p, E) => (m(), h("div", yt, [
+      C("div", bt, [
+        (m(!0), h(Ce, null, Oe(o.items, (a, T) => (m(), h("button", {
+          id: B(a.value),
+          key: a.value,
           ref_for: !0,
-          ref: (b) => {
-            r.value[B] = b;
+          ref: (g) => {
+            l.value[T] = g;
           },
-          "aria-controls": D(l.value),
-          "aria-selected": w.value === l.value,
-          disabled: l.disabled,
-          tabindex: w.value === l.value ? 0 : -1,
+          "aria-controls": x(a.value),
+          "aria-selected": b.value === a.value,
+          disabled: a.disabled,
+          tabindex: b.value === a.value ? 0 : -1,
           class: "vf-tabs__tab",
           role: "tab",
           type: "button",
-          onClick: (b) => $(l),
-          onKeydown: (b) => _(b, l)
-        }, R(l.label), 41, Ot))), 128))
+          onClick: (g) => V(a),
+          onKeydown: (g) => y(g, a)
+        }, R(a.label), 41, gt))), 128))
       ]),
-      w.value ? (m(), h("div", {
+      b.value ? (m(), h("div", {
         key: 0,
-        id: D(w.value),
-        "aria-labelledby": I(w.value),
+        id: x(b.value),
+        "aria-labelledby": B(b.value),
         class: "vf-tabs__panel",
         role: "tabpanel",
         tabindex: "0"
       }, [
-        k(d.$slots, "panel", Ee(Oe({ activeValue: w.value })))
-      ], 8, Bt)) : E("", !0)
+        $(p.$slots, "panel", De(Ie({ activeValue: b.value })))
+      ], 8, $t)) : I("", !0)
     ]));
   }
-}), It = ["value", "aria-invalid"], oo = /* @__PURE__ */ C({
+}), wt = ["value", "aria-invalid"], Xt = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "VfTextarea",
   props: {
@@ -1223,142 +1039,149 @@ const Ze = {
     invalid: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: o }) {
-    const t = e, a = o, n = F(), r = s(
-      () => A(
+  setup(o, { emit: t }) {
+    const e = o, s = t, n = P(), l = r(
+      () => S(
         "vf-textarea",
-        t.size !== "md" && `vf-textarea--${t.size}`,
-        t.invalid && "vf-textarea--invalid"
+        e.size !== "md" && `vf-textarea--${e.size}`,
+        e.invalid && "vf-textarea--invalid"
       )
     );
-    function u(v) {
-      a("update:modelValue", v.target.value);
+    function d(f) {
+      s("update:modelValue", f.target.value);
     }
-    return (v, g) => (m(), h("textarea", M({
-      class: r.value,
-      value: t.modelValue,
-      "aria-invalid": t.invalid || void 0
-    }, c(n), { onInput: u }), null, 16, It));
+    return (f, _) => (m(), h("textarea", F({
+      class: l.value,
+      value: e.modelValue,
+      "aria-invalid": e.invalid || void 0
+    }, c(n), { onInput: d }), null, 16, wt));
   }
-}), Dt = ["aria-describedby"], Pt = ["id"], no = /* @__PURE__ */ C({
+}), kt = ["aria-describedby"], Vt = ["id"], qt = /* @__PURE__ */ D({
   __name: "VfTooltip",
   props: {
     text: { default: void 0 },
     placement: { default: "top" },
     openDelay: { default: 80 }
   },
-  setup(e) {
-    const o = e, t = x(!1), a = H({ prefix: "vf-tooltip" }), n = x(null), r = x(null), u = x(null), v = x(null), { placement: g, middlewareData: w, styles: f, cleanup: $ } = se(
-      r,
-      u,
+  setup(o) {
+    const t = o, e = w(!1), s = K({ prefix: "vf-tooltip" }), n = w(null), l = w(null), d = w(null), f = w(null), { placement: _, middlewareData: b, styles: u, cleanup: V } = re(
+      l,
+      d,
       {
-        enabled: t,
-        placement: s(() => o.placement),
-        middleware: s(
-          () => [oe(10), ne({ placements: ["top", "bottom"] }), ae(), v.value ? re(v.value) : void 0].filter(
-            (l) => l !== void 0
+        enabled: e,
+        placement: r(() => t.placement),
+        middleware: r(
+          () => [oe(10), ne({ placements: ["top", "bottom"] }), ae(), f.value ? se(f.value) : void 0].filter(
+            (a) => a !== void 0
           )
         ),
         strategy: "fixed"
       }
-    ), T = s(
+    ), k = r(
       () => [
         "vf-tooltip__content",
-        g.value.startsWith("bottom") && "vf-tooltip__content--bottom",
-        g.value.startsWith("top") && "vf-tooltip__content--top"
+        _.value.startsWith("bottom") && "vf-tooltip__content--bottom",
+        _.value.startsWith("top") && "vf-tooltip__content--top"
       ]
-    ), V = s(() => {
-      const l = w.value.arrow;
+    ), O = r(() => {
+      const a = b.value.arrow;
       return {
-        x: (l == null ? void 0 : l.x) !== void 0 && (l == null ? void 0 : l.baseX) !== void 0 ? l.x - l.baseX : 0,
-        y: (l == null ? void 0 : l.y) !== void 0 && (l == null ? void 0 : l.baseY) !== void 0 ? l.y - l.baseY : 0
+        x: (a == null ? void 0 : a.x) !== void 0 && (a == null ? void 0 : a.baseX) !== void 0 ? a.x - a.baseX : 0,
+        y: (a == null ? void 0 : a.y) !== void 0 && (a == null ? void 0 : a.baseY) !== void 0 ? a.y - a.baseY : 0
       };
-    }), _ = s(() => ["vf-tooltip__arrow"]), I = s(() => ({
-      left: `${V.value.x}px`,
-      top: `${V.value.y}px`
+    }), y = r(() => ["vf-tooltip__arrow"]), B = r(() => ({
+      left: `${O.value.x}px`,
+      top: `${O.value.y}px`
     }));
-    function D() {
+    function x() {
       n.value !== null && (window.clearTimeout(n.value), n.value = null);
     }
-    function d() {
-      D(), n.value = window.setTimeout(() => {
-        t.value = !0;
-      }, o.openDelay);
+    function p() {
+      x(), n.value = window.setTimeout(() => {
+        e.value = !0;
+      }, t.openDelay);
     }
-    function O() {
-      D(), t.value = !1;
+    function E() {
+      x(), e.value = !1;
     }
-    return G(() => {
-      D(), $();
-    }), (l, B) => (m(), h("span", {
+    return N(() => {
+      x(), V();
+    }), (a, T) => (m(), h("span", {
       class: "vf-tooltip",
-      onMouseenter: d,
-      onMouseleave: O,
-      onFocusin: d,
-      onFocusout: O
+      onMouseenter: p,
+      onMouseleave: E,
+      onFocusin: p,
+      onFocusout: E
     }, [
-      S("span", {
+      C("span", {
         ref_key: "triggerRef",
-        ref: r,
+        ref: l,
         class: "vf-tooltip__trigger",
-        "aria-describedby": t.value ? c(a) : void 0
+        "aria-describedby": e.value ? c(s) : void 0
       }, [
-        k(l.$slots, "default")
-      ], 8, Dt),
-      (m(), Y(Z, { to: "body" }, [
-        t.value && (e.text || l.$slots.content) ? (m(), h("span", {
+        $(a.$slots, "default")
+      ], 8, kt),
+      (m(), X(J, { to: "body" }, [
+        e.value && (o.text || a.$slots.content) ? (m(), h("span", {
           key: 0,
-          id: c(a),
+          id: c(s),
           ref_key: "contentRef",
-          ref: u,
-          class: K(T.value),
-          style: j(c(f)),
+          ref: d,
+          class: M(k.value),
+          style: U(c(u)),
           role: "tooltip"
         }, [
-          k(l.$slots, "content", {}, () => [
-            he(R(e.text), 1)
+          $(a.$slots, "content", {}, () => [
+            ve(R(o.text), 1)
           ]),
-          S("span", {
+          C("span", {
             ref_key: "arrowRef",
-            ref: v,
-            class: K(_.value),
-            style: j(I.value),
+            ref: f,
+            class: M(y.value),
+            style: U(B.value),
             "aria-hidden": "true"
           }, null, 6)
-        ], 14, Pt)) : E("", !0)
+        ], 14, Vt)) : I("", !0)
       ]))
     ], 32));
   }
 });
 export {
-  Kt as VfAccordion,
-  Gt as VfAlert,
-  Wt as VfBadge,
-  jt as VfButton,
-  Ut as VfCard,
-  Nt as VfDialog,
-  Yt as VfDivider,
-  Xt as VfDropdown,
-  it as VfIconButton,
-  qt as VfInput,
-  Qt as VfLink,
-  Zt as VfPanel,
-  Jt as VfPopover,
-  to as VfTabs,
-  eo as VfTag,
-  oo as VfTextarea,
-  Ht as VfThemeProvider,
-  no as VfTooltip,
-  Mt as VueForge,
-  Ft as createThemePreset,
-  We as createVueForge,
-  Mt as default,
-  De as defaultThemePreset,
-  ke as useClickOutside,
-  J as useDisclosure,
+  At as VfAccordion,
+  St as VfAlert,
+  zt as VfBadge,
+  Pt as VfButton,
+  Ft as VfCard,
+  Kt as VfDialog,
+  Lt as VfDivider,
+  Rt as VfDropdown,
+  Je as VfIconButton,
+  Mt as VfInput,
+  Nt as VfLink,
+  Wt as VfPanel,
+  Ut as VfPopover,
+  Ht as VfTabs,
+  Yt as VfTag,
+  Xt as VfTextarea,
+  Et as VfThemeProvider,
+  qt as VfTooltip,
+  It as VueForge,
+  Gt as createThemePreset,
+  Se as createVueForge,
+  It as default,
+  Jt as defaultThemePreset,
+  eo as toMaxWidthQuery,
+  to as toMinWidthQuery,
+  oo as useBreakpoint,
+  no as useBreakpointValue,
+  ao as useBreakpoints,
+  he as useClickOutside,
+  Z as useDisclosure,
   le as useEscapeKey,
-  se as useFloating,
-  Ne as useFocusTrap,
-  H as useId,
-  Rt as useTheme
+  re as useFloating,
+  Fe as useFocusTrap,
+  K as useId,
+  Ee as useScrollLock,
+  Bt as useTheme,
+  so as vfBreakpoints
 };