@maltjoy/core-vue 3.5.0 → 3.5.1

package/dist/joy-vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as $, openBlock as v, createElementBlock as p, normalizeClass as S, renderSlot as h, createTextVNode as C, toDisplayString as I, createElementVNode as b, useAttrs as De, computed as B, createBlock as x, resolveDynamicComponent as ce, unref as _, withCtx as L, createCommentVNode as w, ref as g, createVNode as N, mergeProps as Y, getCurrentScope as lt, onScopeDispose as ot, getCurrentInstance as nt, onMounted as X, nextTick as Re, watch as P, h as at, reactive as te, onBeforeUnmount as Me, normalizeStyle as Z, Fragment as fe, renderList as ye, normalizeProps as me, guardReactiveProps as ve, Teleport as it, createSlots as Ne, useSlots as G, onBeforeMount as rt, inject as st, provide as ut, pushScopeId as dt, popScopeId as ct } from "vue";
+import { defineComponent as $, openBlock as v, createElementBlock as p, normalizeClass as k, renderSlot as b, createTextVNode as L, toDisplayString as x, useAttrs as Re, computed as I, createBlock as T, resolveDynamicComponent as ce, unref as _, withCtx as E, createCommentVNode as w, createElementVNode as h, ref as g, mergeProps as Q, createVNode as fe, pushScopeId as te, popScopeId as le, getCurrentScope as nt, onScopeDispose as at, getCurrentInstance as it, onMounted as Z, nextTick as Me, watch as C, h as rt, reactive as X, onBeforeUnmount as Ne, normalizeStyle as K, Fragment as ye, renderList as me, normalizeProps as ve, guardReactiveProps as pe, Teleport as st, createSlots as He, useSlots as W, onBeforeMount as ut, inject as dt, provide as ct } from "vue";
 const ft = ["info", "gray", "green", "orange", "red", "teal", "turquoise", "pink", "dark-blue", "yellow"], yt = /* @__PURE__ */ $({
   __name: "VJoyBadge",
   props: {
@@ -28,11 +28,11 @@ const ft = ["info", "gray", "green", "orange", "red", "teal", "turquoise", "pink
   },
   setup(e) {
     return (l, t) => (v(), p("span", {
-      class: S(["joy-badge", `joy-badge__${e.variant}`, { "joy-badge--with-bulletpoint": e.bulletpoint }]),
+      class: k(["joy-badge", `joy-badge__${e.variant}`, { "joy-badge--with-bulletpoint": e.bulletpoint }]),
       role: "status"
     }, [
-      h(l.$slots, "default", {}, () => [
-        C(I(e.label), 1)
+      b(l.$slots, "default", {}, () => [
+        L(x(e.label), 1)
       ], !0)
     ], 2));
   }
@@ -54,37 +54,11 @@ const V = (e, l) => {
   },
   setup(e) {
     return (l, t) => (v(), p("div", {
-      class: S(["joy-spinner", `joy-spinner_${e.color}`])
+      class: k(["joy-spinner", `joy-spinner_${e.color}`])
     }, null, 2));
   }
 });
-const He = /* @__PURE__ */ V(pt, [["__scopeId", "data-v-616a29d0"]]), D = /* @__PURE__ */ $({
-  __name: "VJoyIcon",
-  props: {
-    name: {
-      type: String,
-      required: !0
-    },
-    color: {
-      type: String,
-      default: "secondary"
-    },
-    size: {
-      type: String,
-      default: "xsmall"
-    }
-  },
-  setup(e) {
-    return (l, t) => (v(), p("span", {
-      class: S(["joy-icon", `joy-icon--${e.color}`, `joy-icon--${e.size}`])
-    }, [
-      b("i", {
-        class: S(["icon", `icon-${e.name}`])
-      }, null, 2)
-    ], 2));
-  }
-});
-const ht = ["primary", "secondary"], bt = ["neutral", "success", "info", "warning", "error"], gt = ["main", "admin", "ghost", "white"], _t = [...ht, ...gt], wt = ["large", "medium", "small", "xsmall", "xxsmall"], St = { class: "joy-button--slot" }, kt = /* @__PURE__ */ $({
+const We = /* @__PURE__ */ V(pt, [["__scopeId", "data-v-616a29d0"]]), ht = ["primary", "secondary"], bt = ["neutral", "success", "info", "warning", "error"], gt = ["main", "admin", "ghost", "white"], _t = [...ht, ...gt], wt = ["large", "medium", "small", "xsmall", "xxsmall"], St = ["name", "size"], jt = { class: "joy-button--slot" }, kt = ["name", "size"], $t = /* @__PURE__ */ $({
   __name: "VJoyButton",
   props: {
     /**
@@ -96,9 +70,7 @@ const ht = ["primary", "secondary"], bt = ["neutral", "success", "info", "warnin
       default: !1
     },
     /** Name of the icon, placed before the text */
-    icon: {
-      type: String
-    },
+    icon: String,
     /** Left to the text or right */
     iconPosition: {
       type: String,
@@ -133,7 +105,7 @@ const ht = ["primary", "secondary"], bt = ["neutral", "success", "info", "warnin
     }
   },
   setup(e) {
-    const l = e, t = De(), o = B(() => {
+    const l = e, t = Re(), o = I(() => {
       switch (l.size) {
         case "xxsmall":
           return "xxsmall";
@@ -144,11 +116,11 @@ const ht = ["primary", "secondary"], bt = ["neutral", "success", "info", "warnin
         default:
           return "small";
       }
-    }), a = B(() => ["white", "ghost", "secondary"].includes(l.variant) ? "teal" : "white");
-    return (r, s) => (v(), x(ce(_(t).href ? "a" : "button"), {
+    }), a = I(() => ["white", "ghost", "secondary"].includes(l.variant) ? "teal" : "white");
+    return (r, s) => (v(), T(ce(_(t).href ? "a" : "button"), {
       disabled: e.loading || _(t).disabled,
       type: _(t).type || "button",
-      class: S([
+      class: k([
         "joy-button",
         `joy-button_${e.variant}`,
         `joy-button_${e.size}`,
@@ -158,34 +130,36 @@ const ht = ["primary", "secondary"], bt = ["neutral", "success", "info", "warnin
         }
       ])
     }, {
-      default: L(() => [
-        e.icon && e.iconPosition === "left" ? (v(), x(D, {
+      default: E(() => [
+        e.icon && e.iconPosition === "left" ? (v(), p("joy-icon", {
           key: 0,
           class: "joy-button_icon joy-button_icon--left",
           name: e.icon,
-          size: _(o)
-        }, null, 8, ["name", "size"])) : w("", !0),
-        e.loading ? (v(), x(He, {
+          size: _(o),
+          lazy: !1
+        }, null, 8, St)) : w("", !0),
+        e.loading ? (v(), T(We, {
           key: 1,
           color: _(a)
         }, null, 8, ["color"])) : w("", !0),
-        b("span", St, [
-          h(r.$slots, "default", {}, () => [
-            C(I(e.label), 1)
+        h("span", jt, [
+          b(r.$slots, "default", {}, () => [
+            L(x(e.label), 1)
           ], !0)
         ]),
-        e.icon && e.iconPosition === "right" ? (v(), x(D, {
+        e.icon && e.iconPosition === "right" ? (v(), p("joy-icon", {
           key: 2,
           class: "joy-button_icon joy-button_icon--right",
           name: e.icon,
-          size: _(o)
-        }, null, 8, ["name", "size"])) : w("", !0)
+          size: _(o),
+          lazy: !1
+        }, null, 8, kt)) : w("", !0)
       ]),
       _: 3
     }, 8, ["disabled", "type", "class"]));
   }
 });
-const jt = /* @__PURE__ */ V(kt, [["__scopeId", "data-v-ae0676bb"]]), $t = ["aria-checked", "aria-hidden"], Vt = { class: "joy-checkbox__input-wrapper" }, xt = ["id", "name", "disabled", "checked", "required", "aria-checked", "value", "indeterminate"], It = { class: "joy-checkbox__content-wrapper" }, Ot = { class: "joy-checkbox__content" }, Bt = /* @__PURE__ */ $({
+const Vt = /* @__PURE__ */ V($t, [["__scopeId", "data-v-44b223fb"]]), xt = ["aria-checked", "aria-hidden"], Ot = { class: "joy-checkbox__input-wrapper" }, It = ["id", "name", "disabled", "checked", "required", "aria-checked", "value", "indeterminate"], Bt = { class: "joy-checkbox__content-wrapper" }, Et = { class: "joy-checkbox__content" }, Lt = /* @__PURE__ */ $({
   __name: "VJoyCheckbox",
   props: {
     /** Can't be used in addition of v-model. See usage : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes */
@@ -252,8 +226,8 @@ const jt = /* @__PURE__ */ V(kt, [["__scopeId", "data-v-ae0676bb"]]), $t = ["ari
       "aria-checked": e.checked,
       "aria-hidden": e.disabled
     }, [
-      b("label", {
-        class: S([
+      h("label", {
+        class: k([
           "joy-checkbox",
           {
             "joy-checkbox__checked": e.checked,
@@ -263,8 +237,8 @@ const jt = /* @__PURE__ */ V(kt, [["__scopeId", "data-v-ae0676bb"]]), $t = ["ari
           }
         ])
       }, [
-        b("div", Vt, [
-          b("input", {
+        h("div", Ot, [
+          h("input", {
             id: e.id,
             ref_key: "input",
             ref: a,
@@ -284,27 +258,39 @@ const jt = /* @__PURE__ */ V(kt, [["__scopeId", "data-v-ae0676bb"]]), $t = ["ari
             (...u) => n.onFocus && n.onFocus(...u)),
             onBlur: f[2] || (f[2] = //@ts-ignore
             (...u) => n.onBlur && n.onBlur(...u))
-          }, null, 40, xt)
+          }, null, 40, It)
         ]),
-        b("div", It, [
-          h(c.$slots, "default", {}, () => [
-            C(I(e.label), 1)
+        h("div", Bt, [
+          b(c.$slots, "default", {}, () => [
+            L(x(e.label), 1)
           ], !0),
-          b("div", Ot, [
-            h(c.$slots, "checkbox-content", {}, void 0, !0)
+          h("div", Et, [
+            b(c.$slots, "checkbox-content", {}, void 0, !0)
           ])
         ])
       ], 2)
-    ], 8, $t));
+    ], 8, xt));
   }
 });
-const pe = /* @__PURE__ */ V(Bt, [["__scopeId", "data-v-e8b172ed"]]), Et = { class: "joy-counter" }, Lt = ["aria-label", "disabled"], Ct = { class: "joy-counter__input-wrapper" }, Pt = ["id", "min", "max", "aria-invalid", "name", "required", "value"], Jt = ["aria-label", "disabled"], Tt = {
+const he = /* @__PURE__ */ V(Lt, [["__scopeId", "data-v-e8b172ed"]]), Ue = (e) => (te("data-v-9aab3fa1"), e = e(), le(), e), Ct = { class: "joy-counter" }, Pt = ["aria-label", "disabled"], Jt = /* @__PURE__ */ Ue(() => /* @__PURE__ */ h("joy-icon", {
+  name: "minus",
+  color: "teal",
+  lazy: !1
+}, null, -1)), Tt = [
+  Jt
+], qt = { class: "joy-counter__input-wrapper" }, zt = ["id", "min", "max", "aria-invalid", "name", "required", "value"], At = ["aria-label", "disabled"], Ft = /* @__PURE__ */ Ue(() => /* @__PURE__ */ h("joy-icon", {
+  name: "add",
+  lazy: !1,
+  color: "teal"
+}, null, -1)), Dt = [
+  Ft
+], Rt = {
   key: 0,
   class: "joy-counter_error"
-}, qt = {
+}, Mt = {
   inheritAttrs: !1
-}, zt = /* @__PURE__ */ $({
-  ...qt,
+}, Nt = /* @__PURE__ */ $({
+  ...Mt,
   __name: "VJoyCounter",
   props: {
     /** Removes any interactivity */
@@ -384,8 +370,8 @@ const pe = /* @__PURE__ */ V(Bt, [["__scopeId", "data-v-e8b172ed"]]), Et = { cla
       a.value = !u();
     }
     function f(d = !0) {
-      const j = o.step.toString().split("."), k = j.length === 2 ? j[1].length : 0;
-      return parseFloat(d ? (o.modelValue + o.step).toFixed(k) : (o.modelValue - o.step).toFixed(k));
+      const j = o.step.toString().split("."), S = j.length === 2 ? j[1].length : 0;
+      return parseFloat(d ? (o.modelValue + o.step).toFixed(S) : (o.modelValue - o.step).toFixed(S));
     }
     function u() {
       return m() && i();
@@ -409,35 +395,33 @@ const pe = /* @__PURE__ */ V(Bt, [["__scopeId", "data-v-e8b172ed"]]), Et = { cla
     };
     return l({
       props: o
-    }), (d, j) => (v(), p("div", Et, [
-      e.label ? (v(), x(_(W), {
+    }), (d, j) => (v(), p("div", Ct, [
+      e.label ? (v(), T(_(N), {
         key: 0,
         for: e.id,
         required: e.required && e.requiredMark,
         "optional-label": e.optionalLabel,
         size: e.labelSize
       }, {
-        default: L(() => [
-          h(d.$slots, "default", {}, () => [
-            C(I(e.label), 1)
+        default: E(() => [
+          b(d.$slots, "default", {}, () => [
+            L(x(e.label), 1)
           ], !0)
         ]),
         _: 3
       }, 8, ["for", "required", "optional-label", "size"])) : w("", !0),
-      b("div", {
-        class: S(["joy-counter__wrapper", { "joy-counter--focusing": r.value }])
+      h("div", {
+        class: k(["joy-counter__wrapper", { "joy-counter--focusing": r.value }])
       }, [
-        b("button", {
+        h("button", {
           class: "joy-counter__decrement",
           type: "button",
           "aria-label": e.labelDecrement,
           disabled: e.modelValue <= e.min,
           onClick: s
-        }, [
-          N(_(D), { name: "minus" })
-        ], 8, Lt),
-        b("div", Ct, [
-          b("input", Y({
+        }, Tt, 8, Pt),
+        h("div", qt, [
+          h("input", Q({
             id: e.id,
             ref: "input",
             type: "number",
@@ -451,37 +435,35 @@ const pe = /* @__PURE__ */ V(Bt, [["__scopeId", "data-v-e8b172ed"]]), Et = { cla
             value: e.modelValue
           }, d.$attrs, {
             onInput: j[0] || (j[0] = //@ts-ignore
-            (...k) => y.onInput && y.onInput(...k)),
+            (...S) => y.onInput && y.onInput(...S)),
             onBlur: j[1] || (j[1] = //@ts-ignore
-            (...k) => y.onBlur && y.onBlur(...k)),
+            (...S) => y.onBlur && y.onBlur(...S)),
             onFocus: j[2] || (j[2] = //@ts-ignore
-            (...k) => y.onFocus && y.onFocus(...k))
-          }), null, 16, Pt)
+            (...S) => y.onFocus && y.onFocus(...S))
+          }), null, 16, zt)
         ]),
-        b("button", {
+        h("button", {
           class: "joy-counter__increment",
           type: "button",
           "aria-label": e.labelIncrement,
           disabled: e.max ? e.modelValue >= e.max : !1,
           onClick: n
-        }, [
-          N(_(D), { name: "add" })
-        ], 8, Jt),
-        e.invalid && e.errorMessage ? (v(), p("div", Tt, [
-          N(_(Xe), { "no-html-error-text": e.errorMessage }, null, 8, ["no-html-error-text"])
+        }, Dt, 8, At),
+        e.invalid && e.errorMessage ? (v(), p("div", Rt, [
+          fe(_(tt), { "no-html-error-text": e.errorMessage }, null, 8, ["no-html-error-text"])
         ])) : w("", !0)
       ], 2)
     ]));
   }
 });
-const At = /* @__PURE__ */ V(zt, [["__scopeId", "data-v-a59ac0ad"]]);
-var ge;
-const K = typeof window < "u", We = (e) => typeof e == "string", z = () => {
-}, le = K && ((ge = window == null ? void 0 : window.navigator) == null ? void 0 : ge.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
-function J(e) {
+const Ht = /* @__PURE__ */ V(Nt, [["__scopeId", "data-v-9aab3fa1"]]);
+var _e;
+const U = typeof window < "u", Ge = (e) => typeof e == "string", z = () => {
+}, ee = U && ((_e = window == null ? void 0 : window.navigator) == null ? void 0 : _e.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
+function P(e) {
   return typeof e == "function" ? e() : _(e);
 }
-function Ue(e, l) {
+function Ke(e, l) {
   function t(...o) {
     return new Promise((a, r) => {
       Promise.resolve(e(() => l.apply(this, o), { fn: l, thisArg: this, args: o })).then(a).catch(r);
@@ -489,13 +471,13 @@ function Ue(e, l) {
   }
   return t;
 }
-function Ft(e, l = {}) {
+function Wt(e, l = {}) {
   let t, o, a = z;
   const r = (n) => {
     clearTimeout(n), a(), a = z;
   };
   return (n) => {
-    const c = J(e), f = J(l.maxWait);
+    const c = P(e), f = P(l.maxWait);
     return t && r(t), c <= 0 || f !== void 0 && f <= 0 ? (o && (r(o), o = null), Promise.resolve(n())) : new Promise((u, m) => {
       a = l.rejectOnCancel ? m : u, f && !o && (o = setTimeout(() => {
         t && r(t), o = null, u(n());
@@ -505,83 +487,83 @@ function Ft(e, l = {}) {
     });
   };
 }
-function Dt(e, l = !0, t = !0, o = !1) {
+function Ut(e, l = !0, t = !0, o = !1) {
   let a = 0, r, s = !0, n = z, c;
   const f = () => {
     r && (clearTimeout(r), r = void 0, n(), n = z);
   };
   return (m) => {
-    const i = J(e), y = Date.now() - a, d = () => c = m();
-    return f(), i <= 0 ? (a = Date.now(), d()) : (y > i && (t || !s) ? (a = Date.now(), d()) : l && (c = new Promise((j, k) => {
-      n = o ? k : j, r = setTimeout(() => {
+    const i = P(e), y = Date.now() - a, d = () => c = m();
+    return f(), i <= 0 ? (a = Date.now(), d()) : (y > i && (t || !s) ? (a = Date.now(), d()) : l && (c = new Promise((j, S) => {
+      n = o ? S : j, r = setTimeout(() => {
         a = Date.now(), s = !0, j(d()), f();
       }, Math.max(0, i - y));
     })), !t && !r && (r = setTimeout(() => s = !0, i)), s = !1, c);
   };
 }
-const M = {
+const R = {
   mounted: "mounted",
   updated: "updated",
   unmounted: "unmounted"
 };
-function Rt(e) {
+function Gt(e) {
   return e;
 }
-function Q(e) {
-  return lt() ? (ot(e), !0) : !1;
+function G(e) {
+  return nt() ? (at(e), !0) : !1;
 }
-function Mt(e, l = 200, t = {}) {
-  return Ue(Ft(l, t), e);
+function Kt(e, l = 200, t = {}) {
+  return Ke(Wt(l, t), e);
 }
-function Nt(e, l = 200, t = !1, o = !0, a = !1) {
-  return Ue(Dt(l, t, o, a), e);
+function Qt(e, l = 200, t = !1, o = !0, a = !1) {
+  return Ke(Ut(l, t, o, a), e);
 }
-function Ht(e) {
-  return typeof e == "function" ? B(e) : g(e);
+function Zt(e) {
+  return typeof e == "function" ? I(e) : g(e);
 }
-function Ge(e, l = !0) {
-  nt() ? X(e) : l ? e() : Re(e);
+function Qe(e, l = !0) {
+  it() ? Z(e) : l ? e() : Me(e);
 }
-function U(e) {
+function H(e) {
   var l;
-  const t = J(e);
+  const t = P(e);
   return (l = t == null ? void 0 : t.$el) != null ? l : t;
 }
-const he = K ? window : void 0;
-K && window.document;
-K && window.navigator;
-K && window.location;
+const be = U ? window : void 0;
+U && window.document;
+U && window.navigator;
+U && window.location;
 function ae(...e) {
   let l, t, o, a;
-  if (We(e[0]) || Array.isArray(e[0]) ? ([t, o, a] = e, l = he) : [l, t, o, a] = e, !l)
+  if (Ge(e[0]) || Array.isArray(e[0]) ? ([t, o, a] = e, l = be) : [l, t, o, a] = e, !l)
     return z;
   Array.isArray(t) || (t = [t]), Array.isArray(o) || (o = [o]);
   const r = [], s = () => {
     r.forEach((u) => u()), r.length = 0;
-  }, n = (u, m, i, y) => (u.addEventListener(m, i, y), () => u.removeEventListener(m, i, y)), c = P(() => [U(l), J(a)], ([u, m]) => {
+  }, n = (u, m, i, y) => (u.addEventListener(m, i, y), () => u.removeEventListener(m, i, y)), c = C(() => [H(l), P(a)], ([u, m]) => {
     s(), u && r.push(...t.flatMap((i) => o.map((y) => n(u, i, y, m))));
   }, { immediate: !0, flush: "post" }), f = () => {
     c(), s();
   };
-  return Q(f), f;
+  return G(f), f;
 }
-let _e = !1;
-function Wt(e, l, t = {}) {
-  const { window: o = he, ignore: a = [], capture: r = !0, detectIframe: s = !1 } = t;
+let we = !1;
+function Yt(e, l, t = {}) {
+  const { window: o = be, ignore: a = [], capture: r = !0, detectIframe: s = !1 } = t;
   if (!o)
     return;
-  le && !_e && (_e = !0, Array.from(o.document.body.children).forEach((i) => i.addEventListener("click", z)));
+  ee && !we && (we = !0, Array.from(o.document.body.children).forEach((i) => i.addEventListener("click", z)));
   let n = !0;
   const c = (i) => a.some((y) => {
     if (typeof y == "string")
       return Array.from(o.document.querySelectorAll(y)).some((d) => d === i.target || i.composedPath().includes(d));
     {
-      const d = U(y);
+      const d = H(y);
       return d && (i.target === d || i.composedPath().includes(d));
     }
   }), u = [
     ae(o, "click", (i) => {
-      const y = U(e);
+      const y = H(e);
       if (!(!y || y === i.target || i.composedPath().includes(y))) {
         if (i.detail === 0 && (n = !c(i)), !n) {
           n = !0;
@@ -591,73 +573,73 @@ function Wt(e, l, t = {}) {
       }
     }, { passive: !0, capture: r }),
     ae(o, "pointerdown", (i) => {
-      const y = U(e);
+      const y = H(e);
       y && (n = !i.composedPath().includes(y) && !c(i));
     }, { passive: !0 }),
     s && ae(o, "blur", (i) => {
       var y;
-      const d = U(e);
+      const d = H(e);
       ((y = o.document.activeElement) == null ? void 0 : y.tagName) === "IFRAME" && !(d != null && d.contains(o.document.activeElement)) && l(i);
     })
   ].filter(Boolean);
   return () => u.forEach((i) => i());
 }
-function Ut(e, l = !1) {
+function Xt(e, l = !1) {
   const t = g(), o = () => t.value = Boolean(e());
-  return o(), Ge(o, l), t;
+  return o(), Qe(o, l), t;
 }
 const ie = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, re = "__vueuse_ssr_handlers__";
 ie[re] = ie[re] || {};
 ie[re];
-var we = Object.getOwnPropertySymbols, Gt = Object.prototype.hasOwnProperty, Kt = Object.prototype.propertyIsEnumerable, Qt = (e, l) => {
+var Se = Object.getOwnPropertySymbols, el = Object.prototype.hasOwnProperty, tl = Object.prototype.propertyIsEnumerable, ll = (e, l) => {
   var t = {};
   for (var o in e)
-    Gt.call(e, o) && l.indexOf(o) < 0 && (t[o] = e[o]);
-  if (e != null && we)
-    for (var o of we(e))
-      l.indexOf(o) < 0 && Kt.call(e, o) && (t[o] = e[o]);
+    el.call(e, o) && l.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && Se)
+    for (var o of Se(e))
+      l.indexOf(o) < 0 && tl.call(e, o) && (t[o] = e[o]);
   return t;
 };
-function Zt(e, l, t = {}) {
-  const o = t, { window: a = he } = o, r = Qt(o, ["window"]);
+function ol(e, l, t = {}) {
+  const o = t, { window: a = be } = o, r = ll(o, ["window"]);
   let s;
-  const n = Ut(() => a && "ResizeObserver" in a), c = () => {
+  const n = Xt(() => a && "ResizeObserver" in a), c = () => {
     s && (s.disconnect(), s = void 0);
-  }, f = P(() => U(e), (m) => {
+  }, f = C(() => H(e), (m) => {
     c(), n.value && a && m && (s = new ResizeObserver(l), s.observe(m, r));
   }, { immediate: !0, flush: "post" }), u = () => {
     c(), f();
   };
-  return Q(u), {
+  return G(u), {
     isSupported: n,
     stop: u
   };
 }
-var Se;
+var je;
 (function(e) {
   e.UP = "UP", e.RIGHT = "RIGHT", e.DOWN = "DOWN", e.LEFT = "LEFT", e.NONE = "NONE";
-})(Se || (Se = {}));
-function Yt(e) {
+})(je || (je = {}));
+function nl(e) {
   const l = g(e == null ? void 0 : e.element), t = g(e == null ? void 0 : e.input);
   function o() {
     var a, r;
     l.value && (l.value.style.height = "1px", l.value.style.height = `${(a = l.value) == null ? void 0 : a.scrollHeight}px`, (r = e == null ? void 0 : e.onResize) == null || r.call(e));
   }
-  return P([t, l], o, { immediate: !0 }), Zt(l, () => o()), e != null && e.watch && P(e.watch, o, { immediate: !0, deep: !0 }), {
+  return C([t, l], o, { immediate: !0 }), ol(l, () => o()), e != null && e.watch && C(e.watch, o, { immediate: !0, deep: !0 }), {
     textarea: l,
     input: t,
     triggerResize: o
   };
 }
-var Xt = Object.defineProperty, ke = Object.getOwnPropertySymbols, el = Object.prototype.hasOwnProperty, tl = Object.prototype.propertyIsEnumerable, je = (e, l, t) => l in e ? Xt(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, ll = (e, l) => {
+var al = Object.defineProperty, ke = Object.getOwnPropertySymbols, il = Object.prototype.hasOwnProperty, rl = Object.prototype.propertyIsEnumerable, $e = (e, l, t) => l in e ? al(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, sl = (e, l) => {
   for (var t in l || (l = {}))
-    el.call(l, t) && je(e, t, l[t]);
+    il.call(l, t) && $e(e, t, l[t]);
   if (ke)
     for (var t of ke(l))
-      tl.call(l, t) && je(e, t, l[t]);
+      rl.call(l, t) && $e(e, t, l[t]);
   return e;
 };
-const ol = {
+const ul = {
   easeInSine: [0.12, 0, 0.39, 0],
   easeOutSine: [0.61, 1, 0.88, 1],
   easeInOutSine: [0.37, 0, 0.63, 1],
@@ -683,60 +665,60 @@ const ol = {
   easeOutBack: [0.34, 1.56, 0.64, 1],
   easeInOutBack: [0.68, -0.6, 0.32, 1.6]
 };
-ll({
-  linear: Rt
-}, ol);
-const nl = /* @__PURE__ */ $({
+sl({
+  linear: Gt
+}, ul);
+const dl = /* @__PURE__ */ $({
   name: "OnClickOutside",
   props: ["as", "options"],
   emits: ["trigger"],
   setup(e, { slots: l, emit: t }) {
     const o = g();
-    return Wt(o, (a) => {
+    return Yt(o, (a) => {
       t("trigger", a);
     }, e.options), () => {
       if (l.default)
-        return at(e.as || "div", { ref: o }, l.default());
+        return rt(e.as || "div", { ref: o }, l.default());
     };
   }
 });
-function T(e) {
+function J(e) {
   var l;
-  const t = J(e);
+  const t = P(e);
   return (l = t == null ? void 0 : t.$el) != null ? l : t;
 }
-const H = K ? window : void 0;
+const M = U ? window : void 0;
 function A(...e) {
   let l, t, o, a;
-  if (We(e[0]) || Array.isArray(e[0]) ? ([t, o, a] = e, l = H) : [l, t, o, a] = e, !l)
+  if (Ge(e[0]) || Array.isArray(e[0]) ? ([t, o, a] = e, l = M) : [l, t, o, a] = e, !l)
     return z;
   Array.isArray(t) || (t = [t]), Array.isArray(o) || (o = [o]);
   const r = [], s = () => {
     r.forEach((u) => u()), r.length = 0;
-  }, n = (u, m, i, y) => (u.addEventListener(m, i, y), () => u.removeEventListener(m, i, y)), c = P(() => [T(l), J(a)], ([u, m]) => {
+  }, n = (u, m, i, y) => (u.addEventListener(m, i, y), () => u.removeEventListener(m, i, y)), c = C(() => [J(l), P(a)], ([u, m]) => {
     s(), u && r.push(...t.flatMap((i) => o.map((y) => n(u, i, y, m))));
   }, { immediate: !0, flush: "post" }), f = () => {
     c(), s();
   };
-  return Q(f), f;
+  return G(f), f;
 }
-let $e = !1;
-function Ve(e, l, t = {}) {
-  const { window: o = H, ignore: a = [], capture: r = !0, detectIframe: s = !1 } = t;
+let Ve = !1;
+function xe(e, l, t = {}) {
+  const { window: o = M, ignore: a = [], capture: r = !0, detectIframe: s = !1 } = t;
   if (!o)
     return;
-  le && !$e && ($e = !0, Array.from(o.document.body.children).forEach((i) => i.addEventListener("click", z)));
+  ee && !Ve && (Ve = !0, Array.from(o.document.body.children).forEach((i) => i.addEventListener("click", z)));
   let n = !0;
   const c = (i) => a.some((y) => {
     if (typeof y == "string")
       return Array.from(o.document.querySelectorAll(y)).some((d) => d === i.target || i.composedPath().includes(d));
     {
-      const d = T(y);
+      const d = J(y);
       return d && (i.target === d || i.composedPath().includes(d));
     }
   }), u = [
     A(o, "click", (i) => {
-      const y = T(e);
+      const y = J(e);
       if (!(!y || y === i.target || i.composedPath().includes(y))) {
         if (i.detail === 0 && (n = !c(i)), !n) {
           n = !0;
@@ -746,47 +728,47 @@ function Ve(e, l, t = {}) {
       }
     }, { passive: !0, capture: r }),
     A(o, "pointerdown", (i) => {
-      const y = T(e);
+      const y = J(e);
       y && (n = !i.composedPath().includes(y) && !c(i));
     }, { passive: !0 }),
     s && A(o, "blur", (i) => {
       var y;
-      const d = T(e);
+      const d = J(e);
       ((y = o.document.activeElement) == null ? void 0 : y.tagName) === "IFRAME" && !(d != null && d.contains(o.document.activeElement)) && l(i);
     })
   ].filter(Boolean);
   return () => u.forEach((i) => i());
 }
-M.mounted + "", M.unmounted + "";
-const al = (e) => typeof e == "function" ? e : typeof e == "string" ? (l) => l.key === e : Array.isArray(e) ? (l) => e.includes(l.key) : () => !0;
-function xe(...e) {
+R.mounted + "", R.unmounted + "";
+const cl = (e) => typeof e == "function" ? e : typeof e == "string" ? (l) => l.key === e : Array.isArray(e) ? (l) => e.includes(l.key) : () => !0;
+function Oe(...e) {
   let l, t, o = {};
   e.length === 3 ? (l = e[0], t = e[1], o = e[2]) : e.length === 2 ? typeof e[1] == "object" ? (l = !0, t = e[0], o = e[1]) : (l = e[0], t = e[1]) : (l = !0, t = e[0]);
-  const { target: a = H, eventName: r = "keydown", passive: s = !1 } = o, n = al(l);
+  const { target: a = M, eventName: r = "keydown", passive: s = !1 } = o, n = cl(l);
   return A(a, r, (f) => {
     n(f) && t(f);
   }, s);
 }
-var il = Object.defineProperty, Ie = Object.getOwnPropertySymbols, rl = Object.prototype.hasOwnProperty, sl = Object.prototype.propertyIsEnumerable, Oe = (e, l, t) => l in e ? il(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, ul = (e, l) => {
+var fl = Object.defineProperty, Ie = Object.getOwnPropertySymbols, yl = Object.prototype.hasOwnProperty, ml = Object.prototype.propertyIsEnumerable, Be = (e, l, t) => l in e ? fl(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, vl = (e, l) => {
   for (var t in l || (l = {}))
-    rl.call(l, t) && Oe(e, t, l[t]);
+    yl.call(l, t) && Be(e, t, l[t]);
   if (Ie)
     for (var t of Ie(l))
-      sl.call(l, t) && Oe(e, t, l[t]);
+      ml.call(l, t) && Be(e, t, l[t]);
   return e;
 };
-M.mounted + "";
-const dl = 500;
-function Be(e, l, t) {
+R.mounted + "";
+const pl = 500;
+function Ee(e, l, t) {
   var o, a;
-  const r = B(() => T(e));
+  const r = I(() => J(e));
   let s;
   function n() {
     s && (clearTimeout(s), s = void 0);
   }
   function c(u) {
     var m, i, y, d;
-    (m = t == null ? void 0 : t.modifiers) != null && m.self && u.target !== r.value || (n(), (i = t == null ? void 0 : t.modifiers) != null && i.prevent && u.preventDefault(), (y = t == null ? void 0 : t.modifiers) != null && y.stop && u.stopPropagation(), s = setTimeout(() => l(u), (d = t == null ? void 0 : t.delay) != null ? d : dl));
+    (m = t == null ? void 0 : t.modifiers) != null && m.self && u.target !== r.value || (n(), (i = t == null ? void 0 : t.modifiers) != null && i.prevent && u.preventDefault(), (y = t == null ? void 0 : t.modifiers) != null && y.stop && u.stopPropagation(), s = setTimeout(() => l(u), (d = t == null ? void 0 : t.delay) != null ? d : pl));
   }
   const f = {
     capture: (o = t == null ? void 0 : t.modifiers) == null ? void 0 : o.capture,
@@ -794,15 +776,15 @@ function Be(e, l, t) {
   };
   A(r, "pointerdown", c, f), A(r, "pointerup", n, f), A(r, "pointerleave", n, f);
 }
-M.mounted + "";
+R.mounted + "";
 const se = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, ue = "__vueuse_ssr_handlers__";
 se[ue] = se[ue] || {};
 se[ue];
-function Ke(e, l = !1) {
+function Ze(e, l = !1) {
   const t = g(), o = () => t.value = Boolean(e());
-  return o(), Ge(o, l), t;
+  return o(), Qe(o, l), t;
 }
-function cl(e, l = {}) {
+function hl(e, l = {}) {
   const t = l ? l.delayEnter : 0, o = l ? l.delayLeave : 0, a = g(!1);
   let r;
   const s = (n) => {
@@ -811,40 +793,40 @@ function cl(e, l = {}) {
   };
   return window && (A(e, "mouseenter", () => s(!0), { passive: !0 }), A(e, "mouseleave", () => s(!1), { passive: !0 })), a;
 }
-M.mounted + "";
-var Ee = Object.getOwnPropertySymbols, fl = Object.prototype.hasOwnProperty, yl = Object.prototype.propertyIsEnumerable, ml = (e, l) => {
+R.mounted + "";
+var Le = Object.getOwnPropertySymbols, bl = Object.prototype.hasOwnProperty, gl = Object.prototype.propertyIsEnumerable, _l = (e, l) => {
   var t = {};
   for (var o in e)
-    fl.call(e, o) && l.indexOf(o) < 0 && (t[o] = e[o]);
-  if (e != null && Ee)
-    for (var o of Ee(e))
-      l.indexOf(o) < 0 && yl.call(e, o) && (t[o] = e[o]);
+    bl.call(e, o) && l.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && Le)
+    for (var o of Le(e))
+      l.indexOf(o) < 0 && gl.call(e, o) && (t[o] = e[o]);
   return t;
 };
-function vl(e, l, t = {}) {
-  const o = t, { window: a = H } = o, r = ml(o, ["window"]);
+function wl(e, l, t = {}) {
+  const o = t, { window: a = M } = o, r = _l(o, ["window"]);
   let s;
-  const n = Ke(() => a && "ResizeObserver" in a), c = () => {
+  const n = Ze(() => a && "ResizeObserver" in a), c = () => {
     s && (s.disconnect(), s = void 0);
-  }, f = P(() => T(e), (m) => {
+  }, f = C(() => J(e), (m) => {
     c(), n.value && a && m && (s = new ResizeObserver(l), s.observe(m, r));
   }, { immediate: !0, flush: "post" }), u = () => {
     c(), f();
   };
-  return Q(u), {
+  return G(u), {
     isSupported: n,
     stop: u
   };
 }
-function pl(e, l = { width: 0, height: 0 }, t = {}) {
-  const { window: o = H, box: a = "content-box" } = t, r = B(() => {
+function Sl(e, l = { width: 0, height: 0 }, t = {}) {
+  const { window: o = M, box: a = "content-box" } = t, r = I(() => {
     var c, f;
-    return (f = (c = T(e)) == null ? void 0 : c.namespaceURI) == null ? void 0 : f.includes("svg");
+    return (f = (c = J(e)) == null ? void 0 : c.namespaceURI) == null ? void 0 : f.includes("svg");
   }), s = g(l.width), n = g(l.height);
-  return vl(e, ([c]) => {
+  return wl(e, ([c]) => {
     const f = a === "border-box" ? c.borderBoxSize : a === "content-box" ? c.contentBoxSize : c.devicePixelContentBoxSize;
     if (o && r.value) {
-      const u = T(e);
+      const u = J(e);
       if (u) {
         const m = o.getComputedStyle(u);
         s.value = parseFloat(m.width), n.value = parseFloat(m.height);
@@ -854,19 +836,19 @@ function pl(e, l = { width: 0, height: 0 }, t = {}) {
       s.value = u.reduce((m, { inlineSize: i }) => m + i, 0), n.value = u.reduce((m, { blockSize: i }) => m + i, 0);
     } else
       s.value = c.contentRect.width, n.value = c.contentRect.height;
-  }, t), P(() => T(e), (c) => {
+  }, t), C(() => J(e), (c) => {
     s.value = c ? l.width : 0, n.value = c ? l.height : 0;
   }), {
     width: s,
     height: n
   };
 }
-M.mounted + "";
-function Le(e, { window: l = H, scrollTarget: t } = {}) {
+R.mounted + "";
+function Ce(e, { window: l = M, scrollTarget: t } = {}) {
   const o = g(!1), a = () => {
     if (!l)
       return;
-    const r = l.document, s = T(e);
+    const r = l.document, s = J(e);
     if (!s)
       o.value = !1;
     else {
@@ -874,13 +856,13 @@ function Le(e, { window: l = H, scrollTarget: t } = {}) {
       o.value = n.top <= (l.innerHeight || r.documentElement.clientHeight) && n.left <= (l.innerWidth || r.documentElement.clientWidth) && n.bottom >= 0 && n.right >= 0;
     }
   };
-  return P(() => T(e), () => a(), { immediate: !0, flush: "post" }), l && A(t || l, "scroll", a, {
+  return C(() => J(e), () => a(), { immediate: !0, flush: "post" }), l && A(t || l, "scroll", a, {
     capture: !1,
     passive: !0
   }), o;
 }
-M.mounted + "";
-const Ce = 1;
+R.mounted + "";
+const Pe = 1;
 function de(e, l = {}) {
   const {
     throttle: t = 0,
@@ -898,79 +880,79 @@ function de(e, l = {}) {
       passive: !0
     },
     behavior: c = "auto"
-  } = l, f = g(0), u = g(0), m = B({
+  } = l, f = g(0), u = g(0), m = I({
     get() {
       return f.value;
     },
-    set(E) {
-      y(E, void 0);
+    set(B) {
+      y(B, void 0);
     }
-  }), i = B({
+  }), i = I({
     get() {
       return u.value;
     },
-    set(E) {
-      y(void 0, E);
+    set(B) {
+      y(void 0, B);
     }
   });
-  function y(E, q) {
-    var R, F, be;
-    const ne = J(e);
-    ne && ((be = ne instanceof Document ? document.body : ne) == null || be.scrollTo({
-      top: (R = J(q)) != null ? R : i.value,
-      left: (F = J(E)) != null ? F : m.value,
-      behavior: J(c)
+  function y(B, q) {
+    var D, F, ge;
+    const ne = P(e);
+    ne && ((ge = ne instanceof Document ? document.body : ne) == null || ge.scrollTo({
+      top: (D = P(q)) != null ? D : i.value,
+      left: (F = P(B)) != null ? F : m.value,
+      behavior: P(c)
     }));
   }
-  const d = g(!1), j = te({
+  const d = g(!1), j = X({
     left: !0,
     right: !1,
     top: !0,
     bottom: !1
-  }), k = te({
+  }), S = X({
     left: !1,
     right: !1,
     top: !1,
     bottom: !1
-  }), ee = (E) => {
-    d.value && (d.value = !1, k.left = !1, k.right = !1, k.top = !1, k.bottom = !1, a(E));
-  }, oe = Mt(ee, t + o), O = (E) => {
-    const q = E.target === document ? E.target.documentElement : E.target, R = q.scrollLeft;
-    k.left = R < f.value, k.right = R > u.value, j.left = R <= 0 + (s.left || 0), j.right = R + q.clientWidth >= q.scrollWidth - (s.right || 0) - Ce, f.value = R;
+  }), Y = (B) => {
+    d.value && (d.value = !1, S.left = !1, S.right = !1, S.top = !1, S.bottom = !1, a(B));
+  }, oe = Kt(Y, t + o), O = (B) => {
+    const q = B.target === document ? B.target.documentElement : B.target, D = q.scrollLeft;
+    S.left = D < f.value, S.right = D > u.value, j.left = D <= 0 + (s.left || 0), j.right = D + q.clientWidth >= q.scrollWidth - (s.right || 0) - Pe, f.value = D;
     let F = q.scrollTop;
-    E.target === document && !F && (F = document.body.scrollTop), k.top = F < u.value, k.bottom = F > u.value, j.top = F <= 0 + (s.top || 0), j.bottom = F + q.clientHeight >= q.scrollHeight - (s.bottom || 0) - Ce, u.value = F, d.value = !0, oe(E), r(E);
+    B.target === document && !F && (F = document.body.scrollTop), S.top = F < u.value, S.bottom = F > u.value, j.top = F <= 0 + (s.top || 0), j.bottom = F + q.clientHeight >= q.scrollHeight - (s.bottom || 0) - Pe, u.value = F, d.value = !0, oe(B), r(B);
   };
-  return A(e, "scroll", t ? Nt(O, t, !0, !1) : O, n), A(e, "scrollend", ee, n), {
+  return A(e, "scroll", t ? Qt(O, t, !0, !1) : O, n), A(e, "scrollend", Y, n), {
     x: m,
     y: i,
     isScrolling: d,
     arrivedState: j,
-    directions: k
+    directions: S
   };
 }
-var hl = Object.defineProperty, bl = Object.defineProperties, gl = Object.getOwnPropertyDescriptors, Pe = Object.getOwnPropertySymbols, _l = Object.prototype.hasOwnProperty, wl = Object.prototype.propertyIsEnumerable, Je = (e, l, t) => l in e ? hl(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, Te = (e, l) => {
+var jl = Object.defineProperty, kl = Object.defineProperties, $l = Object.getOwnPropertyDescriptors, Je = Object.getOwnPropertySymbols, Vl = Object.prototype.hasOwnProperty, xl = Object.prototype.propertyIsEnumerable, Te = (e, l, t) => l in e ? jl(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, qe = (e, l) => {
   for (var t in l || (l = {}))
-    _l.call(l, t) && Je(e, t, l[t]);
-  if (Pe)
-    for (var t of Pe(l))
-      wl.call(l, t) && Je(e, t, l[t]);
+    Vl.call(l, t) && Te(e, t, l[t]);
+  if (Je)
+    for (var t of Je(l))
+      xl.call(l, t) && Te(e, t, l[t]);
   return e;
-}, Sl = (e, l) => bl(e, gl(l));
-function qe(e, l, t = {}) {
+}, Ol = (e, l) => kl(e, $l(l));
+function ze(e, l, t = {}) {
   var o, a;
-  const r = (o = t.direction) != null ? o : "bottom", s = te(de(e, Sl(Te({}, t), {
-    offset: Te({
+  const r = (o = t.direction) != null ? o : "bottom", s = X(de(e, Ol(qe({}, t), {
+    offset: qe({
       [r]: (a = t.distance) != null ? a : 0
     }, t.offset)
   })));
-  P(() => s.arrivedState[r], async (n) => {
+  C(() => s.arrivedState[r], async (n) => {
     var c, f;
     if (n) {
-      const u = J(e), m = {
+      const u = P(e), m = {
         height: (c = u == null ? void 0 : u.scrollHeight) != null ? c : 0,
         width: (f = u == null ? void 0 : u.scrollWidth) != null ? f : 0
       };
-      await l(s), t.preserveScrollPosition && u && Re(() => {
+      await l(s), t.preserveScrollPosition && u && Me(() => {
         u.scrollTo({
           top: u.scrollHeight - m.height,
           left: u.scrollWidth - m.width
@@ -979,18 +961,18 @@ function qe(e, l, t = {}) {
     }
   });
 }
-M.mounted + "";
-function ze(e, l, t = {}) {
+R.mounted + "";
+function Ae(e, l, t = {}) {
   const {
     root: o,
     rootMargin: a = "0px",
     threshold: r = 0.1,
-    window: s = H
-  } = t, n = Ke(() => s && "IntersectionObserver" in s);
+    window: s = M
+  } = t, n = Ze(() => s && "IntersectionObserver" in s);
   let c = z;
-  const f = n.value ? P(() => ({
-    el: T(e),
-    root: T(o)
+  const f = n.value ? C(() => ({
+    el: J(e),
+    root: J(o)
   }), ({ el: m, root: i }) => {
     if (c(), !m)
       return;
@@ -1005,38 +987,38 @@ function ze(e, l, t = {}) {
   }, { immediate: !0, flush: "post" }) : z, u = () => {
     c(), f();
   };
-  return Q(u), {
+  return G(u), {
     isSupported: n,
     stop: u
   };
 }
-M.mounted + "";
-var kl = Object.defineProperty, jl = Object.defineProperties, $l = Object.getOwnPropertyDescriptors, Ae = Object.getOwnPropertySymbols, Vl = Object.prototype.hasOwnProperty, xl = Object.prototype.propertyIsEnumerable, Fe = (e, l, t) => l in e ? kl(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, Il = (e, l) => {
+R.mounted + "";
+var Il = Object.defineProperty, Bl = Object.defineProperties, El = Object.getOwnPropertyDescriptors, Fe = Object.getOwnPropertySymbols, Ll = Object.prototype.hasOwnProperty, Cl = Object.prototype.propertyIsEnumerable, De = (e, l, t) => l in e ? Il(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, Pl = (e, l) => {
   for (var t in l || (l = {}))
-    Vl.call(l, t) && Fe(e, t, l[t]);
-  if (Ae)
-    for (var t of Ae(l))
-      xl.call(l, t) && Fe(e, t, l[t]);
+    Ll.call(l, t) && De(e, t, l[t]);
+  if (Fe)
+    for (var t of Fe(l))
+      Cl.call(l, t) && De(e, t, l[t]);
   return e;
-}, Ol = (e, l) => jl(e, $l(l));
-M.mounted + "";
-function Qe(e) {
+}, Jl = (e, l) => Bl(e, El(l));
+R.mounted + "";
+function Ye(e) {
   const l = window.getComputedStyle(e);
   if (l.overflowX === "scroll" || l.overflowY === "scroll" || l.overflowX === "auto" && e.clientHeight < e.scrollHeight || l.overflowY === "auto" && e.clientWidth < e.scrollWidth)
     return !0;
   {
     const t = e.parentNode;
-    return !t || t.tagName === "BODY" ? !1 : Qe(t);
+    return !t || t.tagName === "BODY" ? !1 : Ye(t);
   }
 }
-function Bl(e) {
+function Tl(e) {
   const l = e || window.event, t = l.target;
-  return Qe(t) ? !1 : l.touches.length > 1 ? !0 : (l.preventDefault && l.preventDefault(), !1);
+  return Ye(t) ? !1 : l.touches.length > 1 ? !0 : (l.preventDefault && l.preventDefault(), !1);
 }
-function El(e, l = !1) {
+function ql(e, l = !1) {
   const t = g(l);
   let o = null, a;
-  P(Ht(e), (n) => {
+  C(Zt(e), (n) => {
     if (n) {
       const c = n;
       a = c.style.overflow, t.value && (c.style.overflow = "hidden");
@@ -1045,15 +1027,15 @@ function El(e, l = !1) {
     immediate: !0
   });
   const r = () => {
-    const n = J(e);
-    !n || t.value || (le && (o = A(n, "touchmove", (c) => {
-      Bl(c);
+    const n = P(e);
+    !n || t.value || (ee && (o = A(n, "touchmove", (c) => {
+      Tl(c);
     }, { passive: !1 })), n.style.overflow = "hidden", t.value = !0);
   }, s = () => {
-    const n = J(e);
-    !n || !t.value || (le && (o == null || o()), n.style.overflow = a, t.value = !1);
+    const n = P(e);
+    !n || !t.value || (ee && (o == null || o()), n.style.overflow = a, t.value = !1);
   };
-  return Q(s), B({
+  return G(s), I({
     get() {
       return t.value;
     },
@@ -1062,25 +1044,25 @@ function El(e, l = !1) {
     }
   });
 }
-const Ll = () => {
+const zl = () => {
   let e = !1;
   const l = g(!1);
   return (t, o) => {
     if (l.value = o.value, e)
       return;
     e = !0;
-    const a = El(t, o.value);
-    P(l, (r) => a.value = r);
+    const a = ql(t, o.value);
+    C(l, (r) => a.value = r);
   };
 };
-Ll();
-const Ze = ["medium", "small"], Cl = {
+zl();
+const Xe = ["medium", "small"], Al = {
   key: 0,
   class: "joy-dropdown-list__header"
-}, Pl = ["id", "tabindex", "aria-disabled", "aria-selected", "title", "aria-label", ".dataModel", "onClick"], Jl = {
+}, Fl = ["id", "tabindex", "aria-disabled", "aria-selected", "title", "aria-label", ".dataModel", "onClick"], Dl = {
   key: 1,
   class: "joy-dropdown-list__footer"
-}, Tl = /* @__PURE__ */ $({
+}, Rl = /* @__PURE__ */ $({
   __name: "VJoyDropdownList",
   props: {
     /**
@@ -1099,7 +1081,7 @@ const Ze = ["medium", "small"], Cl = {
       type: String,
       default: "medium",
       validator(e) {
-        return Ze.includes(e);
+        return Xe.includes(e);
       }
     },
     modelValue: {
@@ -1116,7 +1098,7 @@ const Ze = ["medium", "small"], Cl = {
   },
   emits: ["update:modelValue", "close:dropdownList"],
   setup(e, { expose: l, emit: t }) {
-    const o = e, a = g(), r = B(() => (i) => !o.modelValue && !i.value && !i.id ? !1 : o.modelValue === i.value || o.modelValue === i.id);
+    const o = e, a = g(), r = I(() => (i) => !o.modelValue && !i.value && !i.id ? !1 : o.modelValue === i.value || o.modelValue === i.id);
     function s(i) {
       i.disabled || t("update:modelValue", i.value || i.id);
     }
@@ -1145,9 +1127,9 @@ const Ze = ["medium", "small"], Cl = {
       }
       if (i.key === " " && i.preventDefault(), ["ArrowDown", "ArrowUp", "Home", "End"].includes(i.key)) {
         const d = n(), j = f();
-        let k = d.indexOf(j);
+        let S = d.indexOf(j);
         if (d.length) {
-          i.preventDefault(), i.key === "ArrowDown" ? k++ : i.key === "ArrowUp" ? k-- : i.key === "Home" ? k = 0 : i.key === "End" && (k = d.length - 1), k < 0 && (k = d.length - 1), k > d.length - 1 && (k = 0), m(d[k]);
+          i.preventDefault(), i.key === "ArrowDown" ? S++ : i.key === "ArrowUp" ? S-- : i.key === "Home" ? S = 0 : i.key === "End" && (S = d.length - 1), S < 0 && (S = d.length - 1), S > d.length - 1 && (S = 0), m(d[S]);
           return;
         }
       }
@@ -1155,35 +1137,35 @@ const Ze = ["medium", "small"], Cl = {
     function m(i) {
       i.focus();
     }
-    return X(() => {
+    return Z(() => {
       window.addEventListener("keydown", u), c();
-    }), Me(() => {
+    }), Ne(() => {
       window.removeEventListener("keydown", u);
     }), l({
       isSelected: r
     }), (i, y) => (v(), p("div", {
       class: "joy-dropdown-list",
-      style: Z({ width: `${e.width}px`, "max-width": `${e.width}px` })
+      style: K({ width: `${e.width}px`, "max-width": `${e.width}px` })
     }, [
-      i.$slots["dropdown-list-header"] ? (v(), p("header", Cl, [
-        h(i.$slots, "dropdown-list-header", {}, void 0, !0)
+      i.$slots["dropdown-list-header"] ? (v(), p("header", Al, [
+        b(i.$slots, "dropdown-list-header", {}, void 0, !0)
       ])) : w("", !0),
-      b("div", {
-        class: S(["joy-dropdown-list__items", { "joy-dropdown-list__items-slotted": i.$slots["dropdown-list-items"] }]),
-        style: Z({ "max-height": `${e.height}px` })
+      h("div", {
+        class: k(["joy-dropdown-list__items", { "joy-dropdown-list__items-slotted": i.$slots["dropdown-list-items"] }]),
+        style: K({ "max-height": `${e.height}px` })
       }, [
-        h(i.$slots, "dropdown-list-items", {}, void 0, !0),
+        b(i.$slots, "dropdown-list-items", {}, void 0, !0),
         e.options.length ? (v(), p("ul", {
           key: 0,
           ref_key: "listbox",
           ref: a,
           role: "listbox"
         }, [
-          (v(!0), p(fe, null, ye(e.options, (d) => (v(), p("li", {
+          (v(!0), p(ye, null, me(e.options, (d) => (v(), p("li", {
             id: d.id,
             key: d.label,
-            style: Z({ "max-width": `${e.width}px` }),
-            class: S([
+            style: K({ "max-width": `${e.width}px` }),
+            class: k([
               "joy-dropdown-list__item",
               `joy-dropdown-list__item--${e.size}`,
               {
@@ -1200,28 +1182,28 @@ const Ze = ["medium", "small"], Cl = {
             role: "option",
             onClick: (j) => s(d)
           }, [
-            h(i.$slots, "label", me(ve(d)), () => [
-              b("span", null, I(d.label), 1)
+            b(i.$slots, "label", ve(pe(d)), () => [
+              h("span", null, x(d.label), 1)
             ], !0)
-          ], 14, Pl))), 128))
+          ], 14, Fl))), 128))
         ], 512)) : w("", !0)
       ], 6),
-      i.$slots["dropdown-list-footer"] ? (v(), p("footer", Jl, [
-        h(i.$slots, "dropdown-list-footer", {}, void 0, !0)
+      i.$slots["dropdown-list-footer"] ? (v(), p("footer", Dl, [
+        b(i.$slots, "dropdown-list-footer", {}, void 0, !0)
       ])) : w("", !0)
     ], 4));
   }
 });
-const Ye = /* @__PURE__ */ V(Tl, [["__scopeId", "data-v-63134a7f"]]);
-function ql(e) {
+const et = /* @__PURE__ */ V(Rl, [["__scopeId", "data-v-63134a7f"]]);
+function Ml(e) {
   const l = () => e();
-  X(() => {
+  Z(() => {
     window.addEventListener("resize", l);
-  }), Me(() => {
+  }), Ne(() => {
     window.removeEventListener("resize", l);
   });
 }
-const zl = /* @__PURE__ */ $({
+const Nl = /* @__PURE__ */ $({
   __name: "VJoyDropdown",
   props: {
     /** DOM valid selector to give to Vue3 Teleport "to" property */
@@ -1269,7 +1251,7 @@ const zl = /* @__PURE__ */ $({
       type: String,
       default: "medium",
       validator(e) {
-        return Ze.includes(e);
+        return Xe.includes(e);
       }
     },
     modelValue: {
@@ -1304,7 +1286,7 @@ const zl = /* @__PURE__ */ $({
       ignore: [s, ".joy-dropdown__list"]
     };
     let m = null;
-    const i = te({
+    const i = X({
       left: "auto",
       top: "0px",
       right: "auto"
@@ -1315,40 +1297,40 @@ const zl = /* @__PURE__ */ $({
       }, 300);
     }
     function d(O) {
-      f.value = !1, m && clearTimeout(m), ee(), c.value = O.target, a.value = !0, t("dropdown:open");
+      f.value = !1, m && clearTimeout(m), Y(), c.value = O.target, a.value = !0, t("dropdown:open");
     }
     function j() {
-      y(), k();
+      y(), S();
     }
-    function k() {
+    function S() {
       c.value && c.value.focus();
     }
-    function ee() {
-      const O = s.value.getBoundingClientRect(), E = document.documentElement.scrollTop + O.top, q = O.height, R = O.left, F = O.width;
-      o.justify === "left" ? i.left = R + "px" : i.left = R + F - parseInt(o.width) + "px", o.direction === "down" ? i.top = E + q + parseInt(o.dropdownGap) + "px" : i.top = E - (parseInt(o.height) + parseInt(o.dropdownGap)) + "px";
+    function Y() {
+      const O = s.value.getBoundingClientRect(), B = document.documentElement.scrollTop + O.top, q = O.height, D = O.left, F = O.width;
+      o.justify === "left" ? i.left = D + "px" : i.left = D + F - parseInt(o.width) + "px", o.direction === "down" ? i.top = B + q + parseInt(o.dropdownGap) + "px" : i.top = B - (parseInt(o.height) + parseInt(o.dropdownGap)) + "px";
     }
     function oe(O) {
-      t("update:modelValue", O), o.closeOnSelect && (y(), k());
+      t("update:modelValue", O), o.closeOnSelect && (y(), S());
     }
-    return ql(y), l({
+    return Ml(y), l({
       showDropdownList: a
-    }), (O, E) => (v(), x(_(nl), {
+    }), (O, B) => (v(), T(_(dl), {
       ref_key: "dropdown",
       ref: r,
       options: u,
       class: "joy-dropdown",
       onTrigger: y
     }, {
-      default: L(() => [
-        b("div", {
+      default: E(() => [
+        h("div", {
           ref_key: "button",
           ref: s,
           class: "joy-dropdown__button",
           onClick: d
         }, [
-          h(O.$slots, "dropdown-button", {}, void 0, !0)
+          b(O.$slots, "dropdown-button", {}, void 0, !0)
         ], 512),
-        (v(), x(it, {
+        (v(), T(st, {
           to: e.appendTo,
           disabled: e.disableTeleport
         }, [
@@ -1356,7 +1338,7 @@ const zl = /* @__PURE__ */ $({
             key: 0,
             ref_key: "list",
             ref: n,
-            class: S([
+            class: k([
               "joy-dropdown__list",
               `joy-dropdown__list--${e.direction}`,
               {
@@ -1364,12 +1346,12 @@ const zl = /* @__PURE__ */ $({
                 "joy-dropdown__list--hiding": f.value
               }
             ]),
-            style: Z({
+            style: K({
               top: i.top,
               left: i.left
             })
           }, [
-            N(Ye, {
+            fe(et, {
               "model-value": e.modelValue,
               options: e.options,
               size: e.size,
@@ -1377,32 +1359,32 @@ const zl = /* @__PURE__ */ $({
               height: e.height,
               "onUpdate:modelValue": oe,
               "onClose:dropdownList": j
-            }, Ne({
-              label: L((q) => [
-                h(O.$slots, "dropdown-item", me(ve(q)), () => [
-                  b("span", null, I(q.label), 1)
+            }, He({
+              label: E((q) => [
+                b(O.$slots, "dropdown-item", ve(pe(q)), () => [
+                  h("span", null, x(q.label), 1)
                 ], !0)
               ]),
               _: 2
             }, [
               O.$slots["dropdown-header"] ? {
                 name: "dropdown-list-header",
-                fn: L(() => [
-                  h(O.$slots, "dropdown-header", {}, void 0, !0)
+                fn: E(() => [
+                  b(O.$slots, "dropdown-header", {}, void 0, !0)
                 ]),
                 key: "0"
               } : void 0,
               O.$slots["dropdown-items"] ? {
                 name: "dropdown-list-items",
-                fn: L(() => [
-                  h(O.$slots, "dropdown-items", {}, void 0, !0)
+                fn: E(() => [
+                  b(O.$slots, "dropdown-items", {}, void 0, !0)
                 ]),
                 key: "1"
               } : void 0,
               O.$slots["dropdown-footer"] ? {
                 name: "dropdown-list-footer",
-                fn: L(() => [
-                  h(O.$slots, "dropdown-footer", {}, void 0, !0)
+                fn: E(() => [
+                  b(O.$slots, "dropdown-footer", {}, void 0, !0)
                 ]),
                 key: "2"
               } : void 0
@@ -1414,7 +1396,10 @@ const zl = /* @__PURE__ */ $({
     }, 512));
   }
 });
-const Al = /* @__PURE__ */ V(zl, [["__scopeId", "data-v-2657fbc4"]]), Fl = ["aria-hidden"], Dl = /* @__PURE__ */ $({
+const Hl = /* @__PURE__ */ V(Nl, [["__scopeId", "data-v-2657fbc4"]]), Wl = (e) => (te("data-v-50e209d6"), e = e(), le(), e), Ul = ["aria-hidden"], Gl = /* @__PURE__ */ Wl(() => /* @__PURE__ */ h("joy-icon", {
+  "custom-class": "joy-icon-error",
+  name: "warning-triangle"
+}, null, -1)), Kl = /* @__PURE__ */ $({
   __name: "VJoyFormError",
   props: {
     /** In some cases you'll need to inject the error in the DOM but hide it. Visible by default */
@@ -1428,23 +1413,20 @@ const Al = /* @__PURE__ */ V(zl, [["__scopeId", "data-v-2657fbc4"]]), Fl = ["ari
   setup(e) {
     return (l, t) => (v(), p("div", {
       "aria-hidden": e.visible,
-      class: S(["joy-form-error", { "joy-has-error": e.visible }]),
+      class: k(["joy-form-error", { "joy-has-error": e.visible }]),
       role: "alert"
     }, [
-      N(D, {
-        class: "joy-icon-error",
-        name: "warning-triangle"
-      }),
-      b("div", null, [
-        h(l.$slots, "default", {}, () => [
-          C(I(e.noHtmlErrorText), 1)
+      Gl,
+      h("div", null, [
+        b(l.$slots, "default", {}, () => [
+          L(x(e.noHtmlErrorText), 1)
         ], !0)
       ])
-    ], 10, Fl));
+    ], 10, Ul));
   }
 });
-const Xe = /* @__PURE__ */ V(Dl, [["__scopeId", "data-v-581fd33b"]]);
-function Rl(e) {
+const tt = /* @__PURE__ */ V(Kl, [["__scopeId", "data-v-50e209d6"]]);
+function Ql(e) {
   let l;
   switch (e) {
     case "error":
@@ -1458,7 +1440,7 @@ function Rl(e) {
   }
   return l;
 }
-const Ml = [...bt], Nl = { class: "joy-highlight--text" }, Hl = /* @__PURE__ */ $({
+const Zl = [...bt], Yl = ["name"], Xl = { class: "joy-highlight--text" }, eo = /* @__PURE__ */ $({
   __name: "VJoyHighlight",
   props: {
     accent: {
@@ -1469,23 +1451,21 @@ const Ml = [...bt], Nl = { class: "joy-highlight--text" }, Hl = /* @__PURE__ */
       type: Boolean,
       default: !1
     },
-    icon: {
-      type: String
-    },
+    icon: String,
     level: {
       type: String,
       default: "neutral",
       validator(e) {
-        return Ml.includes(e);
+        return Zl.includes(e);
       }
     }
   },
   setup(e, { expose: l }) {
-    const t = e, o = B(() => t.icon ? t.icon : Rl(t.level));
+    const t = e, o = I(() => t.icon ? t.icon : Ql(t.level));
     return l({
       getRelevantIcon: o
     }), (a, r) => (v(), p("div", {
-      class: S([
+      class: k([
         "joy-highlight",
         `joy-highlight_${e.level}`,
         {
@@ -1494,33 +1474,33 @@ const Ml = [...bt], Nl = { class: "joy-highlight--text" }, Hl = /* @__PURE__ */
         }
       ])
     }, [
-      e.displayIcon ? (v(), x(D, {
+      e.displayIcon ? (v(), p("joy-icon", {
         key: 0,
         name: _(o)
-      }, null, 8, ["name"])) : w("", !0),
-      b("div", Nl, [
-        b("strong", null, [
-          h(a.$slots, "highlight-title", {}, void 0, !0)
+      }, null, 8, Yl)) : w("", !0),
+      h("div", Xl, [
+        h("strong", null, [
+          b(a.$slots, "highlight-title", {}, void 0, !0)
         ]),
-        h(a.$slots, "default", {}, void 0, !0)
+        b(a.$slots, "default", {}, void 0, !0)
       ])
     ], 2));
   }
 });
-const Wl = /* @__PURE__ */ V(Hl, [["__scopeId", "data-v-aac4eb8a"]]), Ul = ["small", "medium", "large"], Gl = {
+const to = /* @__PURE__ */ V(eo, [["__scopeId", "data-v-a0ff7a60"]]), lo = ["small", "medium", "large"], oo = {
   key: 0,
   class: "joy-label-required"
-}, Kl = {
+}, no = {
   key: 1,
   class: "joy-label-optional"
-}, Ql = /* @__PURE__ */ $({
+}, ao = /* @__PURE__ */ $({
   __name: "VJoyLabel",
   props: {
     size: {
       type: String,
       default: "medium",
       validator(e) {
-        return Ul.includes(e);
+        return lo.includes(e);
       }
     },
     tagName: {
@@ -1537,24 +1517,24 @@ const Wl = /* @__PURE__ */ V(Hl, [["__scopeId", "data-v-aac4eb8a"]]), Ul = ["sma
     text: String
   },
   setup(e) {
-    return (l, t) => (v(), x(ce(e.tagName), Y({
+    return (l, t) => (v(), T(ce(e.tagName), Q({
       class: ["joy-label", `joy-label--${e.size}`]
     }, l.$attrs), {
-      default: L(() => [
-        h(l.$slots, "default", {}, () => [
-          C(I(e.text), 1)
+      default: E(() => [
+        b(l.$slots, "default", {}, () => [
+          L(x(e.text), 1)
         ], !0),
-        e.required ? (v(), p("span", Gl, "*")) : w("", !0),
-        e.optionalLabel ? (v(), p("span", Kl, "- " + I(e.optionalLabel), 1)) : w("", !0)
+        e.required ? (v(), p("span", oo, "*")) : w("", !0),
+        e.optionalLabel ? (v(), p("span", no, "- " + x(e.optionalLabel), 1)) : w("", !0)
       ]),
       _: 3
     }, 16, ["class"]));
   }
 });
-const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["large", "medium", "small"], Yl = ["id", "disabled", "type", "value"], Xl = ["data-unit"], eo = {
+const N = /* @__PURE__ */ V(ao, [["__scopeId", "data-v-1265214a"]]), io = ["large", "medium", "small"], ro = ["id", "disabled", "type", "value"], so = ["name"], uo = ["data-unit"], co = {
   inheritAttrs: !1
-}, to = /* @__PURE__ */ $({
-  ...eo,
+}, fo = /* @__PURE__ */ $({
+  ...co,
   __name: "VJoyInput",
   props: {
     disabled: {
@@ -1599,14 +1579,12 @@ const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["larg
       default: !1
     },
     /** Add a JoyIcon / joy-icon with given name on left-side. */
-    icon: {
-      type: String
-    },
+    icon: String,
     size: {
       type: String,
       default: "medium",
       validator(e) {
-        return Zl.includes(e);
+        return io.includes(e);
       }
     },
     type: String,
@@ -1615,11 +1593,11 @@ const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["larg
   },
   emits: ["update:modelValue"],
   setup(e, { emit: l }) {
-    const t = e, o = g(), a = g(), r = De(), s = G(), n = g(!1), c = B(() => typeof t.modelValue == "number" || !t.clearable || t.unit || !t.modelValue ? !1 : t.modelValue.length > 0 && !t.unit), f = B(() => s.default && s.default()), u = B(() => {
+    const t = e, o = g(), a = g(), r = Re(), s = W(), n = g(!1), c = I(() => typeof t.modelValue == "number" || !t.clearable || t.unit || !t.modelValue ? !1 : t.modelValue.length > 0 && !t.unit), f = I(() => s.default && s.default()), u = I(() => {
       var y, d;
       return !!((y = a.value) != null && y.closest("joy-wrapper")) || !!((d = a.value) != null && d.closest(".joy-wrapper"));
     }), m = g(t.type);
-    rt(() => {
+    ut(() => {
       m.value = t.unit ? "number" : t.unit || "text";
     });
     const i = {
@@ -1640,10 +1618,10 @@ const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["larg
     return (y, d) => (v(), p("div", {
       ref_key: "root",
       ref: a,
-      class: S([`joy-input--${t.size}`])
+      class: k([`joy-input--${t.size}`])
     }, [
-      b("div", {
-        class: S([
+      h("div", {
+        class: k([
           "joy-input",
           {
             "joy-input--focusing": n.value,
@@ -1653,22 +1631,22 @@ const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["larg
           }
         ])
       }, [
-        _(f) || e.label ? (v(), x(W, {
+        _(f) || e.label ? (v(), T(N, {
           key: 0,
           for: e.name,
           required: e.required && e.requiredMark,
           "optional-label": e.optionalLabel,
           size: e.labelSize
         }, {
-          default: L(() => [
-            h(y.$slots, "default", {}, () => [
-              C(I(e.label), 1)
+          default: E(() => [
+            b(y.$slots, "default", {}, () => [
+              L(x(e.label), 1)
             ], !0)
           ]),
           _: 3
         }, 8, ["for", "required", "optional-label", "size"])) : w("", !0),
-        b("div", {
-          class: S([
+        h("div", {
+          class: k([
             "joy-input--wrapper",
             {
               "joy-input--wrapper-has-icon": !!e.icon,
@@ -1678,7 +1656,7 @@ const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["larg
             }
           ])
         }, [
-          b("input", Y(y.$attrs, {
+          h("input", Q(y.$attrs, {
             id: t.name,
             ref_key: "input",
             ref: o,
@@ -1697,31 +1675,32 @@ const W = /* @__PURE__ */ V(Ql, [["__scopeId", "data-v-1265214a"]]), Zl = ["larg
             (...j) => i.onBlur && i.onBlur(...j)),
             onInput: d[2] || (d[2] = //@ts-ignore
             (...j) => i.onInput && i.onInput(...j))
-          }), null, 16, Yl),
-          _(c) ? (v(), x(D, {
+          }), null, 16, ro),
+          _(c) ? (v(), p("joy-icon", {
             key: 0,
             size: "xxsmall",
             name: "cross",
             class: "joy-input--clear",
-            onClick: i.clearValue
-          }, null, 8, ["onClick"])) : w("", !0),
-          e.icon && !e.clearable ? (v(), x(D, {
+            onClick: d[3] || (d[3] = //@ts-ignore
+            (...j) => i.clearValue && i.clearValue(...j))
+          })) : w("", !0),
+          e.icon && !e.clearable ? (v(), p("joy-icon", {
             key: 1,
             role: "img",
             class: "joy-input--decorative-icon",
             name: e.icon
-          }, null, 8, ["name"])) : w("", !0),
+          }, null, 8, so)) : w("", !0),
           e.unit ? (v(), p("div", {
             key: 2,
             "data-unit": e.unit,
             class: "joy-input--unit"
-          }, null, 8, Xl)) : w("", !0)
+          }, null, 8, uo)) : w("", !0)
         ], 2)
       ], 2)
     ], 2));
   }
 });
-const lo = /* @__PURE__ */ V(to, [["__scopeId", "data-v-b6f3034b"]]), oo = ["teal", "white"], no = ["href"], ao = /* @__PURE__ */ $({
+const yo = /* @__PURE__ */ V(fo, [["__scopeId", "data-v-35fce715"]]), mo = ["teal", "white"], vo = ["href"], po = ["color", "name"], ho = /* @__PURE__ */ $({
   __name: "VJoyLink",
   props: {
     href: {
@@ -1732,31 +1711,31 @@ const lo = /* @__PURE__ */ V(to, [["__scopeId", "data-v-b6f3034b"]]), oo = ["tea
       type: String,
       default: "teal",
       validator(e) {
-        return oo.includes(e);
+        return mo.includes(e);
       }
     },
-    icon: {
-      type: String
-    },
+    icon: String,
     text: String
   },
   setup(e) {
-    return (l, t) => (v(), p("a", Y({ href: e.href }, l.$attrs, {
+    const l = e, t = I(() => l.color === "white" ? "white" : "teal");
+    return (o, a) => (v(), p("a", Q({ href: e.href }, o.$attrs, {
       class: ["joy-link", `joy-link_${e.color}`]
     }), [
-      e.icon ? (v(), x(D, {
+      e.icon ? (v(), p("joy-icon", {
         key: 0,
+        color: _(t),
         name: e.icon
-      }, null, 8, ["name"])) : w("", !0),
-      h(l.$slots, "default", {}, () => [
-        C(I(e.text), 1)
+      }, null, 8, po)) : w("", !0),
+      b(o.$slots, "default", {}, () => [
+        L(x(e.text), 1)
       ], !0)
-    ], 16, no));
+    ], 16, vo));
   }
 });
-const io = /* @__PURE__ */ V(ao, [["__scopeId", "data-v-a8db21c2"]]), ro = ["id"], so = {
-  class: /* @__PURE__ */ S(["joy-multi-checkbox"])
-}, uo = /* @__PURE__ */ $({
+const bo = /* @__PURE__ */ V(ho, [["__scopeId", "data-v-920769ba"]]), go = ["id"], _o = {
+  class: /* @__PURE__ */ k(["joy-multi-checkbox"])
+}, wo = /* @__PURE__ */ $({
   __name: "VJoyMultiCheckbox",
   props: {
     options: {
@@ -1803,20 +1782,20 @@ const io = /* @__PURE__ */ V(ao, [["__scopeId", "data-v-a8db21c2"]]), ro = ["id"
       id: e.id,
       class: "joy-multi-checkbox__wrapper"
     }, [
-      e.label ? (v(), x(_(W), {
+      e.label ? (v(), T(_(N), {
         key: 0,
         "tag-name": "legend",
         required: e.required && e.requiredMark,
         "optional-label": e.optionalLabel,
         size: e.labelSize
       }, {
-        default: L(() => [
-          C(I(e.label), 1)
+        default: E(() => [
+          L(x(e.label), 1)
         ]),
         _: 1
       }, 8, ["required", "optional-label", "size"])) : w("", !0),
-      b("div", so, [
-        (v(!0), p(fe, null, ye(e.options, (n) => (v(), x(_(pe), {
+      h("div", _o, [
+        (v(!0), p(ye, null, me(e.options, (n) => (v(), T(_(he), {
           id: n.id,
           key: n.id,
           name: n.name,
@@ -1824,30 +1803,30 @@ const io = /* @__PURE__ */ V(ao, [["__scopeId", "data-v-a8db21c2"]]), ro = ["id"
           checked: o(n),
           "onUpdate:checked": (c) => a(n.value, c)
         }, {
-          default: L(() => [
-            h(r.$slots, "checkbox", me(ve(n)), () => [
-              C(I(n.label), 1)
+          default: E(() => [
+            b(r.$slots, "checkbox", ve(pe(n)), () => [
+              L(x(n.label), 1)
             ], !0)
           ]),
           _: 2
         }, 1032, ["id", "name", "value", "checked", "onUpdate:checked"]))), 128))
       ])
-    ], 8, ro));
+    ], 8, go));
   }
 });
-const co = /* @__PURE__ */ V(uo, [["__scopeId", "data-v-47574ced"]]), fo = ["small", "medium", "large"], yo = ["small", "large"], mo = {
+const So = /* @__PURE__ */ V(wo, [["__scopeId", "data-v-47574ced"]]), jo = ["small", "medium", "large"], ko = ["small", "large"], $o = {
   key: 0,
-  class: /* @__PURE__ */ S(["joy-panel__header"])
-}, vo = {
+  class: /* @__PURE__ */ k(["joy-panel__header"])
+}, Vo = {
   key: 1,
   class: "joy-panel__header-action"
-}, po = {
+}, xo = {
   key: 2,
   class: "joy-panel__header-subtitle"
-}, ho = { class: "joy-panel__body" }, bo = {
+}, Oo = { class: "joy-panel__body" }, Io = {
   key: 1,
   class: "joy-panel__footer"
-}, go = /* @__PURE__ */ $({
+}, Bo = /* @__PURE__ */ $({
   __name: "VJoyPanel",
   props: {
     flex: {
@@ -1861,24 +1840,24 @@ const co = /* @__PURE__ */ V(uo, [["__scopeId", "data-v-47574ced"]]), fo = ["sma
       type: String,
       default: "medium",
       validator(e) {
-        return fo.includes(e);
+        return jo.includes(e);
       }
     },
     titleSize: {
       type: String,
       default: "large",
       validator(e) {
-        return yo.includes(e);
+        return ko.includes(e);
       }
     }
   },
   setup(e) {
-    const l = st("VJoyWrapperContext", {}), t = B(() => Object.keys(l).length > 0), o = G(), a = g(), r = B(() => o["panel-title"] || o["panel-subtitle"] || o["panel-title-action"]);
+    const l = dt("VJoyWrapperContext", {}), t = I(() => Object.keys(l).length > 0), o = W(), a = g(), r = I(() => o["panel-title"] || o["panel-subtitle"] || o["panel-title-action"]);
     return (s, n) => (v(), p("section", {
       ref_key: "panel",
       ref: a,
-      style: Z({ flex: e.flex }),
-      class: S([
+      style: K({ flex: e.flex }),
+      class: k([
         "joy-panel",
         `joy-panel--${e.padding}`,
         {
@@ -1886,50 +1865,50 @@ const co = /* @__PURE__ */ V(uo, [["__scopeId", "data-v-47574ced"]]), fo = ["sma
         }
       ])
     }, [
-      _(r) ? (v(), p("header", mo, [
+      _(r) ? (v(), p("header", $o, [
         _(o)["panel-title"] ? (v(), p("div", {
           key: 0,
-          class: S(["joy-panel__header-title", `joy-panel__header-title--${e.titleSize}`])
+          class: k(["joy-panel__header-title", `joy-panel__header-title--${e.titleSize}`])
         }, [
-          h(s.$slots, "panel-title", {}, void 0, !0)
+          b(s.$slots, "panel-title", {}, void 0, !0)
         ], 2)) : w("", !0),
-        _(o)["panel-title-action"] ? (v(), p("div", vo, [
-          h(s.$slots, "panel-title-action", {}, void 0, !0)
+        _(o)["panel-title-action"] ? (v(), p("div", Vo, [
+          b(s.$slots, "panel-title-action", {}, void 0, !0)
         ])) : w("", !0),
-        _(o)["panel-subtitle"] ? (v(), p("div", po, [
-          h(s.$slots, "panel-subtitle", {}, void 0, !0)
+        _(o)["panel-subtitle"] ? (v(), p("div", xo, [
+          b(s.$slots, "panel-subtitle", {}, void 0, !0)
         ])) : w("", !0)
       ])) : w("", !0),
-      b("div", ho, [
-        h(s.$slots, "panel-body", {}, void 0, !0)
+      h("div", Oo, [
+        b(s.$slots, "panel-body", {}, void 0, !0)
       ]),
-      _(o)["panel-action"] ? (v(), p("footer", bo, [
-        h(s.$slots, "panel-action", {}, void 0, !0)
+      _(o)["panel-action"] ? (v(), p("footer", Io, [
+        b(s.$slots, "panel-action", {}, void 0, !0)
       ])) : w("", !0)
     ], 6));
   }
 });
-const _o = /* @__PURE__ */ V(go, [["__scopeId", "data-v-49d83306"]]), wo = { class: "joy-panel-section" }, So = {
+const Eo = /* @__PURE__ */ V(Bo, [["__scopeId", "data-v-49d83306"]]), Lo = { class: "joy-panel-section" }, Co = {
   key: 0,
   class: "joy-panel-section__title"
-}, ko = {
+}, Po = {
   key: 1,
   class: "joy-panel-section__content"
-}, jo = /* @__PURE__ */ $({
+}, Jo = /* @__PURE__ */ $({
   __name: "VJoyPanelSection",
   setup(e) {
-    const l = G();
-    return (t, o) => (v(), p("div", wo, [
-      _(l)["panel-section-title"] ? (v(), p("div", So, [
-        h(t.$slots, "panel-section-title", {}, void 0, !0)
+    const l = W();
+    return (t, o) => (v(), p("div", Lo, [
+      _(l)["panel-section-title"] ? (v(), p("div", Co, [
+        b(t.$slots, "panel-section-title", {}, void 0, !0)
       ])) : w("", !0),
-      _(l)["panel-section-content"] ? (v(), p("div", ko, [
-        h(t.$slots, "panel-section-content", {}, void 0, !0)
+      _(l)["panel-section-content"] ? (v(), p("div", Po, [
+        b(t.$slots, "panel-section-content", {}, void 0, !0)
       ])) : w("", !0)
     ]));
   }
 });
-const $o = /* @__PURE__ */ V(jo, [["__scopeId", "data-v-d88510ab"]]), Vo = ["id", "value", "checked", "disabled", "required", "name"], xo = { class: "joy-radio-label" }, Io = { class: "joy-radio-content__wrapper" }, Oo = { class: "joy-radio-content" }, Bo = /* @__PURE__ */ $({
+const To = /* @__PURE__ */ V(Jo, [["__scopeId", "data-v-d88510ab"]]), qo = ["id", "value", "checked", "disabled", "required", "name"], zo = { class: "joy-radio-label" }, Ao = { class: "joy-radio-content__wrapper" }, Fo = { class: "joy-radio-content" }, Do = /* @__PURE__ */ $({
   __name: "VJoyRadio",
   props: {
     disabled: {
@@ -1965,14 +1944,14 @@ const $o = /* @__PURE__ */ V(jo, [["__scopeId", "data-v-d88510ab"]]), Vo = ["id"
   },
   emits: ["update:modelValue"],
   setup(e, { expose: l, emit: t }) {
-    const o = e, a = g(!1), r = g(!1), s = g(null), n = g(null), c = G(), f = B(() => !o.modelValue || !o.value ? !1 : o.modelValue === o.value);
+    const o = e, a = g(!1), r = g(!1), s = g(null), n = g(null), c = W(), f = I(() => !o.modelValue || !o.value ? !1 : o.modelValue === o.value);
     function u() {
       a.value = !!c["expandable-content"] && f.value;
     }
     function m() {
       t("update:modelValue", o.value), u();
     }
-    X(() => {
+    Z(() => {
       o.theme === "outline" && u();
     });
     function i() {
@@ -1981,7 +1960,7 @@ const $o = /* @__PURE__ */ V(jo, [["__scopeId", "data-v-d88510ab"]]), Vo = ["id"
     function y() {
       r.value = !1;
     }
-    return P(
+    return C(
       () => o.modelValue,
       () => {
         u();
@@ -1992,7 +1971,7 @@ const $o = /* @__PURE__ */ V(jo, [["__scopeId", "data-v-d88510ab"]]), Vo = ["id"
     }), (d, j) => (v(), p("label", {
       ref_key: "root",
       ref: s,
-      class: S([
+      class: k([
         "joy-radio",
         `joy-radio--${e.theme}`,
         {
@@ -2004,7 +1983,7 @@ const $o = /* @__PURE__ */ V(jo, [["__scopeId", "data-v-d88510ab"]]), Vo = ["id"
         }
       ])
     }, [
-      b("input", {
+      h("input", {
         id: e.id,
         type: "radio",
         value: e.value,
@@ -2015,26 +1994,26 @@ const $o = /* @__PURE__ */ V(jo, [["__scopeId", "data-v-d88510ab"]]), Vo = ["id"
         onChange: m,
         onFocus: i,
         onBlur: y
-      }, null, 40, Vo),
-      b("span", xo, [
-        h(d.$slots, "default", {}, void 0, !0)
+      }, null, 40, qo),
+      h("span", zo, [
+        b(d.$slots, "default", {}, void 0, !0)
       ]),
-      b("div", Io, [
-        b("div", Oo, [
-          h(d.$slots, "radio-content", {}, void 0, !0)
+      h("div", Ao, [
+        h("div", Fo, [
+          b(d.$slots, "radio-content", {}, void 0, !0)
         ]),
-        b("div", {
+        h("div", {
           ref_key: "expandableElement",
           ref: n,
-          class: S(["joy-radio-expandable", { "joy-radio-expandable--expanded": a.value }])
+          class: k(["joy-radio-expandable", { "joy-radio-expandable--expanded": a.value }])
         }, [
-          h(d.$slots, "expandable-content", {}, void 0, !0)
+          b(d.$slots, "expandable-content", {}, void 0, !0)
         ], 2)
       ])
     ], 2));
   }
 });
-const Eo = /* @__PURE__ */ V(Bo, [["__scopeId", "data-v-24cea99b"]]), Lo = ["form", "name"], Co = /* @__PURE__ */ $({
+const Ro = /* @__PURE__ */ V(Do, [["__scopeId", "data-v-24cea99b"]]), Mo = ["form", "name"], No = /* @__PURE__ */ $({
   __name: "VJoyRadioGroup",
   props: {
     direction: {
@@ -2056,16 +2035,19 @@ const Eo = /* @__PURE__ */ V(Bo, [["__scopeId", "data-v-24cea99b"]]), Lo = ["for
       form: e.form,
       name: e.name
     }, [
-      h(l.$slots, "radio-group-legend", {}, void 0, !0),
-      b("div", {
-        class: S(["joy-radio-group-container", `joy-radio-group-${e.direction}`])
+      b(l.$slots, "radio-group-legend", {}, void 0, !0),
+      h("div", {
+        class: k(["joy-radio-group-container", `joy-radio-group-${e.direction}`])
       }, [
-        h(l.$slots, "default", {}, void 0, !0)
+        b(l.$slots, "default", {}, void 0, !0)
       ], 2)
-    ], 8, Lo));
+    ], 8, Mo));
   }
 });
-const Po = /* @__PURE__ */ V(Co, [["__scopeId", "data-v-ace1a80f"]]), Jo = ["id", "name", "aria-invalid", "required", "disabled", "value"], To = /* @__PURE__ */ $({
+const Ho = /* @__PURE__ */ V(No, [["__scopeId", "data-v-ace1a80f"]]), Wo = (e) => (te("data-v-ab4d0113"), e = e(), le(), e), Uo = ["id", "name", "aria-invalid", "required", "disabled", "value"], Go = /* @__PURE__ */ Wo(() => /* @__PURE__ */ h("joy-icon", {
+  class: "joy-select__chevron",
+  name: "chevron-down"
+}, null, -1)), Ko = /* @__PURE__ */ $({
   __name: "VJoySelect",
   props: {
     disabled: {
@@ -2106,8 +2088,8 @@ const Po = /* @__PURE__ */ V(Co, [["__scopeId", "data-v-ace1a80f"]]), Jo = ["id"
   },
   emits: ["update:modelValue"],
   setup(e, { emit: l }) {
-    const t = e, o = g(), a = g(), r = G(), s = g(!1);
-    X(() => {
+    const t = e, o = g(), a = g(), r = W(), s = g(!1);
+    Z(() => {
       var i;
       const u = r.label && r.label();
       if (!u || !u.length)
@@ -2136,29 +2118,29 @@ const Po = /* @__PURE__ */ V(Co, [["__scopeId", "data-v-ace1a80f"]]), Jo = ["id"
       ref_key: "root",
       ref: o
     }, [
-      h(u.$slots, "select-label", {}, () => [
-        e.label ? (v(), x(W, {
+      b(u.$slots, "select-label", {}, () => [
+        e.label ? (v(), T(N, {
           key: 0,
           required: e.required && e.requiredMark,
           "optional-label": e.optionalLabel,
           for: e.id || e.name,
           size: e.labelSize
         }, {
-          default: L(() => [
-            C(I(e.label), 1)
+          default: E(() => [
+            L(x(e.label), 1)
           ]),
           _: 1
         }, 8, ["required", "optional-label", "for", "size"])) : w("", !0)
       ], !0),
-      b("div", {
-        class: S({
+      h("div", {
+        class: k({
           "joy-select__wrapper": !0,
           "joy-select--invalid": e.invalid,
           "joy-select--disabled": e.disabled,
           "joy-select--focusing": s.value
         })
       }, [
-        b("select", {
+        h("select", {
           id: e.id || e.name,
           ref_key: "select",
           ref: a,
@@ -2172,17 +2154,14 @@ const Po = /* @__PURE__ */ V(Co, [["__scopeId", "data-v-ace1a80f"]]), Jo = ["id"
           onFocus: c,
           onBlur: f
         }, [
-          h(u.$slots, "default", {}, void 0, !0)
-        ], 40, Jo),
-        N(D, {
-          class: "joy-select__chevron",
-          name: "chevron-down"
-        })
+          b(u.$slots, "default", {}, void 0, !0)
+        ], 40, Uo),
+        Go
       ], 2)
     ], 512));
   }
 });
-const qo = /* @__PURE__ */ V(To, [["__scopeId", "data-v-b1af08d1"]]), zo = ["aria-disabled"], Ao = ["id", "value", "checked", "disabled", "required", "name"], Fo = /* @__PURE__ */ $({
+const Qo = /* @__PURE__ */ V(Ko, [["__scopeId", "data-v-ab4d0113"]]), Zo = ["aria-disabled"], Yo = ["id", "value", "checked", "disabled", "required", "name"], Xo = /* @__PURE__ */ $({
   __name: "VJoySelectableItem",
   props: {
     disabled: {
@@ -2240,7 +2219,7 @@ const qo = /* @__PURE__ */ V(To, [["__scopeId", "data-v-b1af08d1"]]), zo = ["ari
       l("update:checked", f);
     }
     return (f, u) => (v(), p("div", {
-      class: S([
+      class: k([
         "joy-selectable-item__wrapper",
         {
           "joy-selectable-item--focusing": r.value
@@ -2267,10 +2246,10 @@ const qo = /* @__PURE__ */ V(To, [["__scopeId", "data-v-b1af08d1"]]), zo = ["ari
         (...m) => n.onFocus && n.onFocus(...m)),
         onBlur: u[2] || (u[2] = //@ts-ignore
         (...m) => n.onBlur && n.onBlur(...m))
-      }, null, 40, Ao)),
-      (v(), x(ce(_(s)), {
+      }, null, 40, Yo)),
+      (v(), T(ce(_(s)), {
         for: e.id,
-        class: S([
+        class: k([
           "joy-selectable-item",
           {
             "joy-selectable-item--disabled": e.disabled,
@@ -2281,8 +2260,8 @@ const qo = /* @__PURE__ */ V(To, [["__scopeId", "data-v-b1af08d1"]]), zo = ["ari
         ]),
         onClick: n.onLabelClick
       }, {
-        default: L(() => [
-          e.multiple ? (v(), x(_(pe), {
+        default: E(() => [
+          e.multiple ? (v(), T(_(he), {
             key: 0,
             id: e.id,
             checked: o.value,
@@ -2298,24 +2277,24 @@ const qo = /* @__PURE__ */ V(To, [["__scopeId", "data-v-b1af08d1"]]), zo = ["ari
             onFocus: n.onFocus,
             onBlur: n.onBlur
           }, {
-            default: L(() => [
-              h(f.$slots, "default", {}, void 0, !0)
+            default: E(() => [
+              b(f.$slots, "default", {}, void 0, !0)
             ]),
             _: 3
           }, 8, ["id", "checked", "disabled", "value", "name", "required", "onFocus", "onBlur"])) : w("", !0),
-          e.multiple ? w("", !0) : h(f.$slots, "default", { key: 1 }, void 0, !0),
-          b("div", {
-            class: S([{ "joy-selectable-item__sublabel": f.$slots["selectable-item-sublabel"] }])
+          e.multiple ? w("", !0) : b(f.$slots, "default", { key: 1 }, void 0, !0),
+          h("div", {
+            class: k([{ "joy-selectable-item__sublabel": f.$slots["selectable-item-sublabel"] }])
           }, [
-            h(f.$slots, "selectable-item-sublabel", {}, void 0, !0)
+            b(f.$slots, "selectable-item-sublabel", {}, void 0, !0)
           ], 2)
         ]),
         _: 3
       }, 8, ["for", "class", "onClick"]))
-    ], 10, zo));
+    ], 10, Zo));
   }
 });
-const et = /* @__PURE__ */ V(Fo, [["__scopeId", "data-v-cb2531c0"]]), Do = ["id"], Ro = /* @__PURE__ */ $({
+const lt = /* @__PURE__ */ V(Xo, [["__scopeId", "data-v-cb2531c0"]]), en = ["id"], tn = /* @__PURE__ */ $({
   __name: "VJoySelectableItemGroup",
   props: {
     options: {
@@ -2370,20 +2349,20 @@ const et = /* @__PURE__ */ V(Fo, [["__scopeId", "data-v-cb2531c0"]]), Do = ["id"
       id: e.id,
       class: "joy-selectable-item-group__wrapper"
     }, [
-      e.label ? (v(), x(_(W), {
+      e.label ? (v(), T(_(N), {
         key: 0,
         "tag-name": "legend",
         required: e.required && e.requiredMark,
         "optional-label": e.optionalLabel,
         size: e.labelSize
       }, {
-        default: L(() => [
-          C(I(e.label), 1)
+        default: E(() => [
+          L(x(e.label), 1)
         ]),
         _: 1
       }, 8, ["required", "optional-label", "size"])) : w("", !0),
-      b("div", {
-        class: S([
+      h("div", {
+        class: k([
           "joy-selectable-item-group",
           {
             "joy-selectable-item-group--multiple": e.multiple,
@@ -2392,7 +2371,7 @@ const et = /* @__PURE__ */ V(Fo, [["__scopeId", "data-v-cb2531c0"]]), Do = ["id"
           }
         ])
       }, [
-        (v(!0), p(fe, null, ye(e.options, (n) => (v(), x(_(et), {
+        (v(!0), p(ye, null, me(e.options, (n) => (v(), T(_(lt), {
           id: n.id,
           key: n.id,
           name: n.name,
@@ -2400,25 +2379,25 @@ const et = /* @__PURE__ */ V(Fo, [["__scopeId", "data-v-cb2531c0"]]), Do = ["id"
           multiple: e.multiple,
           checked: o(n),
           "onUpdate:checked": (c) => a(n.value, c)
-        }, Ne({
-          default: L(() => [
-            C(I(n.label) + " ", 1)
+        }, He({
+          default: E(() => [
+            L(x(n.label) + " ", 1)
           ]),
           _: 2
         }, [
           n.subLabel ? {
             name: "selectable-item-sublabel",
-            fn: L(() => [
-              C(I(n.subLabel), 1)
+            fn: E(() => [
+              L(x(n.subLabel), 1)
             ]),
             key: "0"
           } : void 0
         ]), 1032, ["id", "name", "value", "multiple", "checked", "onUpdate:checked"]))), 128))
       ], 2)
-    ], 8, Do));
+    ], 8, en));
   }
 });
-const Mo = /* @__PURE__ */ V(Ro, [["__scopeId", "data-v-3ba17434"]]), No = /* @__PURE__ */ $({
+const ln = /* @__PURE__ */ V(tn, [["__scopeId", "data-v-3ba17434"]]), on = /* @__PURE__ */ $({
   __name: "VJoyWrapper",
   props: {
     /** Horizontal spread. Refers to CSS flex justify-content. */
@@ -2452,8 +2431,8 @@ const Mo = /* @__PURE__ */ V(Ro, [["__scopeId", "data-v-3ba17434"]]), No = /* @_
     }
   },
   setup(e) {
-    return ut("VJoyWrapperContext", e), (t, o) => (v(), p("div", {
-      class: S([
+    return ct("VJoyWrapperContext", e), (t, o) => (v(), p("div", {
+      class: k([
         "joy-wrapper",
         `joy-wrapper--justify-${e.justify}`,
         `joy-wrapper--align-${e.align}`,
@@ -2463,85 +2442,90 @@ const Mo = /* @__PURE__ */ V(Ro, [["__scopeId", "data-v-3ba17434"]]), No = /* @_
         { "joy-wrapper--has-margin": !e.noMargin }
       ])
     }, [
-      h(t.$slots, "default", {}, void 0, !0)
+      b(t.$slots, "default", {}, void 0, !0)
     ], 2));
   }
 });
-const Ho = /* @__PURE__ */ V(No, [["__scopeId", "data-v-e2f29698"]]), Wo = { class: "joy-template__wrapper" }, Uo = {
+const nn = /* @__PURE__ */ V(on, [["__scopeId", "data-v-e2f29698"]]), an = { class: "joy-template__wrapper" }, rn = {
   key: 0,
   class: "joy-template__heading"
-}, Go = {
+}, sn = {
   key: 0,
   class: "joy-template-slot-back"
-}, Ko = { class: "joy-template__heading___headings" }, Qo = {
+}, un = { class: "joy-template__heading___headings" }, dn = {
   key: 0,
   class: "joy-template-slot-title"
-}, Zo = {
+}, cn = {
   key: 1,
   class: "joy-template-slot-subtitle"
-}, Yo = {
+}, fn = {
   key: 1,
   class: "joy-template-slot-actions"
-}, Xo = {
+}, yn = {
   key: 0,
   class: "joy-template-slot-main"
-}, en = {
+}, mn = {
   key: 1,
   class: "joy-template-slot-sidebar"
-}, tn = /* @__PURE__ */ $({
+}, vn = /* @__PURE__ */ $({
   __name: "VJoyTemplate",
   props: {
     full: { type: Boolean, default: !1 },
     sidebar: { type: String, default: "right" }
   },
   setup(e) {
-    const l = e, t = G(), o = B(() => !!t["template-back"] || !!t["template-title"] || !!t["template-subtitle"] || !!t["template-actions"]);
+    const l = e, t = W(), o = I(() => !!t["template-back"] || !!t["template-title"] || !!t["template-subtitle"] || !!t["template-actions"]);
     return (a, r) => (v(), p("main", {
-      class: S(["joy-template", { "joy-template--full": l.full }])
+      class: k(["joy-template", { "joy-template--full": l.full }])
     }, [
-      b("div", Wo, [
-        _(o) ? (v(), p("div", Uo, [
-          _(t)["template-back"] ? (v(), p("div", Go, [
-            h(a.$slots, "template-back", {}, void 0, !0)
+      h("div", an, [
+        _(o) ? (v(), p("div", rn, [
+          _(t)["template-back"] ? (v(), p("div", sn, [
+            b(a.$slots, "template-back", {}, void 0, !0)
           ])) : w("", !0),
-          b("div", Ko, [
-            _(t)["template-title"] ? (v(), p("div", Qo, [
-              h(a.$slots, "template-title", {}, void 0, !0)
+          h("div", un, [
+            _(t)["template-title"] ? (v(), p("div", dn, [
+              b(a.$slots, "template-title", {}, void 0, !0)
             ])) : w("", !0),
-            _(t)["template-subtitle"] ? (v(), p("div", Zo, [
-              h(a.$slots, "template-subtitle", {}, void 0, !0)
+            _(t)["template-subtitle"] ? (v(), p("div", cn, [
+              b(a.$slots, "template-subtitle", {}, void 0, !0)
             ])) : w("", !0)
           ]),
-          _(t)["template-actions"] ? (v(), p("div", Yo, [
-            h(a.$slots, "template-actions", {}, void 0, !0)
+          _(t)["template-actions"] ? (v(), p("div", fn, [
+            b(a.$slots, "template-actions", {}, void 0, !0)
           ])) : w("", !0)
         ])) : w("", !0),
-        b("div", {
-          class: S([
+        h("div", {
+          class: k([
             "joy-template__content",
             {
               "joy-template__content--reverse": l.sidebar === "left"
             }
           ])
         }, [
-          a.$slots["template-main"] ? (v(), p("div", Xo, [
-            h(a.$slots, "template-main", {}, void 0, !0)
+          a.$slots["template-main"] ? (v(), p("div", yn, [
+            b(a.$slots, "template-main", {}, void 0, !0)
           ])) : w("", !0),
-          a.$slots["template-sidebar"] ? (v(), p("div", en, [
-            h(a.$slots, "template-sidebar", {}, void 0, !0)
+          a.$slots["template-sidebar"] ? (v(), p("div", mn, [
+            b(a.$slots, "template-sidebar", {}, void 0, !0)
           ])) : w("", !0)
         ], 2)
       ])
     ], 2));
   }
 });
-const ln = /* @__PURE__ */ V(tn, [["__scopeId", "data-v-85e0d8cf"]]), on = ["aria-disabled"], nn = { class: "joy-textarea_wrapper" }, an = ["id", "disabled", "name", "required", "minlength", "value"], rn = {
+const pn = /* @__PURE__ */ V(vn, [["__scopeId", "data-v-85e0d8cf"]]), hn = ["aria-disabled"], bn = { class: "joy-textarea_wrapper" }, gn = ["id", "disabled", "name", "required", "minlength", "value"], _n = {
   key: 0,
   class: "joy-textarea_helpers"
-}, sn = {
+}, wn = {
+  key: 0,
+  name: "check",
+  color: "grey",
+  size: "xxsmall"
+}, Sn = {
   inheritAttrs: !1
-}, un = /* @__PURE__ */ $({
-  ...sn,
+}, jn = /* @__PURE__ */ $({
+  ...Sn,
   __name: "VJoyTextarea",
   props: {
     disabled: {
@@ -2590,9 +2574,9 @@ const ln = /* @__PURE__ */ V(tn, [["__scopeId", "data-v-85e0d8cf"]]), on = ["ari
   },
   emits: ["update:modelValue"],
   setup(e, { expose: l, emit: t }) {
-    const o = e, a = g(), { triggerResize: r } = Yt({
+    const o = e, a = g(), { triggerResize: r } = nl({
       element: o.autogrow ? a : void 0
-    }), s = g(!1), n = g(!1), c = B(() => o.maxlength ? o.modelValue.length > o.maxlength : !1), f = B(() => o.minlength ? o.modelValue.length < o.minlength : !1), u = {
+    }), s = g(!1), n = g(!1), c = I(() => o.maxlength ? o.modelValue.length > o.maxlength : !1), f = I(() => o.minlength ? o.modelValue.length < o.minlength : !1), u = {
       onInput: (m) => {
         t("update:modelValue", m.target.value), r();
       },
@@ -2609,7 +2593,7 @@ const ln = /* @__PURE__ */ V(tn, [["__scopeId", "data-v-85e0d8cf"]]), on = ["ari
       valueUnderMinlength: f
     }), (m, i) => (v(), p("div", {
       "aria-disabled": e.disabled,
-      class: S([
+      class: k([
         "joy-textarea",
         {
           "joy-textarea_invalid": s.value || e.invalid,
@@ -2619,21 +2603,21 @@ const ln = /* @__PURE__ */ V(tn, [["__scopeId", "data-v-85e0d8cf"]]), on = ["ari
         }
       ])
     }, [
-      N(_(W), {
+      fe(_(N), {
         for: e.id,
         required: e.required && e.requiredMark,
         "optional-label": e.optionalLabel,
         size: e.labelSize
       }, {
-        default: L(() => [
-          h(m.$slots, "default", {}, () => [
-            C(I(e.label), 1)
+        default: E(() => [
+          b(m.$slots, "default", {}, () => [
+            L(x(e.label), 1)
           ], !0)
         ]),
         _: 3
       }, 8, ["for", "required", "optional-label", "size"]),
-      b("div", nn, [
-        b("textarea", Y(m.$attrs, {
+      h("div", bn, [
+        h("textarea", Q(m.$attrs, {
           id: e.id,
           ref_key: "textarea",
           ref: a,
@@ -2649,43 +2633,38 @@ const ln = /* @__PURE__ */ V(tn, [["__scopeId", "data-v-85e0d8cf"]]), on = ["ari
           (...y) => u.onFocus && u.onFocus(...y)),
           onBlur: i[2] || (i[2] = //@ts-ignore
           (...y) => u.onBlur && u.onBlur(...y))
-        }), null, 16, an)
+        }), null, 16, gn)
       ]),
-      e.minlength || e.maxlength ? (v(), p("div", rn, [
+      e.minlength || e.maxlength ? (v(), p("div", _n, [
         e.minlength ? (v(), p("p", {
           key: 0,
-          class: S(["joy-textarea-min", { "joy-textarea-min-invalid": e.invalid }])
+          class: k(["joy-textarea-min", { "joy-textarea-min-invalid": e.invalid }])
         }, [
-          _(f) ? w("", !0) : (v(), x(D, {
-            key: 0,
-            name: "check",
-            color: "neutral",
-            size: "xxsmall"
-          })),
-          C(" " + I(e.minlengthLabel || `Minimum ${e.minlength} characters`), 1)
+          _(f) ? w("", !0) : (v(), p("joy-icon", wn)),
+          L(" " + x(e.minlengthLabel || `Minimum ${e.minlength} characters`), 1)
         ], 2)) : w("", !0),
         e.maxlength ? (v(), p("p", {
           key: 1,
-          class: S(["joy-textarea-count", { "joy-textarea-count-invalid": _(c) }])
-        }, I(e.modelValue.length + "/" + e.maxlength), 3)) : w("", !0)
+          class: k(["joy-textarea-count", { "joy-textarea-count-invalid": _(c) }])
+        }, x(e.modelValue.length + "/" + e.maxlength), 3)) : w("", !0)
       ])) : w("", !0)
-    ], 10, on));
+    ], 10, hn));
   }
 });
-const dn = /* @__PURE__ */ V(un, [["__scopeId", "data-v-d0d2c93e"]]), tt = (e) => (dt("data-v-cf79d999"), e = e(), ct(), e), cn = { class: "joy-toggle__wrapper" }, fn = ["name", "disabled", "checked", "required", "aria-checked", "value"], yn = { class: "joy-toggle__content" }, mn = /* @__PURE__ */ tt(() => /* @__PURE__ */ b("span", { class: "joy-toggle__symbol" }, null, -1)), vn = { class: "joy-toggle__content-label" }, pn = /* @__PURE__ */ tt(() => /* @__PURE__ */ b("span", { class: "joy-toggle__smile" }, [
-  /* @__PURE__ */ b("svg", {
+const kn = /* @__PURE__ */ V(jn, [["__scopeId", "data-v-627a255b"]]), ot = (e) => (te("data-v-cf79d999"), e = e(), le(), e), $n = { class: "joy-toggle__wrapper" }, Vn = ["name", "disabled", "checked", "required", "aria-checked", "value"], xn = { class: "joy-toggle__content" }, On = /* @__PURE__ */ ot(() => /* @__PURE__ */ h("span", { class: "joy-toggle__symbol" }, null, -1)), In = { class: "joy-toggle__content-label" }, Bn = /* @__PURE__ */ ot(() => /* @__PURE__ */ h("span", { class: "joy-toggle__smile" }, [
+  /* @__PURE__ */ h("svg", {
     width: "18",
     height: "10",
     viewBox: "0 0 18 10",
     fill: "currentColor",
     xmlns: "http://www.w3.org/2000/svg"
   }, [
-    /* @__PURE__ */ b("path", {
+    /* @__PURE__ */ h("path", {
       d: "M9.0237 9.14856C15.7144 9.14856 17.8736 2.22231 17.9649 1.91853L17.9345 1.94891C18.1778 1.15908 17.7216 0.308485 16.9309 0.0654591C16.1402 -0.177566 15.2886 0.278108 15.0453 1.06794C14.9845 1.25021 13.5551 6.11073 8.99328 6.11073C4.43147 6.11073 3.03249 1.43248 2.97167 1.21983C2.75878 0.399622 1.90724 -0.0560541 1.11652 0.156593C0.295397 0.369241 -0.160787 1.18945 0.0520982 2.00967C0.721165 4.4703 3.48869 9.14856 9.0237 9.14856Z",
       fill: "currentColor"
     })
   ])
-], -1)), hn = /* @__PURE__ */ $({
+], -1)), En = /* @__PURE__ */ $({
   __name: "VJoyToggle",
   props: {
     modelValue: {
@@ -2731,9 +2710,9 @@ const dn = /* @__PURE__ */ V(un, [["__scopeId", "data-v-d0d2c93e"]]), tt = (e) =
         t.value = !1;
       }
     };
-    return (a, r) => (v(), p("div", cn, [
-      b("label", {
-        class: S([
+    return (a, r) => (v(), p("div", $n, [
+      h("label", {
+        class: k([
           "joy-toggle",
           {
             "joy-toggle__checked": e.modelValue,
@@ -2742,7 +2721,7 @@ const dn = /* @__PURE__ */ V(un, [["__scopeId", "data-v-d0d2c93e"]]), tt = (e) =
           }
         ])
       }, [
-        b("input", {
+        h("input", {
           ref: "input",
           type: "checkbox",
           class: "joy-toggle__input",
@@ -2759,79 +2738,77 @@ const dn = /* @__PURE__ */ V(un, [["__scopeId", "data-v-d0d2c93e"]]), tt = (e) =
           (...s) => o.onFocus && o.onFocus(...s)),
           onBlur: r[2] || (r[2] = //@ts-ignore
           (...s) => o.onBlur && o.onBlur(...s))
-        }, null, 40, fn),
-        b("p", yn, [
-          mn,
-          b("span", vn, [
-            h(a.$slots, "default", {}, () => [
-              C(I(e.label), 1)
+        }, null, 40, Vn),
+        h("p", xn, [
+          On,
+          h("span", In, [
+            b(a.$slots, "default", {}, () => [
+              L(x(e.label), 1)
             ], !0)
           ]),
-          pn
+          Bn
         ])
       ], 2)
     ]));
   }
 });
-const bn = /* @__PURE__ */ V(hn, [["__scopeId", "data-v-cf79d999"]]), gn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Ln = /* @__PURE__ */ V(En, [["__scopeId", "data-v-cf79d999"]]), Cn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   VJoyBadge: mt,
-  VJoyButton: jt,
-  VJoyCheckbox: pe,
-  VJoyCounter: At,
-  VJoyDropdown: Al,
-  VJoyDropdownList: Ye,
-  VJoyFormError: Xe,
-  VJoyHighlight: Wl,
-  VJoyIcon: D,
-  VJoyInput: lo,
-  VJoyLabel: W,
-  VJoyLink: io,
-  VJoyMultiCheckbox: co,
-  VJoyPanel: _o,
-  VJoyPanelSection: $o,
-  VJoyRadio: Eo,
-  VJoyRadioGroup: Po,
-  VJoySelect: qo,
-  VJoySelectableItem: et,
-  VJoySelectableItemGroup: Mo,
-  VJoySpinner: He,
-  VJoyTemplate: ln,
-  VJoyTextarea: dn,
-  VJoyToggle: bn,
-  VJoyWrapper: Ho
-}, Symbol.toStringTag, { value: "Module" })), wn = {
+  VJoyButton: Vt,
+  VJoyCheckbox: he,
+  VJoyCounter: Ht,
+  VJoyDropdown: Hl,
+  VJoyDropdownList: et,
+  VJoyFormError: tt,
+  VJoyHighlight: to,
+  VJoyInput: yo,
+  VJoyLabel: N,
+  VJoyLink: bo,
+  VJoyMultiCheckbox: So,
+  VJoyPanel: Eo,
+  VJoyPanelSection: To,
+  VJoyRadio: Ro,
+  VJoyRadioGroup: Ho,
+  VJoySelect: Qo,
+  VJoySelectableItem: lt,
+  VJoySelectableItemGroup: ln,
+  VJoySpinner: We,
+  VJoyTemplate: pn,
+  VJoyTextarea: kn,
+  VJoyToggle: Ln,
+  VJoyWrapper: nn
+}, Symbol.toStringTag, { value: "Module" })), Jn = {
   install: (e) => {
-    Object.entries(gn).forEach(([l, t]) => {
+    Object.entries(Cn).forEach(([l, t]) => {
       e.component(l, t);
     });
   }
 };
 export {
-  wn as JoyVuePlugin,
+  Jn as JoyVuePlugin,
   mt as VJoyBadge,
-  jt as VJoyButton,
-  pe as VJoyCheckbox,
-  At as VJoyCounter,
-  Al as VJoyDropdown,
-  Ye as VJoyDropdownList,
-  Xe as VJoyFormError,
-  Wl as VJoyHighlight,
-  D as VJoyIcon,
-  lo as VJoyInput,
-  W as VJoyLabel,
-  io as VJoyLink,
-  co as VJoyMultiCheckbox,
-  _o as VJoyPanel,
-  $o as VJoyPanelSection,
-  Eo as VJoyRadio,
-  Po as VJoyRadioGroup,
-  qo as VJoySelect,
-  et as VJoySelectableItem,
-  Mo as VJoySelectableItemGroup,
-  He as VJoySpinner,
-  ln as VJoyTemplate,
-  dn as VJoyTextarea,
-  bn as VJoyToggle,
-  Ho as VJoyWrapper
+  Vt as VJoyButton,
+  he as VJoyCheckbox,
+  Ht as VJoyCounter,
+  Hl as VJoyDropdown,
+  et as VJoyDropdownList,
+  tt as VJoyFormError,
+  to as VJoyHighlight,
+  yo as VJoyInput,
+  N as VJoyLabel,
+  bo as VJoyLink,
+  So as VJoyMultiCheckbox,
+  Eo as VJoyPanel,
+  To as VJoyPanelSection,
+  Ro as VJoyRadio,
+  Ho as VJoyRadioGroup,
+  Qo as VJoySelect,
+  lt as VJoySelectableItem,
+  ln as VJoySelectableItemGroup,
+  We as VJoySpinner,
+  pn as VJoyTemplate,
+  kn as VJoyTextarea,
+  Ln as VJoyToggle,
+  nn as VJoyWrapper
 };