@maltjoy/core-vue 3.19.0 → 3.19.1

package/dist/joy-vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as L, computed as E, openBlock as f, createElementBlock as g, normalizeClass as C, createElementVNode as b, Fragment as K, createTextVNode as z, toDisplayString as N, createCommentVNode as S, createBlock as B, resolveDynamicComponent as ae, mergeProps as ie, withCtx as D, pushScopeId as et, popScopeId as tt, renderSlot as w, unref as $, renderList as G, useAttrs as ht, resolveDirective as Zn, withDirectives as Qn, getCurrentScope as _t, onScopeDispose as wt, ref as x, getCurrentInstance as Xn, onMounted as se, nextTick as Fe, watch as X, h as ea, Teleport as nt, createVNode as W, useSlots as ee, Transition as dn, withKeys as St, normalizeStyle as ce, onBeforeUnmount as kt, normalizeProps as at, guardReactiveProps as ot, provide as xt, createSlots as fn, inject as lt, createStaticVNode as yn, onBeforeMount as ta, onUnmounted as na, withModifiers as aa, shallowRef as oa, shallowReadonly as je, createApp as la } from "vue";
+import { defineComponent as T, computed as I, openBlock as f, createElementBlock as g, normalizeClass as C, createElementVNode as b, Fragment as K, createTextVNode as z, toDisplayString as J, createCommentVNode as S, createBlock as E, resolveDynamicComponent as ae, mergeProps as ie, withCtx as D, pushScopeId as et, popScopeId as tt, renderSlot as w, unref as $, renderList as G, useAttrs as ht, resolveDirective as Zn, withDirectives as Qn, getCurrentScope as _t, onScopeDispose as wt, ref as x, getCurrentInstance as Xn, onMounted as se, nextTick as Fe, watch as X, h as ea, Teleport as nt, createVNode as W, useSlots as ee, Transition as dn, withKeys as St, normalizeStyle as ce, onBeforeUnmount as kt, normalizeProps as at, guardReactiveProps as ot, provide as xt, createSlots as fn, inject as lt, createStaticVNode as yn, onBeforeMount as ta, onUnmounted as na, withModifiers as aa, shallowRef as oa, shallowReadonly as je, createApp as la } from "vue";
 function Pt(e) {
   const t = e.target;
   if (!t)
@@ -19,7 +19,7 @@ const ra = {
   beforeUnmount: (e) => {
     e.removeEventListener("click", Pt);
   }
-}, ia = ["title"], sa = /* @__PURE__ */ L({
+}, ia = ["title"], sa = /* @__PURE__ */ T({
   __name: "VJoyAvailability",
   props: {
     /** Don't fill it and you'll only have the colored dot */
@@ -34,7 +34,7 @@ const ra = {
     isPartial: Boolean
   },
   setup(e) {
-    const t = e, n = E(() => ({
+    const t = e, n = I(() => ({
       "joy-availability__dot": !0,
       "joy-availability--partial": t.isPartial,
       [t.status]: !0
@@ -47,17 +47,17 @@ const ra = {
         class: C(n.value)
       }, null, 2),
       e.label ? (f(), g(K, { key: 0 }, [
-        z(N(e.label), 1)
+        z(J(e.label), 1)
       ], 64)) : S("", !0)
     ], 10, ia));
   }
 });
-const A = (e, t) => {
+const L = (e, t) => {
   const n = e.__vccOpts || e;
   for (const [a, o] of t)
     n[a] = o;
   return n;
-}, ua = /* @__PURE__ */ A(sa, [["__scopeId", "data-v-3452c6e7"]]), H = /* @__PURE__ */ L({
+}, ua = /* @__PURE__ */ L(sa, [["__scopeId", "data-v-3452c6e7"]]), H = /* @__PURE__ */ T({
   __name: "VJoyIcon",
   props: {
     name: {
@@ -94,7 +94,7 @@ const ca = (e) => (et("data-v-bcb28746"), e = e(), tt(), e), da = {
   fill: "#F7F7F5"
 }, null, -1)), ma = [
   pa
-], ba = /* @__PURE__ */ L({
+], ba = /* @__PURE__ */ T({
   __name: "VJoyAvatar",
   props: {
     /** 3 different sizes of avatar */
@@ -123,15 +123,15 @@ const ca = (e) => (et("data-v-bcb28746"), e = e(), tt(), e), da = {
   },
   emits: ["click"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = E(() => a.size === "large" ? "medium" : a.size === "medium" ? "small" : a.size === "small" ? "xsmall" : "small"), r = E(() => a.link ? {
+    const a = e, o = I(() => a.size === "large" ? "medium" : a.size === "medium" ? "small" : a.size === "small" ? "xsmall" : "small"), r = I(() => a.link ? {
       type: "button"
-    } : null), l = E(() => ({
+    } : null), l = I(() => ({
       "joy-avatar": !0,
       "joy-avatar__link": a.link,
       "joy-avatar__placeholder": i.value,
       [`joy-avatar__${a.size}`]: !0,
       [`joy-avatar__${a.color}`]: !0
-    })), i = E(() => !a.fullName && !a.photoUrl && !a.totalNumber), u = E(() => {
+    })), i = I(() => !a.fullName && !a.photoUrl && !a.totalNumber), u = I(() => {
       function d(p) {
         return p.replace(/[';,:()]/g, "").charAt(0);
       }
@@ -147,12 +147,12 @@ const ca = (e) => (et("data-v-bcb28746"), e = e(), tt(), e), da = {
       isAnonymous: i,
       initials: u
     }), (d, c) => (f(), g("div", da, [
-      (f(), B(ae(e.link ? "button" : "div"), ie(r.value, {
+      (f(), E(ae(e.link ? "button" : "div"), ie(r.value, {
         class: [l.value],
         onClick: v
       }), {
         default: D(() => [
-          i.value ? (f(), B(H, {
+          i.value ? (f(), E(H, {
             key: 0,
             name: "user-photo",
             color: "white",
@@ -166,10 +166,10 @@ const ca = (e) => (et("data-v-bcb28746"), e = e(), tt(), e), da = {
             loading: "lazy"
           }, null, 8, fa)) : S("", !0),
           e.fullName ? (f(), g(K, { key: 2 }, [
-            z(N(u.value), 1)
+            z(J(u.value), 1)
           ], 64)) : S("", !0),
           e.totalNumber ? (f(), g(K, { key: 3 }, [
-            z(N("+" + e.totalNumber), 1)
+            z(J("+" + e.totalNumber), 1)
           ], 64)) : S("", !0)
         ]),
         _: 1
@@ -186,7 +186,7 @@ const ca = (e) => (et("data-v-bcb28746"), e = e(), tt(), e), da = {
     ], 512));
   }
 });
-const vn = /* @__PURE__ */ A(ba, [["__scopeId", "data-v-bcb28746"]]), ga = /* @__PURE__ */ L({
+const vn = /* @__PURE__ */ L(ba, [["__scopeId", "data-v-bcb28746"]]), ga = /* @__PURE__ */ T({
   __name: "VJoyAvatarsList",
   props: {
     /** Renders a compact list of avatars */
@@ -201,7 +201,7 @@ const vn = /* @__PURE__ */ A(ba, [["__scopeId", "data-v-bcb28746"]]), ga = /* @_
     ], 2));
   }
 });
-const ha = /* @__PURE__ */ A(ga, [["__scopeId", "data-v-46e4547e"]]), _a = ["info", "gray", "green", "orange", "red", "teal", "pink", "dark-blue", "yellow"], wa = /* @__PURE__ */ L({
+const ha = /* @__PURE__ */ L(ga, [["__scopeId", "data-v-46e4547e"]]), _a = ["info", "gray", "green", "orange", "red", "teal", "pink", "dark-blue", "yellow"], wa = /* @__PURE__ */ T({
   __name: "VJoyBadge",
   props: {
     /**
@@ -234,12 +234,12 @@ const ha = /* @__PURE__ */ A(ga, [["__scopeId", "data-v-46e4547e"]]), _a = ["inf
       role: "status"
     }, [
       w(t.$slots, "default", {}, () => [
-        z(N(e.label), 1)
+        z(J(e.label), 1)
       ], !0)
     ], 2));
   }
 });
-const Sa = /* @__PURE__ */ A(wa, [["__scopeId", "data-v-4512c8c6"]]);
+const Sa = /* @__PURE__ */ L(wa, [["__scopeId", "data-v-4512c8c6"]]);
 var Y = /* @__PURE__ */ ((e) => (e.HIGH_POTENTIAL = "highpotential", e.HIGH_POTENTIAL_AUTO = "high-potential-auto", e.MALT_LINKER = "maltlinker", e.NEW = "new", e.SUPER_MALTER = "supermalter", e.VERIFIED = "verified", e))(Y || {}), He = /* @__PURE__ */ ((e) => (e.HIGH_POTENTIAL = "program_high-potential", e))(He || {});
 const fe = (e) => (et("data-v-4187ebd6"), e = e(), tt(), e), ka = { class: "joy-badge-level" }, xa = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
   fill: "#264FFA",
@@ -274,10 +274,10 @@ const fe = (e) => (et("data-v-4187ebd6"), e = e(), tt(), e), ka = { class: "joy-
 }, Ea = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
   fill: "#EF4E16",
   d: "M60 23.913s-8.76-2.903-14.05 1.058C44.256 17.449 45.203 8.674 34.688 2c-.712 9.413-12.856 9.891-15.691 22.005-1.86-3.319-2.227-7.716-9.28-9.871C11.615 25.513.415 31.3 5.199 47.68c2.699 9.246 12.72 13.651 21.047 14.217 16.527 1.123 31.896-6.848 32.258-24.148.155-7.437-2.975-8.343 1.496-13.836z"
-}, null, -1)), Aa = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
+}, null, -1)), Ba = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
   fill: "#F9B700",
   d: "M53.226 32.962c-6.012-.063-5.458 2.387-9.883 3.896-3.212-5.842-.067-13.682-10.056-19.364.066 10.625-7.32 7.313-10.414 17.456-3.758-2.145-1.943-6.888-9.256-8.89 4.042 6.349-.99 7.542-3.526 13.335-5.093 11.632 7.181 19.813 16.548 20.382 13.019.793 25.124-4.834 25.408-17.048.122-5.25-2.342-5.888 1.179-9.767z"
-}, null, -1)), Ba = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
+}, null, -1)), Aa = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
   fill: "#FFE463",
   d: "M47.616 41.169c-4.47-.041-4.061 1.522-7.351 2.484-2.391-3.727-.051-8.729-7.479-12.354.049 6.778-5.446 4.666-7.746 11.137-2.795-1.368-1.447-4.395-6.885-5.672 3.006 4.051-.735 4.812-2.621 8.508-3.791 7.421 5.339 12.64 12.307 13.003 9.683.506 18.686-3.084 18.896-10.876.093-3.348-1.741-3.755.879-6.23z"
 }, null, -1)), Oa = /* @__PURE__ */ fe(() => /* @__PURE__ */ b("path", {
@@ -285,8 +285,8 @@ const fe = (e) => (et("data-v-4187ebd6"), e = e(), tt(), e), ka = { class: "joy-
   d: "M37.182 54.939c0 2.188-12.427 2.188-12.427 0 0-5.849 12.427-5.849 12.427 0z"
 }, null, -1)), Na = [
   Ea,
-  Aa,
   Ba,
+  Aa,
   Oa
 ], Ja = {
   key: 3,
@@ -314,7 +314,7 @@ const fe = (e) => (et("data-v-4187ebd6"), e = e(), tt(), e), ka = { class: "joy-
   fill: "#FFC200"
 }, null, -1)), za = [
   Ma
-], qa = /* @__PURE__ */ L({
+], qa = /* @__PURE__ */ T({
   __name: "VJoyBadgeLevel",
   props: {
     /** Badge type. HIGH_POTENTIAL, SUPERMALTER, etc... */
@@ -334,7 +334,7 @@ const fe = (e) => (et("data-v-4187ebd6"), e = e(), tt(), e), ka = { class: "joy-
     }
   },
   setup(e) {
-    const t = e, n = E(() => {
+    const t = e, n = I(() => {
       switch (t.type) {
         case He.HIGH_POTENTIAL:
         case Y.HIGH_POTENTIAL:
@@ -376,13 +376,13 @@ const fe = (e) => (et("data-v-4187ebd6"), e = e(), tt(), e), ka = { class: "joy-
         ])
       }, [
         e.visibleText ? w(a.$slots, "default", { key: 0 }, () => [
-          z(N(n.value), 1)
+          z(J(n.value), 1)
         ], !0) : S("", !0)
       ], 2)
     ]));
   }
 });
-const Ha = /* @__PURE__ */ A(qa, [["__scopeId", "data-v-4187ebd6"]]);
+const Ha = /* @__PURE__ */ L(qa, [["__scopeId", "data-v-4187ebd6"]]);
 function pn(e) {
   let t;
   switch (e) {
@@ -413,7 +413,7 @@ const he = function(e = 10) {
 function Le(e) {
   e ? document.body.style.overflow = "hidden" : document.body.style.removeProperty("overflow");
 }
-const Ua = ["teal", "white"], Ka = /* @__PURE__ */ L({
+const Ua = ["teal", "white"], Ka = /* @__PURE__ */ T({
   __name: "VJoySpinner",
   props: {
     color: {
@@ -429,7 +429,7 @@ const Ua = ["teal", "white"], Ka = /* @__PURE__ */ L({
     }, null, 2));
   }
 });
-const Ct = /* @__PURE__ */ A(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["primary", "secondary"], Ya = ["neutral", "success", "info", "warning", "error"], Za = ["main", "admin", "ghost", "white"], Qa = [...Ga, ...Za], Xa = ["large", "medium", "small", "xsmall", "xxsmall"], eo = /* @__PURE__ */ L({
+const Ct = /* @__PURE__ */ L(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["primary", "secondary"], Ya = ["neutral", "success", "info", "warning", "error"], Za = ["main", "admin", "ghost", "white"], Qa = [...Ga, ...Za], Xa = ["large", "medium", "small", "xsmall", "xxsmall"], eo = /* @__PURE__ */ T({
   __name: "VJoyButton",
   props: {
     /**
@@ -478,7 +478,7 @@ const Ct = /* @__PURE__ */ A(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["pri
     }
   },
   setup(e, { expose: t }) {
-    const n = e, a = ht(), o = "joy-button--" + he(), r = E(() => {
+    const n = e, a = ht(), o = "joy-button--" + he(), r = I(() => {
       switch (n.size) {
         case "xxsmall":
           return "xxsmall";
@@ -489,10 +489,10 @@ const Ct = /* @__PURE__ */ A(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["pri
         default:
           return "small";
       }
-    }), l = E(() => ["white", "ghost", "secondary"].includes(n.variant) ? "teal" : "white");
+    }), l = I(() => ["white", "ghost", "secondary"].includes(n.variant) ? "teal" : "white");
     return t({ randomId: o }), (i, u) => {
       const v = Zn("joy-ripple");
-      return Qn((f(), B(ae($(a).href ? "a" : "button"), {
+      return Qn((f(), E(ae($(a).href ? "a" : "button"), {
         disabled: e.loading || $(a).disabled,
         type: $(a).type || "button",
         class: C([
@@ -507,14 +507,14 @@ const Ct = /* @__PURE__ */ A(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["pri
         "aria-labelledby": (i.$slots.default || e.label) && o
       }, {
         default: D(() => [
-          e.icon && e.iconPosition === "left" ? (f(), B(H, {
+          e.icon && e.iconPosition === "left" ? (f(), E(H, {
             key: 0,
             class: "joy-button_icon joy-button_icon--left",
             name: e.icon,
             size: r.value,
             "aria-hidden": "true"
           }, null, 8, ["name", "size"])) : S("", !0),
-          e.loading ? (f(), B(Ct, {
+          e.loading ? (f(), E(Ct, {
             key: 1,
             color: l.value
           }, null, 8, ["color"])) : S("", !0),
@@ -523,10 +523,10 @@ const Ct = /* @__PURE__ */ A(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["pri
             class: "joy-button--slot"
           }, [
             w(i.$slots, "default", {}, () => [
-              z(N(e.label), 1)
+              z(J(e.label), 1)
             ], !0)
           ]),
-          e.icon && e.iconPosition === "right" ? (f(), B(H, {
+          e.icon && e.iconPosition === "right" ? (f(), E(H, {
             key: 2,
             class: "joy-button_icon joy-button_icon--right",
             name: e.icon,
@@ -541,7 +541,7 @@ const Ct = /* @__PURE__ */ A(Ka, [["__scopeId", "data-v-127ef073"]]), Ga = ["pri
     };
   }
 });
-const de = /* @__PURE__ */ A(eo, [["__scopeId", "data-v-25ba8bc2"]]);
+const de = /* @__PURE__ */ L(eo, [["__scopeId", "data-v-25ba8bc2"]]);
 var Rt;
 const jt = typeof window < "u", mn = (e) => typeof e == "string", $t = () => {
 }, yt = jt && ((Rt = window == null ? void 0 : window.navigator) == null ? void 0 : Rt.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
@@ -555,7 +555,7 @@ function rt(e) {
   return _t() ? (wt(e), !0) : !1;
 }
 function no(e) {
-  return typeof e == "function" ? E(e) : x(e);
+  return typeof e == "function" ? I(e) : x(e);
 }
 function ao(e, t = !0) {
   Xn() ? se(e) : t ? e() : Fe(e);
@@ -700,7 +700,7 @@ const mo = {
 po({
   linear: to
 }, mo);
-const Tt = /* @__PURE__ */ L({
+const Tt = /* @__PURE__ */ T({
   name: "OnClickOutside",
   props: ["as", "options"],
   emits: ["trigger"],
@@ -769,7 +769,7 @@ function wo(e, t = !1) {
     const i = Ee(e);
     !i || !n.value || (yt && (a == null || a()), i.style.overflow = o, n.value = !1);
   };
-  return rt(l), E({
+  return rt(l), I({
     get() {
       return n.value;
     },
@@ -790,9 +790,9 @@ const So = () => {
   };
 };
 So();
-const gn = (e) => (et("data-v-9cad0312"), e = e(), tt(), e), ko = /* @__PURE__ */ gn(() => /* @__PURE__ */ b("div", { class: "joy-bottom-sheet-overlay" }, null, -1)), xo = /* @__PURE__ */ gn(() => /* @__PURE__ */ b("div", { class: "joy-bottom-sheet_header-close" }, null, -1)), Co = [
+const gn = (e) => (et("data-v-48421974"), e = e(), tt(), e), ko = /* @__PURE__ */ gn(() => /* @__PURE__ */ b("div", { class: "joy-bottom-sheet-overlay" }, null, -1)), xo = /* @__PURE__ */ gn(() => /* @__PURE__ */ b("div", { class: "joy-bottom-sheet_header-close" }, null, -1)), Co = [
   xo
-], jo = { class: "joy-bottom-sheet_content" }, $o = { class: "joy-bottom-sheet_footer" }, Yt = 75, Zt = "moving", Vo = /* @__PURE__ */ L({
+], jo = { class: "joy-bottom-sheet_content" }, $o = { class: "joy-bottom-sheet_footer" }, Yt = 75, Zt = "moving", Vo = /* @__PURE__ */ T({
   __name: "VJoyBottomSheet",
   props: {
     /** Automatically renders a CTA that closes the bottom-sheet */
@@ -804,6 +804,13 @@ const gn = (e) => (et("data-v-9cad0312"), e = e(), tt(), e), ko = /* @__PURE__ *
       type: Boolean,
       default: !1
     },
+    /**
+     * @internal - Mostly for documentation purpose
+     */
+    preventBodyScroll: {
+      type: Boolean,
+      default: !0
+    },
     /** By default the dialog is teleported to the end of body tag */
     teleport: {
       type: String,
@@ -818,46 +825,49 @@ const gn = (e) => (et("data-v-9cad0312"), e = e(), tt(), e), ko = /* @__PURE__ *
   setup(e, { expose: t, emit: n }) {
     const a = e, o = x(!1), r = x(!1), l = x(a.open), i = x(!1), u = x();
     let v = 0;
-    function d(T = { preventScroll: !0 }) {
-      l.value = !0, T.preventScroll && Le(!0);
+    function d() {
+      l.value = !0, N();
     }
     function c() {
       r.value = !0, setTimeout(async () => {
         i.value = !1, r.value = !1, l.value = !1, Le(!1), n("bottom-sheet:close");
       }, 300);
     }
-    function p(T) {
-      i.value = !0, u.value.classList.add(Zt), v = k(T);
+    function p(O) {
+      i.value = !0, u.value.classList.add(Zt), v = k(O);
     }
-    function s(T) {
-      i.value && (m(T) > Yt && c(), V());
+    function s(O) {
+      i.value && (m(O) > Yt && c(), B());
     }
-    function y(T) {
+    function y(O) {
       if (i.value) {
-        const J = m(T);
-        J > Yt ? c() : J > 0 && j(J);
+        const A = m(O);
+        A > Yt ? c() : A > 0 && j(A);
       }
     }
-    function m(T) {
-      return k(T) - v;
+    function m(O) {
+      return k(O) - v;
     }
-    function k(T) {
-      return ["touchend", "touchmove", "touchstart"].includes(T.type) ? T.changedTouches[0].clientY : T.clientY;
+    function k(O) {
+      return ["touchend", "touchmove", "touchstart"].includes(O.type) ? O.changedTouches[0].clientY : O.clientY;
     }
-    function j(T) {
-      u.value.style.setProperty("transform", `translateY(${T}px)`);
+    function j(O) {
+      u.value.style.setProperty("transform", `translateY(${O}px)`);
     }
-    function V() {
+    function B() {
       u.value.classList.remove(Zt), u.value.style.removeProperty("transform"), i.value = !1;
     }
+    function N() {
+      a.preventBodyScroll && Le(!0);
+    }
     return se(() => {
-      o.value = !0;
+      o.value = !0, a.open && N();
     }), t({
-      openBottomSheet: d,
-      closeBottomSheet: c,
+      hide: c,
+      show: d,
       isOpen: l,
       moveContainer: j
-    }), (T, J) => o.value ? (f(), B(nt, {
+    }), (O, A) => o.value ? (f(), E(nt, {
       key: 0,
       to: e.teleport
     }, [
@@ -891,10 +901,10 @@ const gn = (e) => (et("data-v-9cad0312"), e = e(), tt(), e), ko = /* @__PURE__ *
                 onTouchmove: y
               }, Co, 32),
               b("div", jo, [
-                w(T.$slots, "bottom-sheet-content", {}, void 0, !0)
+                w(O.$slots, "bottom-sheet-content", {}, void 0, !0)
               ]),
               b("div", $o, [
-                w(T.$slots, "bottom-sheet-cta", {}, () => [
+                w(O.$slots, "bottom-sheet-cta", {}, () => [
                   W(de, {
                     class: "joy-bottom-sheet_footer-close",
                     label: e.closeLabel,
@@ -910,24 +920,23 @@ const gn = (e) => (et("data-v-9cad0312"), e = e(), tt(), e), ko = /* @__PURE__ *
     ], 8, ["to"])) : S("", !0);
   }
 });
-const To = /* @__PURE__ */ A(Vo, [["__scopeId", "data-v-9cad0312"]]), Io = /* @__PURE__ */ L({
+const To = /* @__PURE__ */ L(Vo, [["__scopeId", "data-v-48421974"]]), Io = /* @__PURE__ */ T({
   __name: "VJoyBottomSheetTrigger",
   props: {
-    bottomSheet: {},
-    options: {}
+    bottomSheet: {}
   },
   setup(e) {
-    const t = e, n = E(() => t.bottomSheet), a = ee(), o = E(() => a.default());
+    const t = e, n = I(() => t.bottomSheet), a = ee(), o = I(() => a.default());
     function r() {
       var l;
-      (l = n.value) == null || l.openBottomSheet(t.options);
+      (l = n.value) == null || l.show();
     }
-    return (l, i) => (f(!0), g(K, null, G(o.value, (u) => (f(), B(ae(u), {
+    return (l, i) => (f(!0), g(K, null, G(o.value, (u) => (f(), E(ae(u), {
       key: u,
       onClick: r
     }))), 128));
   }
-}), Lo = ["aria-checked", "aria-hidden"], Eo = { class: "joy-checkbox__input-wrapper" }, Ao = ["id", "name", "disabled", "checked", "required", "aria-checked", "value", "indeterminate"], Bo = { class: "joy-checkbox__content-wrapper" }, Oo = { class: "joy-checkbox__content" }, No = /* @__PURE__ */ L({
+}), Lo = ["aria-checked", "aria-hidden"], Eo = { class: "joy-checkbox__input-wrapper" }, Bo = ["id", "name", "disabled", "checked", "required", "aria-checked", "value", "indeterminate"], Ao = { class: "joy-checkbox__content-wrapper" }, Oo = { class: "joy-checkbox__content" }, No = /* @__PURE__ */ T({
   __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 */
@@ -1034,11 +1043,11 @@ const To = /* @__PURE__ */ A(Vo, [["__scopeId", "data-v-9cad0312"]]), Io = /* @_
             (...c) => u.onFocus && u.onFocus(...c)),
             onBlur: d[2] || (d[2] = //@ts-ignore
             (...c) => u.onBlur && u.onBlur(...c))
-          }, null, 40, Ao)
+          }, null, 40, Bo)
         ]),
-        b("div", Bo, [
+        b("div", Ao, [
           w(v.$slots, "default", {}, () => [
-            z(N(e.label), 1)
+            z(J(e.label), 1)
           ], !0),
           b("div", Oo, [
             w(v.$slots, "checkbox-content", {}, void 0, !0)
@@ -1048,7 +1057,7 @@ const To = /* @__PURE__ */ A(Vo, [["__scopeId", "data-v-9cad0312"]]), Io = /* @_
     ], 8, Lo));
   }
 });
-const It = /* @__PURE__ */ A(No, [["__scopeId", "data-v-27cc9d8c"]]), Jo = ["aria-expanded"], Fo = ["id"], Po = { class: "joy-collapse-item__header-right" }, Ro = ["aria-labelledby"], Do = /* @__PURE__ */ L({
+const It = /* @__PURE__ */ L(No, [["__scopeId", "data-v-27cc9d8c"]]), Jo = ["aria-expanded"], Fo = ["id"], Po = { class: "joy-collapse-item__header-right" }, Ro = ["aria-labelledby"], Do = /* @__PURE__ */ T({
   __name: "VJoyCollapseItem",
   props: {
     header: {
@@ -1103,13 +1112,13 @@ const It = /* @__PURE__ */ A(No, [["__scopeId", "data-v-27cc9d8c"]]), Jo = ["ari
           id: e.id,
           class: "joy-collapse-item__summary___content"
         }, [
-          e.summaryIcon ? (f(), B(H, {
+          e.summaryIcon ? (f(), E(H, {
             key: 0,
             "aria-hidden": "true",
             color: "secondary",
             name: e.summaryIcon
           }, null, 8, ["name"])) : S("", !0),
-          z(" " + N(e.header), 1)
+          z(" " + J(e.header), 1)
         ], 8, Fo),
         b("div", Po, [
           w(i.$slots, "collapse-header-right")
@@ -1135,7 +1144,7 @@ const It = /* @__PURE__ */ A(No, [["__scopeId", "data-v-27cc9d8c"]]), Jo = ["ari
     ], 2));
   }
 });
-const hn = /* @__PURE__ */ A(Do, [["__scopeId", "data-v-f41beb0a"]]), Mo = { class: "joy-collapse" }, zo = /* @__PURE__ */ L({
+const hn = /* @__PURE__ */ L(Do, [["__scopeId", "data-v-f41beb0a"]]), Mo = { class: "joy-collapse" }, zo = /* @__PURE__ */ T({
   __name: "VJoyCollapse",
   props: {
     accordion: {
@@ -1151,7 +1160,7 @@ const hn = /* @__PURE__ */ A(Do, [["__scopeId", "data-v-f41beb0a"]]), Mo = { cla
   },
   emits: ["update:modelValue"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = x(a.modelValue), r = ee(), l = E(() => {
+    const a = e, o = x(a.modelValue), r = ee(), l = I(() => {
       const s = r.default();
       return s.length === 1 && typeof s[0].type != "object" ? s[0].children.filter(i) : s.filter(i);
     });
@@ -1188,24 +1197,24 @@ const hn = /* @__PURE__ */ A(Do, [["__scopeId", "data-v-f41beb0a"]]), Mo = { cla
       items: l,
       openedCollapseItem: o
     }), (s, y) => (f(), g("div", Mo, [
-      (f(!0), g(K, null, G(l.value, (m) => (f(), B(hn, ie(m.props, {
+      (f(!0), g(K, null, G(l.value, (m) => (f(), E(hn, ie(m.props, {
         key: m.props.id,
         open: v(m),
         "onCollapseItem:open": (k) => d(m),
         "onCollapseItem:close": (k) => c(m)
       }), {
         "collapse-header-right": D(() => [
-          (f(!0), g(K, null, G(u(m, "collapse-header-right"), (k) => (f(), B(ae(k), { key: k }))), 128))
+          (f(!0), g(K, null, G(u(m, "collapse-header-right"), (k) => (f(), E(ae(k), { key: k }))), 128))
         ]),
         default: D(() => [
-          (f(!0), g(K, null, G(u(m, "default"), (k) => (f(), B(ae(k), { key: k }))), 128))
+          (f(!0), g(K, null, G(u(m, "default"), (k) => (f(), E(ae(k), { key: k }))), 128))
         ]),
         _: 2
       }, 1040, ["open", "onCollapseItem:open", "onCollapseItem:close"]))), 128))
     ]));
   }
 });
-const qo = /* @__PURE__ */ A(zo, [["__scopeId", "data-v-5bd4f0f7"]]), Ho = ["src", "alt", "title"], Wo = /* @__PURE__ */ L({
+const qo = /* @__PURE__ */ L(zo, [["__scopeId", "data-v-5bd4f0f7"]]), Ho = ["src", "alt", "title"], Wo = /* @__PURE__ */ T({
   __name: "VJoyCompanyAvatar",
   props: {
     imgSrc: String,
@@ -1217,7 +1226,7 @@ const qo = /* @__PURE__ */ A(zo, [["__scopeId", "data-v-5bd4f0f7"]]), Ho = ["src
     }
   },
   setup(e) {
-    const t = e, n = E(() => {
+    const t = e, n = I(() => {
       switch (t.size) {
         case "large":
           return "small";
@@ -1237,7 +1246,7 @@ const qo = /* @__PURE__ */ A(zo, [["__scopeId", "data-v-5bd4f0f7"]]), Ho = ["src
         src: e.imgSrc,
         alt: e.imgAlt || e.companyName,
         title: e.companyName
-      }, null, 8, Ho)) : (f(), B($(H), {
+      }, null, 8, Ho)) : (f(), E($(H), {
         key: 1,
         name: "company-placeholder",
         size: n.value
@@ -1245,12 +1254,12 @@ const qo = /* @__PURE__ */ A(zo, [["__scopeId", "data-v-5bd4f0f7"]]), Ho = ["src
     ], 2));
   }
 });
-const Uo = /* @__PURE__ */ A(Wo, [["__scopeId", "data-v-0f616ccb"]]), Ko = { class: "joy-counter" }, Go = ["aria-label", "disabled"], Yo = { class: "joy-counter__input-wrapper" }, Zo = ["id", "min", "max", "aria-invalid", "name", "required", "value"], Qo = ["aria-label", "disabled"], Xo = {
+const Uo = /* @__PURE__ */ L(Wo, [["__scopeId", "data-v-0f616ccb"]]), Ko = { class: "joy-counter" }, Go = ["aria-label", "disabled"], Yo = { class: "joy-counter__input-wrapper" }, Zo = ["id", "min", "max", "aria-invalid", "name", "required", "value"], Qo = ["aria-label", "disabled"], Xo = {
   key: 0,
   class: "joy-counter_error"
 }, el = {
   inheritAttrs: !1
-}, tl = /* @__PURE__ */ L({
+}, tl = /* @__PURE__ */ T({
   ...el,
   __name: "VJoyCounter",
   props: {
@@ -1357,7 +1366,7 @@ const Uo = /* @__PURE__ */ A(Wo, [["__scopeId", "data-v-0f616ccb"]]), Ko = { cla
     return t({
       props: a
     }), (y, m) => (f(), g("div", Ko, [
-      e.label ? (f(), B($(Ce), {
+      e.label ? (f(), E($(Ce), {
         key: 0,
         for: e.id,
         required: e.required && e.requiredMark,
@@ -1366,7 +1375,7 @@ const Uo = /* @__PURE__ */ A(Wo, [["__scopeId", "data-v-0f616ccb"]]), Ko = { cla
       }, {
         default: D(() => [
           w(y.$slots, "default", {}, () => [
-            z(N(e.label), 1)
+            z(J(e.label), 1)
           ], !0)
         ]),
         _: 3
@@ -1421,7 +1430,7 @@ const Uo = /* @__PURE__ */ A(Wo, [["__scopeId", "data-v-0f616ccb"]]), Ko = { cla
     ]));
   }
 });
-const nl = /* @__PURE__ */ A(tl, [["__scopeId", "data-v-ebcfc48d"]]);
+const nl = /* @__PURE__ */ L(tl, [["__scopeId", "data-v-ebcfc48d"]]);
 function al(e) {
   return _t() ? (wt(e), !0) : !1;
 }
@@ -1756,24 +1765,24 @@ var tn = {
     delayInitialFocusTimer: void 0,
     // the most recent KeyboardEvent for the configured nav key (typically [SHIFT+]TAB), if any
     recentNavEvent: void 0
-  }, i, u = function(h, _, I) {
-    return h && h[_] !== void 0 ? h[_] : r[I || _];
+  }, i, u = function(h, _, V) {
+    return h && h[_] !== void 0 ? h[_] : r[V || _];
   }, v = function(h, _) {
-    var I = typeof (_ == null ? void 0 : _.composedPath) == "function" ? _.composedPath() : void 0;
+    var V = typeof (_ == null ? void 0 : _.composedPath) == "function" ? _.composedPath() : void 0;
     return l.containerGroups.findIndex(function(F) {
       var P = F.container, M = F.tabbableNodes;
       return P.contains(h) || // fall back to explicit tabbable search which will take into consideration any
       //  web components if the `tabbableOptions.getShadowRoot` option was used for
       //  the trap, enabling shadow DOM support in tabbable (`Node.contains()` doesn't
       //  look inside web components even if open)
-      (I == null ? void 0 : I.includes(P)) || M.find(function(U) {
+      (V == null ? void 0 : V.includes(P)) || M.find(function(U) {
         return U === h;
       });
     });
   }, d = function(h) {
     var _ = r[h];
     if (typeof _ == "function") {
-      for (var I = arguments.length, F = new Array(I > 1 ? I - 1 : 0), P = 1; P < I; P++)
+      for (var V = arguments.length, F = new Array(V > 1 ? V - 1 : 0), P = 1; P < V; P++)
         F[P - 1] = arguments[P];
       _ = _.apply(void 0, F);
     }
@@ -1794,17 +1803,17 @@ var tn = {
       if (v(a.activeElement) >= 0)
         h = a.activeElement;
       else {
-        var _ = l.tabbableGroups[0], I = _ && _.firstTabbableNode;
-        h = I || d("fallbackFocus");
+        var _ = l.tabbableGroups[0], V = _ && _.firstTabbableNode;
+        h = V || d("fallbackFocus");
       }
     if (!h)
       throw new Error("Your focus-trap needs to have at least one focusable element");
     return h;
   }, p = function() {
     if (l.containerGroups = l.containers.map(function(h) {
-      var _ = _l(h, r.tabbableOptions), I = wl(h, r.tabbableOptions), F = _.length > 0 ? _[0] : void 0, P = _.length > 0 ? _[_.length - 1] : void 0, M = I.find(function(Q) {
+      var _ = _l(h, r.tabbableOptions), V = wl(h, r.tabbableOptions), F = _.length > 0 ? _[0] : void 0, P = _.length > 0 ? _[_.length - 1] : void 0, M = V.find(function(Q) {
         return $e(Q);
-      }), U = I.slice().reverse().find(function(Q) {
+      }), U = V.slice().reverse().find(function(Q) {
         return $e(Q);
       }), te = !!_.find(function(Q) {
         return Se(Q) > 0;
@@ -1812,7 +1821,7 @@ var tn = {
       return {
         container: h,
         tabbableNodes: _,
-        focusableNodes: I,
+        focusableNodes: V,
         /** True if at least one node with positive `tabindex` was found in this container. */
         posTabIndexesFound: te,
         /** First tabbable node in container, __tabindex__ order; `undefined` if none. */
@@ -1839,12 +1848,12 @@ var tn = {
          * @returns {HTMLElement|undefined} The next tabbable node, if any.
          */
         nextTabbableNode: function(we) {
-          var Be = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0, pe = _.indexOf(we);
-          return pe < 0 ? Be ? I.slice(I.indexOf(we) + 1).find(function(Oe) {
+          var Ae = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0, pe = _.indexOf(we);
+          return pe < 0 ? Ae ? V.slice(V.indexOf(we) + 1).find(function(Oe) {
             return $e(Oe);
-          }) : I.slice(0, I.indexOf(we)).reverse().find(function(Oe) {
+          }) : V.slice(0, V.indexOf(we)).reverse().find(function(Oe) {
             return $e(Oe);
-          }) : _[pe + (Be ? 1 : -1)];
+          }) : _[pe + (Ae ? 1 : -1)];
         }
       };
     }), l.tabbableGroups = l.containerGroups.filter(function(h) {
@@ -1873,11 +1882,11 @@ var tn = {
     var _ = d("setReturnFocus", h);
     return _ || (_ === !1 ? !1 : h);
   }, k = function(h) {
-    var _ = h.target, I = h.event, F = h.isBackward, P = F === void 0 ? !1 : F;
-    _ = _ || qe(I), p();
+    var _ = h.target, V = h.event, F = h.isBackward, P = F === void 0 ? !1 : F;
+    _ = _ || qe(V), p();
     var M = null;
     if (l.tabbableGroups.length > 0) {
-      var U = v(_, I), te = U >= 0 ? l.containerGroups[U] : void 0;
+      var U = v(_, V), te = U >= 0 ? l.containerGroups[U] : void 0;
       if (U < 0)
         P ? M = l.tabbableGroups[l.tabbableGroups.length - 1].lastTabbableNode : M = l.tabbableGroups[0].firstTabbableNode;
       else if (P) {
@@ -1886,10 +1895,10 @@ var tn = {
           return _ === ct;
         });
         if (Q < 0 && (te.container === _ || ft(_, r.tabbableOptions) && !$e(_, r.tabbableOptions) && !te.nextTabbableNode(_, !1)) && (Q = U), Q >= 0) {
-          var we = Q === 0 ? l.tabbableGroups.length - 1 : Q - 1, Be = l.tabbableGroups[we];
-          M = Se(_) >= 0 ? Be.lastTabbableNode : Be.lastDomTabbableNode;
+          var we = Q === 0 ? l.tabbableGroups.length - 1 : Q - 1, Ae = l.tabbableGroups[we];
+          M = Se(_) >= 0 ? Ae.lastTabbableNode : Ae.lastDomTabbableNode;
         } else
-          Je(I) || (M = te.nextTabbableNode(_, !1));
+          Je(V) || (M = te.nextTabbableNode(_, !1));
       } else {
         var pe = an(l.tabbableGroups, function(ut) {
           var ct = ut.lastTabbableNode;
@@ -1899,7 +1908,7 @@ var tn = {
           var Oe = pe === l.tabbableGroups.length - 1 ? 0 : pe + 1, Ft = l.tabbableGroups[Oe];
           M = Se(_) >= 0 ? Ft.firstTabbableNode : Ft.firstDomTabbableNode;
         } else
-          Je(I) || (M = te.nextTabbableNode(_));
+          Je(V) || (M = te.nextTabbableNode(_));
       }
     } else
       M = d("fallbackFocus");
@@ -1921,10 +1930,10 @@ var tn = {
       }
       Ne(r.allowOutsideClick, h) || h.preventDefault();
     }
-  }, V = function(h) {
-    var _ = qe(h), I = v(_, h) >= 0;
-    if (I || _ instanceof Document)
-      I && (l.mostRecentlyFocusedNode = _);
+  }, B = function(h) {
+    var _ = qe(h), V = v(_, h) >= 0;
+    if (V || _ instanceof Document)
+      V && (l.mostRecentlyFocusedNode = _);
     else {
       h.stopImmediatePropagation();
       var F, P = !0;
@@ -1953,46 +1962,46 @@ var tn = {
       })), y(F || l.mostRecentlyFocusedNode || c());
     }
     l.recentNavEvent = void 0;
-  }, T = function(h) {
+  }, N = function(h) {
     var _ = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1;
     l.recentNavEvent = h;
-    var I = k({
+    var V = k({
       event: h,
       isBackward: _
     });
-    I && (Je(h) && h.preventDefault(), y(I));
-  }, J = function(h) {
+    V && (Je(h) && h.preventDefault(), y(V));
+  }, O = function(h) {
     if ($l(h) && Ne(r.escapeDeactivates, h) !== !1) {
       h.preventDefault(), i.deactivate();
       return;
     }
-    (r.isKeyForward(h) || r.isKeyBackward(h)) && T(h, r.isKeyBackward(h));
-  }, O = function(h) {
+    (r.isKeyForward(h) || r.isKeyBackward(h)) && N(h, r.isKeyBackward(h));
+  }, A = function(h) {
     var _ = qe(h);
     v(_, h) >= 0 || Ne(r.clickOutsideDeactivates, h) || Ne(r.allowOutsideClick, h) || (h.preventDefault(), h.stopImmediatePropagation());
   }, Z = function() {
     if (l.active)
       return tn.activateTrap(o, i), l.delayInitialFocusTimer = r.delayInitialFocus ? nn(function() {
         y(c());
-      }) : y(c()), a.addEventListener("focusin", V, !0), a.addEventListener("mousedown", j, {
+      }) : y(c()), a.addEventListener("focusin", B, !0), a.addEventListener("mousedown", j, {
         capture: !0,
         passive: !1
       }), a.addEventListener("touchstart", j, {
         capture: !0,
         passive: !1
-      }), a.addEventListener("click", O, {
+      }), a.addEventListener("click", A, {
         capture: !0,
         passive: !1
-      }), a.addEventListener("keydown", J, {
+      }), a.addEventListener("keydown", O, {
         capture: !0,
         passive: !1
       }), i;
   }, R = function() {
     if (l.active)
-      return a.removeEventListener("focusin", V, !0), a.removeEventListener("mousedown", j, !0), a.removeEventListener("touchstart", j, !0), a.removeEventListener("click", O, !0), a.removeEventListener("keydown", J, !0), i;
+      return a.removeEventListener("focusin", B, !0), a.removeEventListener("mousedown", j, !0), a.removeEventListener("touchstart", j, !0), a.removeEventListener("click", A, !0), a.removeEventListener("keydown", O, !0), i;
   }, oe = function(h) {
-    var _ = h.some(function(I) {
-      var F = Array.from(I.removedNodes);
+    var _ = h.some(function(V) {
+      var F = Array.from(V.removedNodes);
       return F.some(function(P) {
         return P === l.mostRecentlyFocusedNode;
       });
@@ -2016,10 +2025,10 @@ var tn = {
     activate: function(h) {
       if (l.active)
         return this;
-      var _ = u(h, "onActivate"), I = u(h, "onPostActivate"), F = u(h, "checkCanFocusTrap");
+      var _ = u(h, "onActivate"), V = u(h, "onPostActivate"), F = u(h, "checkCanFocusTrap");
       F || p(), l.active = !0, l.paused = !1, l.nodeFocusedBeforeActivation = a.activeElement, _ == null || _();
       var P = function() {
-        F && p(), Z(), ue(), I == null || I();
+        F && p(), Z(), ue(), V == null || V();
       };
       return F ? (F(l.containers.concat()).then(P, P), this) : (P(), this);
     },
@@ -2032,8 +2041,8 @@ var tn = {
         checkCanReturnFocus: r.checkCanReturnFocus
       }, h);
       clearTimeout(l.delayInitialFocusTimer), l.delayInitialFocusTimer = void 0, R(), l.active = !1, l.paused = !1, ue(), tn.deactivateTrap(o, i);
-      var I = u(_, "onDeactivate"), F = u(_, "onPostDeactivate"), P = u(_, "checkCanReturnFocus"), M = u(_, "returnFocus", "returnFocusOnDeactivate");
-      I == null || I();
+      var V = u(_, "onDeactivate"), F = u(_, "onPostDeactivate"), P = u(_, "checkCanReturnFocus"), M = u(_, "returnFocus", "returnFocusOnDeactivate");
+      V == null || V();
       var U = function() {
         nn(function() {
           M && y(m(l.nodeFocusedBeforeActivation)), F == null || F();
@@ -2044,19 +2053,19 @@ var tn = {
     pause: function(h) {
       if (l.paused || !l.active)
         return this;
-      var _ = u(h, "onPause"), I = u(h, "onPostPause");
-      return l.paused = !0, _ == null || _(), R(), ue(), I == null || I(), this;
+      var _ = u(h, "onPause"), V = u(h, "onPostPause");
+      return l.paused = !0, _ == null || _(), R(), ue(), V == null || V(), this;
     },
     unpause: function(h) {
       if (!l.paused || !l.active)
         return this;
-      var _ = u(h, "onUnpause"), I = u(h, "onPostUnpause");
-      return l.paused = !1, _ == null || _(), p(), Z(), ue(), I == null || I(), this;
+      var _ = u(h, "onUnpause"), V = u(h, "onPostUnpause");
+      return l.paused = !1, _ == null || _(), p(), Z(), ue(), V == null || V(), this;
     },
     updateContainerElements: function(h) {
       var _ = [].concat(h).filter(Boolean);
-      return l.containers = _.map(function(I) {
-        return typeof I == "string" ? a.querySelector(I) : I;
+      return l.containers = _.map(function(V) {
+        return typeof V == "string" ? a.querySelector(V) : V;
       }), l.active && p(), ue(), this;
     }
   }, i.updateContainerElements(t), i;
@@ -2091,7 +2100,7 @@ function jn(e, t = {}) {
     unpause: d
   };
 }
-const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }, Bl = { class: "joy-dialog--header" }, Ol = ["id"], Nl = {
+const El = ["aria-labelledby", "onKeydown"], Bl = { class: "joy-dialog__inner" }, Al = { class: "joy-dialog--header" }, Ol = ["id"], Nl = {
   id: "dialogDescription",
   class: "joy-dialog--subheader"
 }, Jl = {
@@ -2100,7 +2109,7 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
 }, Fl = {
   key: 1,
   class: "joy-dialog--indicators"
-}, Pl = /* @__PURE__ */ L({
+}, Pl = /* @__PURE__ */ T({
   __name: "VJoyDialog",
   props: {
     /** By default a focus-trap is activated. It means you can loop over all interactive elements within the open dialog. */
@@ -2117,6 +2126,13 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
       type: Boolean,
       default: !1
     },
+    /**
+     * @internal - Mostly for documentation purpose
+     */
+    preventBodyScroll: {
+      type: Boolean,
+      default: !0
+    },
     /** **For accessibility purpose**. Label associated with the top right corner icon.  */
     closeLabel: {
       type: String,
@@ -2156,9 +2172,9 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
   },
   emits: ["dialog:open", "dialog:after-open", "dialog:hide", "dialog:after-hide"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = "joy-dialog--" + he(), r = ee(), l = x(!1), i = x(), u = x(a.open), { activate: v, deactivate: d } = jn(i), c = E(() => {
-      const V = r["dialog-cancel"] || r["dialog-confirm"], T = a.cancelText || a.confirmText;
-      return !!V || !!T;
+    const a = e, o = "joy-dialog--" + he(), r = ee(), l = x(!1), i = x(), u = x(a.open), { activate: v, deactivate: d } = jn(i), c = I(() => {
+      const B = r["dialog-cancel"] || r["dialog-confirm"], N = a.cancelText || a.confirmText;
+      return !!B || !!N;
     });
     function p() {
       !a.patternConfirm && s();
@@ -2166,8 +2182,8 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
     async function s() {
       d(), u.value = !1, await Fe(), Le(!1), n("dialog:hide");
     }
-    async function y(V) {
-      u.value = !0, await Fe(), a.focusTrap && v(), V != null && V.preventBodyScroll && Le(!0);
+    async function y() {
+      u.value = !0, await Fe(), a.focusTrap && v(), a.preventBodyScroll && Le(!0);
     }
     function m() {
       n("dialog:open");
@@ -2181,11 +2197,11 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
     return se(async () => {
       l.value = !0;
     }), t({
-      openOverlay: y,
+      show: y,
       hasFooterSlots: c,
-      hideOverlay: s,
+      hide: s,
       isOpen: u
-    }), (V, T) => l.value ? (f(), B(nt, {
+    }), (B, N) => l.value ? (f(), E(nt, {
       key: 0,
       to: e.teleport
     }, [
@@ -2217,7 +2233,7 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
                   "joy-dialog__overlay___disabled": e.patternConfirm
                 }
               ]),
-              onClick: T[0] || (T[0] = (J) => !e.patternConfirm && s())
+              onClick: N[0] || (N[0] = (O) => !e.patternConfirm && s)
             }, null, 2),
             b("div", {
               class: C([
@@ -2227,7 +2243,7 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
                 }
               ])
             }, [
-              b("div", Al, [
+              b("div", Bl, [
                 e.bannerSrc ? (f(), g("div", {
                   key: 0,
                   class: "joy-dialog--banner",
@@ -2237,17 +2253,17 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
                     height: `${e.bannerHeight}px`
                   })
                 }, null, 4)) : S("", !0),
-                b("div", Bl, [
+                b("div", Al, [
                   b("div", {
                     id: o + "-header",
                     class: "joy-dialog--header__title"
                   }, [
-                    w(V.$slots, "dialog-header", {}, void 0, !0)
+                    w(B.$slots, "dialog-header", {}, void 0, !0)
                   ], 8, Ol),
                   b("p", Nl, [
-                    w(V.$slots, "dialog-subheader", {}, void 0, !0)
+                    w(B.$slots, "dialog-subheader", {}, void 0, !0)
                   ]),
-                  e.patternConfirm ? S("", !0) : (f(), B($(de), {
+                  e.patternConfirm ? S("", !0) : (f(), E($(de), {
                     key: 0,
                     id: "joy-dialog--close",
                     circle: "",
@@ -2257,11 +2273,11 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
                     name: "cross",
                     label: e.closeLabel,
                     class: "joy-dialog--close",
-                    onClick: T[1] || (T[1] = (J) => s())
+                    onClick: s
                   }, null, 8, ["label"]))
                 ]),
                 b("div", Jl, [
-                  w(V.$slots, "dialog-body", {}, void 0, !0)
+                  w(B.$slots, "dialog-body", {}, void 0, !0)
                 ]),
                 b("div", {
                   class: C([
@@ -2276,29 +2292,29 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
                     "no-margin": ""
                   }, {
                     default: D(() => [
-                      w(V.$slots, "dialog-cancel", {}, () => [
-                        e.cancelText ? (f(), B($(de), {
+                      w(B.$slots, "dialog-cancel", {}, () => [
+                        e.cancelText ? (f(), E($(de), {
                           key: 0,
                           class: "joy-dialog--cancel",
                           variant: "ghost",
                           size: e.buttonSize,
-                          onClick: T[2] || (T[2] = (J) => s())
+                          onClick: s
                         }, {
                           default: D(() => [
-                            z(N(e.cancelText), 1)
+                            z(J(e.cancelText), 1)
                           ]),
                           _: 1
                         }, 8, ["size"])) : S("", !0)
                       ], !0),
-                      w(V.$slots, "dialog-confirm", {}, () => [
-                        e.confirmText ? (f(), B($(de), {
+                      w(B.$slots, "dialog-confirm", {}, () => [
+                        e.confirmText ? (f(), E($(de), {
                           key: 0,
                           class: "joy-dialog--confirm",
                           variant: "main",
                           size: e.buttonSize
                         }, {
                           default: D(() => [
-                            z(N(e.confirmText), 1)
+                            z(J(e.confirmText), 1)
                           ]),
                           _: 1
                         }, 8, ["size"])) : S("", !0)
@@ -2308,7 +2324,7 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
                   })
                 ], 2),
                 $(r)["dialog-indicators"] ? (f(), g("div", Fl, [
-                  w(V.$slots, "dialog-indicators", {}, void 0, !0)
+                  w(B.$slots, "dialog-indicators", {}, void 0, !0)
                 ])) : S("", !0)
               ])
             ], 2)
@@ -2319,23 +2335,23 @@ const El = ["aria-labelledby", "onKeydown"], Al = { class: "joy-dialog__inner" }
     ], 8, ["to"])) : S("", !0);
   }
 });
-const Rl = /* @__PURE__ */ A(Pl, [["__scopeId", "data-v-7da64f47"]]), Dl = /* @__PURE__ */ L({
+const Rl = /* @__PURE__ */ L(Pl, [["__scopeId", "data-v-db3a6093"]]), Dl = /* @__PURE__ */ T({
   __name: "VJoyDialogTrigger",
   props: {
     dialog: {}
   },
   setup(e) {
-    const t = e, n = E(() => t.dialog), a = ee(), o = E(() => a.default());
-    function r() {
+    const t = e, n = I(() => t.dialog), a = ee(), o = I(() => a.default());
+    async function r() {
       var l;
-      (l = n.value) == null || l.openOverlay();
+      await ((l = n.value) == null ? void 0 : l.show());
     }
-    return (l, i) => (f(!0), g(K, null, G(o.value, (u) => (f(), B(ae(u), {
+    return (l, i) => (f(!0), g(K, null, G(o.value, (u) => (f(), E(ae(u), {
       key: u,
       onClick: r
     }))), 128));
   }
-}), Ml = ["disabled"], zl = { class: "joy-divider-cta--icon" }, ql = { class: "joy-divider-cta--content" }, Hl = { class: "joy-divider-cta--content---title" }, Wl = /* @__PURE__ */ L({
+}), Ml = ["disabled"], zl = { class: "joy-divider-cta--icon" }, ql = { class: "joy-divider-cta--content" }, Hl = { class: "joy-divider-cta--content---title" }, Wl = /* @__PURE__ */ T({
   __name: "VJoyDividerCta",
   props: {
     disabled: {
@@ -2361,7 +2377,7 @@ const Rl = /* @__PURE__ */ A(Pl, [["__scopeId", "data-v-7da64f47"]]), Dl = /* @_
     ], 10, Ml));
   }
 });
-const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["aria-labelledby", "onKeydown"], Gl = { class: "joy-drawer__inner" }, Yl = { class: "joy-drawer--header" }, Zl = ["id"], Ql = {
+const Ul = /* @__PURE__ */ L(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["aria-labelledby", "onKeydown"], Gl = { class: "joy-drawer__inner" }, Yl = { class: "joy-drawer--header" }, Zl = ["id"], Ql = {
   id: "drawerDescription",
   class: "joy-drawer--subheader"
 }, Xl = {
@@ -2370,7 +2386,7 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
 }, er = {
   key: 0,
   class: "joy-drawer--indicators"
-}, tr = /* @__PURE__ */ L({
+}, tr = /* @__PURE__ */ T({
   __name: "VJoyDrawer",
   props: {
     /** By default a focus-trap is activated. It means you can loop over all interactive elements within the open drawer. */
@@ -2396,6 +2412,13 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
       type: Boolean,
       default: !1
     },
+    /**
+     * @internal - Mostly for documentation purpose
+     */
+    preventBodyScroll: {
+      type: Boolean,
+      default: !0
+    },
     /** **For accessibility purpose**. Label associated with the top right corner icon.  */
     closeLabel: {
       type: String,
@@ -2416,9 +2439,9 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
   },
   emits: ["drawer:open", "drawer:after-open", "drawer:hide", "drawer:after-hide"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = "joy-drawer--" + he(), r = ee(), l = x(!1), i = x(), u = x(a.open), { activate: v, deactivate: d } = jn(i), c = E(() => {
-      const V = r["drawer-cancel"] || r["drawer-confirm"], T = a.cancelText || a.confirmText;
-      return !!V || !!T;
+    const a = e, o = "joy-drawer--" + he(), r = ee(), l = x(!1), i = x(), u = x(a.open), { activate: v, deactivate: d } = jn(i), c = I(() => {
+      const B = r["drawer-cancel"] || r["drawer-confirm"], N = a.cancelText || a.confirmText;
+      return !!B || !!N;
     });
     function p() {
       s();
@@ -2426,8 +2449,8 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
     async function s() {
       d(), u.value = !1, await Fe(), Le(!1), n("drawer:hide");
     }
-    async function y(V) {
-      u.value = !0, await Fe(), a.focusTrap && v(), V != null && V.preventBodyScroll && Le(!0);
+    async function y() {
+      u.value = !0, await Fe(), a.focusTrap && v(), !a.elevated && a.preventBodyScroll && Le(!0);
     }
     function m() {
       n("drawer:open");
@@ -2438,14 +2461,14 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
     function j() {
       n("drawer:after-hide");
     }
-    return se(async () => {
+    return se(() => {
       l.value = !0;
     }), t({
-      openOverlay: y,
       hasFooterSlots: c,
-      hideOverlay: s,
-      isOpen: u
-    }), (V, T) => l.value ? (f(), B(nt, {
+      hide: s,
+      isOpen: u,
+      show: y
+    }), (B, N) => l.value ? (f(), E(nt, {
       key: 0,
       to: e.teleport
     }, [
@@ -2500,10 +2523,10 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
                     id: o + "-header",
                     class: "joy-drawer--header__title"
                   }, [
-                    w(V.$slots, "drawer-header", {}, void 0, !0)
+                    w(B.$slots, "drawer-header", {}, void 0, !0)
                   ], 8, Zl),
                   b("p", Ql, [
-                    w(V.$slots, "drawer-subheader", {}, void 0, !0)
+                    w(B.$slots, "drawer-subheader", {}, void 0, !0)
                   ]),
                   W($(de), {
                     id: "joy-drawer--close",
@@ -2514,11 +2537,11 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
                     name: "cross",
                     label: e.closeLabel,
                     class: "joy-drawer--close",
-                    onClick: T[0] || (T[0] = (J) => s())
+                    onClick: s
                   }, null, 8, ["label"])
                 ]),
                 b("div", Xl, [
-                  w(V.$slots, "drawer-body", {}, void 0, !0)
+                  w(B.$slots, "drawer-body", {}, void 0, !0)
                 ]),
                 b("div", {
                   class: C([
@@ -2533,8 +2556,8 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
                     "no-margin": ""
                   }, {
                     default: D(() => [
-                      w(V.$slots, "drawer-cancel", {}, () => [
-                        e.cancelText ? (f(), B($(de), {
+                      w(B.$slots, "drawer-cancel", {}, () => [
+                        e.cancelText ? (f(), E($(de), {
                           key: 0,
                           class: "joy-drawer--cancel",
                           variant: "ghost",
@@ -2542,20 +2565,20 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
                           onClick: s
                         }, {
                           default: D(() => [
-                            z(N(e.cancelText), 1)
+                            z(J(e.cancelText), 1)
                           ]),
                           _: 1
                         }, 8, ["size"])) : S("", !0)
                       ], !0),
-                      w(V.$slots, "drawer-confirm", {}, () => [
-                        e.confirmText ? (f(), B($(de), {
+                      w(B.$slots, "drawer-confirm", {}, () => [
+                        e.confirmText ? (f(), E($(de), {
                           key: 0,
                           class: "joy-drawer--confirm",
                           variant: "main",
                           size: e.buttonSize
                         }, {
                           default: D(() => [
-                            z(N(e.confirmText), 1)
+                            z(J(e.confirmText), 1)
                           ]),
                           _: 1
                         }, 8, ["size"])) : S("", !0)
@@ -2565,7 +2588,7 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
                   })
                 ], 2),
                 $(r)["drawer-indicators"] ? (f(), g("div", er, [
-                  w(V.$slots, "drawer-indicators", {}, void 0, !0)
+                  w(B.$slots, "drawer-indicators", {}, void 0, !0)
                 ])) : S("", !0)
               ])
             ], 2)
@@ -2576,18 +2599,18 @@ const Ul = /* @__PURE__ */ A(Wl, [["__scopeId", "data-v-a3d693c3"]]), Kl = ["ari
     ], 8, ["to"])) : S("", !0);
   }
 });
-const nr = /* @__PURE__ */ A(tr, [["__scopeId", "data-v-2d92f80a"]]), ar = /* @__PURE__ */ L({
+const nr = /* @__PURE__ */ L(tr, [["__scopeId", "data-v-c118e2d8"]]), ar = /* @__PURE__ */ T({
   __name: "VJoyDrawerTrigger",
   props: {
     drawer: {}
   },
   setup(e) {
-    const t = e, n = E(() => t.drawer), a = ee(), o = E(() => a.default());
-    function r() {
+    const t = e, n = I(() => t.drawer), a = ee(), o = I(() => a.default());
+    async function r() {
       var l;
-      (l = n.value) == null || l.openOverlay();
+      await ((l = n.value) == null ? void 0 : l.show());
     }
-    return (l, i) => (f(!0), g(K, null, G(o.value, (u) => (f(), B(ae(u), {
+    return (l, i) => (f(!0), g(K, null, G(o.value, (u) => (f(), E(ae(u), {
       key: u,
       onClick: r
     }))), 128));
@@ -2598,7 +2621,7 @@ const nr = /* @__PURE__ */ A(tr, [["__scopeId", "data-v-2d92f80a"]]), ar = /* @_
 }, lr = ["aria-label", "aria-labelledby"], rr = ["id", "tabindex", "aria-disabled", "aria-selected", "title", "aria-label", ".dataModel", "onClick"], ir = {
   key: 1,
   class: "joy-dropdown-list__footer"
-}, sr = /* @__PURE__ */ L({
+}, sr = /* @__PURE__ */ T({
   __name: "VJoyDropdownList",
   props: {
     /**
@@ -2645,7 +2668,7 @@ const nr = /* @__PURE__ */ A(tr, [["__scopeId", "data-v-2d92f80a"]]), ar = /* @_
   },
   emits: ["update:modelValue", "close:dropdownList", "reset"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = x(), r = E(() => (s) => !a.modelValue || !s.value && !s.id ? !1 : a.modelValue === s.value || a.modelValue === s.id);
+    const a = e, o = x(), r = I(() => (s) => !a.modelValue || !s.value && !s.id ? !1 : a.modelValue === s.value || a.modelValue === s.id);
     function l(s) {
       s.disabled || n("update:modelValue", s.value || s.id);
     }
@@ -2705,7 +2728,7 @@ const nr = /* @__PURE__ */ A(tr, [["__scopeId", "data-v-2d92f80a"]]), ar = /* @_
           type: "button",
           class: "joy-dropdown-list__reset",
           onClick: p
-        }, N(e.resetLabel || "Reset"), 1)) : S("", !0),
+        }, J(e.resetLabel || "Reset"), 1)) : S("", !0),
         w(s.$slots, "dropdown-list-header", {}, void 0, !0)
       ])) : S("", !0),
       b("div", {
@@ -2745,7 +2768,7 @@ const nr = /* @__PURE__ */ A(tr, [["__scopeId", "data-v-2d92f80a"]]), ar = /* @_
             onClick: (k) => l(m)
           }, [
             w(s.$slots, "label", at(ot(m)), () => [
-              b("span", null, N(m.label), 1)
+              b("span", null, J(m.label), 1)
             ], !0)
           ], 14, rr))), 128))
         ], 8, lr)) : S("", !0)
@@ -2756,7 +2779,7 @@ const nr = /* @__PURE__ */ A(tr, [["__scopeId", "data-v-2d92f80a"]]), ar = /* @_
     ], 4));
   }
 });
-const Vn = /* @__PURE__ */ A(sr, [["__scopeId", "data-v-0127e896"]]);
+const Vn = /* @__PURE__ */ L(sr, [["__scopeId", "data-v-0127e896"]]);
 function ur(e) {
   const t = () => e();
   se(() => {
@@ -2765,7 +2788,7 @@ function ur(e) {
     window.removeEventListener("resize", t);
   });
 }
-const cr = /* @__PURE__ */ L({
+const cr = /* @__PURE__ */ T({
   __name: "VJoyDropdown",
   props: {
     /** DOM valid selector to give to Vue3 Teleport "to" property */
@@ -2864,15 +2887,15 @@ const cr = /* @__PURE__ */ L({
     let p = null;
     X(
       () => o.value,
-      (O) => {
-        O && Wa(i);
+      (A) => {
+        A && Wa(i);
       },
       { flush: "post" }
     );
-    const s = E(() => {
-      let O = `${a.dropdownGap}px`;
-      return a.direction === "up" && (O = "-" + O), {
-        marginTop: O
+    const s = I(() => {
+      let A = `${a.dropdownGap}px`;
+      return a.direction === "up" && (A = "-" + A), {
+        marginTop: A
       };
     });
     function y() {
@@ -2880,8 +2903,8 @@ const cr = /* @__PURE__ */ L({
         o.value = !1, v.value = !1, n("dropdown:hide");
       }, 300);
     }
-    function m(O) {
-      v.value = !1, p && clearTimeout(p), u.value = O.target, o.value = !0, n("dropdown:open");
+    function m(A) {
+      v.value = !1, p && clearTimeout(p), u.value = A.target, o.value = !0, n("dropdown:open");
     }
     function k() {
       y(), j();
@@ -2889,21 +2912,21 @@ const cr = /* @__PURE__ */ L({
     function j() {
       u.value && u.value.focus();
     }
-    function V(O) {
-      n("update:modelValue", O), a.closeOnSelect && (y(), j());
+    function B(A) {
+      n("update:modelValue", A), a.closeOnSelect && (y(), j());
     }
-    function T() {
+    function N() {
       n("dropdown:reset");
     }
-    function J() {
+    function O() {
       !l.value || !l.value.children.length || (l.value.children[0].id = d);
     }
     return ur(y), se(() => {
-      J();
+      O();
     }), t({
       showDropdownList: o,
       generatedId: d
-    }), (O, Z) => (f(), B($(Tt), {
+    }), (A, Z) => (f(), E($(Tt), {
       ref_key: "dropdown",
       ref: r,
       options: c,
@@ -2918,7 +2941,7 @@ const cr = /* @__PURE__ */ L({
           "data-testid": "dropdown-trigger",
           onClick: m
         }, [
-          w(O.$slots, "dropdown-button", {}, void 0, !0)
+          w(A.$slots, "dropdown-button", {}, void 0, !0)
         ], 512),
         o.value ? (f(), g("div", {
           key: 0,
@@ -2944,35 +2967,35 @@ const cr = /* @__PURE__ */ L({
             reset: e.reset,
             "reset-label": e.resetLabel,
             "aria-labelled-by": d,
-            "onUpdate:modelValue": V,
+            "onUpdate:modelValue": B,
             "onClose:dropdownList": k,
-            onReset: T
+            onReset: N
           }, fn({
             label: D((R) => [
-              w(O.$slots, "dropdown-item", at(ot(R)), () => [
-                b("span", null, N(R.label), 1)
+              w(A.$slots, "dropdown-item", at(ot(R)), () => [
+                b("span", null, J(R.label), 1)
               ], !0)
             ]),
             _: 2
           }, [
-            O.$slots["dropdown-header"] ? {
+            A.$slots["dropdown-header"] ? {
               name: "dropdown-list-header",
               fn: D(() => [
-                w(O.$slots, "dropdown-header", {}, void 0, !0)
+                w(A.$slots, "dropdown-header", {}, void 0, !0)
               ]),
               key: "0"
             } : void 0,
-            O.$slots["dropdown-items"] ? {
+            A.$slots["dropdown-items"] ? {
               name: "dropdown-list-items",
               fn: D(() => [
-                w(O.$slots, "dropdown-items", {}, void 0, !0)
+                w(A.$slots, "dropdown-items", {}, void 0, !0)
               ]),
               key: "1"
             } : void 0,
-            O.$slots["dropdown-footer"] ? {
+            A.$slots["dropdown-footer"] ? {
               name: "dropdown-list-footer",
               fn: D(() => [
-                w(O.$slots, "dropdown-footer", {}, void 0, !0)
+                w(A.$slots, "dropdown-footer", {}, void 0, !0)
               ]),
               key: "2"
             } : void 0
@@ -2983,7 +3006,7 @@ const cr = /* @__PURE__ */ L({
     }, 512));
   }
 });
-const dr = /* @__PURE__ */ A(cr, [["__scopeId", "data-v-1f0943e6"]]), fr = ["aria-label"], yr = { class: "joy-filter-bar__wrapper" }, vr = /* @__PURE__ */ L({
+const dr = /* @__PURE__ */ L(cr, [["__scopeId", "data-v-1f0943e6"]]), fr = ["aria-label"], yr = { class: "joy-filter-bar__wrapper" }, vr = /* @__PURE__ */ T({
   __name: "VJoyFilterBar",
   props: {
     ariaLabel: String
@@ -3000,7 +3023,7 @@ const dr = /* @__PURE__ */ A(cr, [["__scopeId", "data-v-1f0943e6"]]), fr = ["ari
     ], 8, fr));
   }
 });
-const pr = /* @__PURE__ */ A(vr, [["__scopeId", "data-v-114f8274"]]), mr = /* @__PURE__ */ L({
+const pr = /* @__PURE__ */ L(vr, [["__scopeId", "data-v-114f8274"]]), mr = /* @__PURE__ */ T({
   __name: "VJoyFilterBarButton",
   props: {
     label: String,
@@ -3024,9 +3047,9 @@ const pr = /* @__PURE__ */ A(vr, [["__scopeId", "data-v-114f8274"]]), mr = /* @_
       class: C(["joy-filter-bar-button", { "joy-filter-bar-button--active": e.active }]),
       onClick: o
     }, [
-      z(N(e.label) + " ", 1),
+      z(J(e.label) + " ", 1),
       w(r.$slots, "default", {}, void 0, !0),
-      $(a) ? (f(), B(H, {
+      $(a) ? (f(), E(H, {
         key: 0,
         class: "joy-filter-bar-button__icon",
         name: "chevron-down",
@@ -3036,7 +3059,7 @@ const pr = /* @__PURE__ */ A(vr, [["__scopeId", "data-v-114f8274"]]), mr = /* @_
     ], 2));
   }
 });
-const br = /* @__PURE__ */ A(mr, [["__scopeId", "data-v-8f87fed1"]]), gr = { class: "joy-footer" }, hr = { class: "joy-footer__left" }, _r = { class: "joy-footer__right" }, wr = /* @__PURE__ */ L({
+const br = /* @__PURE__ */ L(mr, [["__scopeId", "data-v-8f87fed1"]]), gr = { class: "joy-footer" }, hr = { class: "joy-footer__left" }, _r = { class: "joy-footer__right" }, wr = /* @__PURE__ */ T({
   __name: "VJoyFooter",
   setup(e) {
     return (t, n) => (f(), g("footer", gr, [
@@ -3049,7 +3072,7 @@ const br = /* @__PURE__ */ A(mr, [["__scopeId", "data-v-8f87fed1"]]), gr = { cla
     ]));
   }
 });
-const Sr = /* @__PURE__ */ A(wr, [["__scopeId", "data-v-1e11bcdc"]]), kr = ["aria-hidden"], xr = /* @__PURE__ */ L({
+const Sr = /* @__PURE__ */ L(wr, [["__scopeId", "data-v-1e11bcdc"]]), kr = ["aria-hidden"], xr = /* @__PURE__ */ T({
   __name: "VJoyFormError",
   props: {
     /** In some cases you'll need to inject the error in the DOM but hide it. Visible by default */
@@ -3072,13 +3095,13 @@ const Sr = /* @__PURE__ */ A(wr, [["__scopeId", "data-v-1e11bcdc"]]), kr = ["ari
       }),
       b("div", null, [
         w(t.$slots, "default", {}, () => [
-          z(N(e.noHtmlErrorText), 1)
+          z(J(e.noHtmlErrorText), 1)
         ], !0)
       ])
     ], 10, kr));
   }
 });
-const Tn = /* @__PURE__ */ A(xr, [["__scopeId", "data-v-581fd33b"]]), Cr = /* @__PURE__ */ L({
+const Tn = /* @__PURE__ */ L(xr, [["__scopeId", "data-v-581fd33b"]]), Cr = /* @__PURE__ */ T({
   __name: "VJoyFormFieldSkeleton",
   props: {
     /** In some cases you'll need to inject the error in the DOM but hide it. Visible by default */
@@ -3098,7 +3121,7 @@ const Tn = /* @__PURE__ */ A(xr, [["__scopeId", "data-v-581fd33b"]]), Cr = /* @_
     }
   },
   setup(e, { expose: t }) {
-    const n = e, a = lt("VJoyWrapperContext", {}), o = E(() => {
+    const n = e, a = lt("VJoyWrapperContext", {}), o = I(() => {
       const r = a.direction === "column" ? "auto" : null;
       if (!n.width && n.flex === "1") {
         const u = ["1", "0"];
@@ -3117,9 +3140,9 @@ const Tn = /* @__PURE__ */ A(xr, [["__scopeId", "data-v-581fd33b"]]), Cr = /* @_
     }, null, 6));
   }
 });
-const jr = /* @__PURE__ */ A(Cr, [["__scopeId", "data-v-8a4ecbad"]]), $r = { class: "joy-funnel__header" }, Vr = { class: "funnel__header__inner" }, Tr = { class: "joy-funnel__stepper" }, Ir = /* @__PURE__ */ yn('<div class="shapes__wrapper" data-v-0abeb951><div class="shape_1" data-v-0abeb951></div><div class="shape_2" data-v-0abeb951></div><div class="shape_3" data-v-0abeb951></div><div class="shape_4" data-v-0abeb951></div></div>', 1), Lr = [
+const jr = /* @__PURE__ */ L(Cr, [["__scopeId", "data-v-8a4ecbad"]]), $r = { class: "joy-funnel__header" }, Vr = { class: "funnel__header__inner" }, Tr = { class: "joy-funnel__stepper" }, Ir = /* @__PURE__ */ yn('<div class="shapes__wrapper" data-v-0abeb951><div class="shape_1" data-v-0abeb951></div><div class="shape_2" data-v-0abeb951></div><div class="shape_3" data-v-0abeb951></div><div class="shape_4" data-v-0abeb951></div></div>', 1), Lr = [
   Ir
-], Er = { class: "joy-funnel__footer" }, Ar = /* @__PURE__ */ L({
+], Er = { class: "joy-funnel__footer" }, Br = /* @__PURE__ */ T({
   __name: "VJoyFunnel",
   props: {
     /**
@@ -3144,7 +3167,7 @@ const jr = /* @__PURE__ */ A(Cr, [["__scopeId", "data-v-8a4ecbad"]]), $r = { cla
       const i = l.currentTarget;
       n.value = i.scrollTop === 0;
     }
-    const r = E(() => !!a["funnel-stepper"]);
+    const r = I(() => !!a["funnel-stepper"]);
     return t({
       scrollOnTop: n,
       hasStepperSlot: r
@@ -3185,7 +3208,7 @@ const jr = /* @__PURE__ */ A(Cr, [["__scopeId", "data-v-8a4ecbad"]]), $r = { cla
     ], 2));
   }
 });
-const Br = /* @__PURE__ */ A(Ar, [["__scopeId", "data-v-0abeb951"]]), Or = { class: "joy-header" }, Nr = { class: "joy-header__left" }, Jr = { class: "joy-header__right" }, Fr = /* @__PURE__ */ L({
+const Ar = /* @__PURE__ */ L(Br, [["__scopeId", "data-v-0abeb951"]]), Or = { class: "joy-header" }, Nr = { class: "joy-header__left" }, Jr = { class: "joy-header__right" }, Fr = /* @__PURE__ */ T({
   __name: "VJoyHeader",
   setup(e) {
     return (t, n) => (f(), g("header", Or, [
@@ -3198,7 +3221,7 @@ const Br = /* @__PURE__ */ A(Ar, [["__scopeId", "data-v-0abeb951"]]), Or = { cla
     ]));
   }
 });
-const Pr = /* @__PURE__ */ A(Fr, [["__scopeId", "data-v-7928856e"]]), Rr = [...Ya], Dr = { class: "joy-highlight--text" }, Mr = { key: 0 }, zr = /* @__PURE__ */ L({
+const Pr = /* @__PURE__ */ L(Fr, [["__scopeId", "data-v-7928856e"]]), Rr = [...Ya], Dr = { class: "joy-highlight--text" }, Mr = { key: 0 }, zr = /* @__PURE__ */ T({
   __name: "VJoyHighlight",
   props: {
     accent: {
@@ -3221,7 +3244,7 @@ const Pr = /* @__PURE__ */ A(Fr, [["__scopeId", "data-v-7928856e"]]), Rr = [...Y
     }
   },
   setup(e, { expose: t }) {
-    const n = e, a = E(() => n.icon ? n.icon : pn(n.level));
+    const n = e, a = I(() => n.icon ? n.icon : pn(n.level));
     return t({
       getRelevantIcon: a
     }), (o, r) => (f(), g("div", {
@@ -3234,7 +3257,7 @@ const Pr = /* @__PURE__ */ A(Fr, [["__scopeId", "data-v-7928856e"]]), Rr = [...Y
         }
       ])
     }, [
-      e.displayIcon ? (f(), B(H, {
+      e.displayIcon ? (f(), E(H, {
         key: 0,
         name: a.value
       }, null, 8, ["name"])) : S("", !0),
@@ -3247,7 +3270,7 @@ const Pr = /* @__PURE__ */ A(Fr, [["__scopeId", "data-v-7928856e"]]), Rr = [...Y
     ], 2));
   }
 });
-const qr = /* @__PURE__ */ A(zr, [["__scopeId", "data-v-45c2fbf4"]]), Hr = ["aria-label"], Wr = /* @__PURE__ */ L({
+const qr = /* @__PURE__ */ L(zr, [["__scopeId", "data-v-45c2fbf4"]]), Hr = ["aria-label"], Wr = /* @__PURE__ */ T({
   __name: "VJoyIndicator",
   props: {
     /** Value is used for the parent v-model. Mandatory */
@@ -3281,7 +3304,7 @@ const qr = /* @__PURE__ */ A(zr, [["__scopeId", "data-v-45c2fbf4"]]), Hr = ["ari
     ], 2));
   }
 });
-const In = /* @__PURE__ */ A(Wr, [["__scopeId", "data-v-9b442c08"]]), Ur = /* @__PURE__ */ L({
+const In = /* @__PURE__ */ L(Wr, [["__scopeId", "data-v-9b442c08"]]), Ur = /* @__PURE__ */ T({
   __name: "VJoyIndicators",
   props: {
     variant: {
@@ -3294,7 +3317,7 @@ const In = /* @__PURE__ */ A(Wr, [["__scopeId", "data-v-9b442c08"]]), Ur = /* @_
   },
   emits: ["update:modelValue"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = ee(), r = x(a.modelValue), l = E(() => o.default && o.default().filter(u));
+    const a = e, o = ee(), r = x(a.modelValue), l = I(() => o.default && o.default().filter(u));
     function i(d) {
       return r.value === d.props.value;
     }
@@ -3311,7 +3334,7 @@ const In = /* @__PURE__ */ A(Wr, [["__scopeId", "data-v-9b442c08"]]), Ur = /* @_
     }), (d, c) => (f(), g("ul", {
       class: C(["joy-indicators", `joy-indicators--${e.variant}`])
     }, [
-      (f(!0), g(K, null, G(l.value, (p) => (f(), B($(In), ie({
+      (f(!0), g(K, null, G(l.value, (p) => (f(), E($(In), ie({
         key: p.props.value
       }, { ...p.props, variant: e.variant }, {
         selected: i(p),
@@ -3320,13 +3343,13 @@ const In = /* @__PURE__ */ A(Wr, [["__scopeId", "data-v-9b442c08"]]), Ur = /* @_
     ], 2));
   }
 });
-const Kr = /* @__PURE__ */ A(Ur, [["__scopeId", "data-v-9391a5cb"]]), Gr = ["small", "medium", "large"], Yr = {
+const Kr = /* @__PURE__ */ L(Ur, [["__scopeId", "data-v-9391a5cb"]]), Gr = ["small", "medium", "large"], Yr = {
   key: 0,
   class: "joy-label-required"
 }, Zr = {
   key: 1,
   class: "joy-label-optional"
-}, Qr = /* @__PURE__ */ L({
+}, Qr = /* @__PURE__ */ T({
   __name: "VJoyLabel",
   props: {
     size: {
@@ -3350,21 +3373,21 @@ const Kr = /* @__PURE__ */ A(Ur, [["__scopeId", "data-v-9391a5cb"]]), Gr = ["sma
     text: String
   },
   setup(e) {
-    return (t, n) => (f(), B(ae(e.tagName), ie({
+    return (t, n) => (f(), E(ae(e.tagName), ie({
       class: ["joy-label", `joy-label--${e.size}`]
     }, t.$attrs), {
       default: D(() => [
         w(t.$slots, "default", {}, () => [
-          z(N(e.text), 1)
+          z(J(e.text), 1)
         ], !0),
         e.required ? (f(), g("span", Yr, "*")) : S("", !0),
-        e.optionalLabel ? (f(), g("span", Zr, "- " + N(e.optionalLabel), 1)) : S("", !0)
+        e.optionalLabel ? (f(), g("span", Zr, "- " + J(e.optionalLabel), 1)) : S("", !0)
       ]),
       _: 3
     }, 16, ["class"]));
   }
 });
-const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["large", "medium", "small"], ei = ["id", "name", "required", "disabled", "type", "value"], ti = ["data-unit"], ni = /* @__PURE__ */ L({
+const Ce = /* @__PURE__ */ L(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["large", "medium", "small"], ei = ["id", "name", "required", "disabled", "type", "value"], ti = ["data-unit"], ni = /* @__PURE__ */ T({
   inheritAttrs: !1,
   __name: "VJoyInput",
   props: {
@@ -3434,7 +3457,7 @@ const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["lar
   },
   emits: ["update:modelValue"],
   setup(e, { emit: t }) {
-    const n = e, a = x(), o = x(), r = ht(), l = ee(), i = x(!1), u = E(() => typeof n.modelValue == "number" || !n.clearable || n.unit || !n.modelValue ? !1 : n.modelValue.length > 0 && !n.unit), v = E(() => l.default && l.default()), d = E(() => {
+    const n = e, a = x(), o = x(), r = ht(), l = ee(), i = x(!1), u = I(() => typeof n.modelValue == "number" || !n.clearable || n.unit || !n.modelValue ? !1 : n.modelValue.length > 0 && !n.unit), v = I(() => l.default && l.default()), d = I(() => {
       var s, y;
       return !!((s = o.value) != null && s.closest("joy-wrapper")) || !!((y = o.value) != null && y.closest(".joy-wrapper"));
     }), c = x(n.type);
@@ -3476,7 +3499,7 @@ const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["lar
           }
         ])
       }, [
-        v.value || e.label ? (f(), B(Ce, {
+        v.value || e.label ? (f(), E(Ce, {
           key: 0,
           for: e.id || e.name,
           required: e.required && e.requiredMark,
@@ -3485,7 +3508,7 @@ const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["lar
         }, {
           default: D(() => [
             w(s.$slots, "default", {}, () => [
-              z(N(e.label), 1)
+              z(J(e.label), 1)
             ], !0)
           ]),
           _: 3
@@ -3525,7 +3548,7 @@ const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["lar
             onChange: y[3] || (y[3] = //@ts-ignore
             (...m) => p.onChange && p.onChange(...m))
           }), null, 16, ei),
-          u.value ? (f(), B(de, {
+          u.value ? (f(), E(de, {
             key: 0,
             class: "joy-input--clear",
             circle: "",
@@ -3534,7 +3557,7 @@ const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["lar
             icon: "cross",
             onClick: p.clearValue
           }, null, 8, ["onClick"])) : S("", !0),
-          e.icon ? (f(), B(H, {
+          e.icon ? (f(), E(H, {
             key: 1,
             class: "joy-input--decorative-icon",
             name: e.icon
@@ -3549,7 +3572,7 @@ const Ce = /* @__PURE__ */ A(Qr, [["__scopeId", "data-v-388a7c56"]]), Xr = ["lar
     ], 2));
   }
 });
-const ai = /* @__PURE__ */ A(ni, [["__scopeId", "data-v-b95b732a"]]), oi = ["teal", "white"], li = ["href"], ri = /* @__PURE__ */ L({
+const ai = /* @__PURE__ */ L(ni, [["__scopeId", "data-v-b95b732a"]]), oi = ["teal", "white"], li = ["href"], ri = /* @__PURE__ */ T({
   __name: "VJoyLink",
   props: {
     href: {
@@ -3570,17 +3593,17 @@ const ai = /* @__PURE__ */ A(ni, [["__scopeId", "data-v-b95b732a"]]), oi = ["tea
     return (t, n) => (f(), g("a", ie({ href: e.href }, t.$attrs, {
       class: ["joy-link", `joy-link_${e.color}`]
     }), [
-      e.icon ? (f(), B(H, {
+      e.icon ? (f(), E(H, {
         key: 0,
         name: e.icon
       }, null, 8, ["name"])) : S("", !0),
       w(t.$slots, "default", {}, () => [
-        z(N(e.text), 1)
+        z(J(e.text), 1)
       ], !0)
     ], 16, li));
   }
 });
-const ii = /* @__PURE__ */ A(ri, [["__scopeId", "data-v-5540214e"]]), si = ["tabindex", "aria-activedescendant", "aria-label"], ui = ["id", "aria-disabled", "aria-current", "title", "aria-label", ".dataModel", "onClick"], ci = { "aria-hidden": "true" }, di = /* @__PURE__ */ L({
+const ii = /* @__PURE__ */ L(ri, [["__scopeId", "data-v-5540214e"]]), si = ["tabindex", "aria-activedescendant", "aria-label"], ui = ["id", "aria-disabled", "aria-current", "title", "aria-label", ".dataModel", "onClick"], ci = { "aria-hidden": "true" }, di = /* @__PURE__ */ T({
   __name: "VJoyMenu",
   props: {
     /**
@@ -3668,20 +3691,20 @@ const ii = /* @__PURE__ */ A(ri, [["__scopeId", "data-v-5540214e"]]), si = ["tab
       }, [
         b("div", ci, [
           w(c.$slots, "menu-item", at(ot(s)), () => [
-            s.icon ? (f(), B(H, {
+            s.icon ? (f(), E(H, {
               key: 0,
               name: s.icon
             }, null, 8, ["name"])) : S("", !0),
-            b("span", null, N(s.label), 1)
+            b("span", null, J(s.label), 1)
           ], !0)
         ])
       ], 10, ui))), 128))
     ], 40, si));
   }
 });
-const fi = /* @__PURE__ */ A(di, [["__scopeId", "data-v-4391a0bd"]]), yi = ["id"], vi = {
+const fi = /* @__PURE__ */ L(di, [["__scopeId", "data-v-4391a0bd"]]), yi = ["id"], vi = {
   class: /* @__PURE__ */ C(["joy-multi-checkbox"])
-}, pi = /* @__PURE__ */ L({
+}, pi = /* @__PURE__ */ T({
   __name: "VJoyMultiCheckbox",
   props: {
     options: {
@@ -3728,7 +3751,7 @@ const fi = /* @__PURE__ */ A(di, [["__scopeId", "data-v-4391a0bd"]]), yi = ["id"
       id: e.id,
       class: "joy-multi-checkbox__wrapper"
     }, [
-      e.label ? (f(), B($(Ce), {
+      e.label ? (f(), E($(Ce), {
         key: 0,
         "tag-name": "legend",
         required: e.required && e.requiredMark,
@@ -3736,12 +3759,12 @@ const fi = /* @__PURE__ */ A(di, [["__scopeId", "data-v-4391a0bd"]]), yi = ["id"
         size: e.labelSize
       }, {
         default: D(() => [
-          z(N(e.label), 1)
+          z(J(e.label), 1)
         ]),
         _: 1
       }, 8, ["required", "optional-label", "size"])) : S("", !0),
       b("div", vi, [
-        (f(!0), g(K, null, G(e.options, (i) => (f(), B($(It), {
+        (f(!0), g(K, null, G(e.options, (i) => (f(), E($(It), {
           id: i.id,
           key: i.id,
           name: i.name,
@@ -3751,7 +3774,7 @@ const fi = /* @__PURE__ */ A(di, [["__scopeId", "data-v-4391a0bd"]]), yi = ["id"
         }, {
           default: D(() => [
             w(r.$slots, "checkbox", at(ot(i)), () => [
-              z(N(i.label), 1)
+              z(J(i.label), 1)
             ], !0)
           ]),
           _: 2
@@ -3760,7 +3783,7 @@ const fi = /* @__PURE__ */ A(di, [["__scopeId", "data-v-4391a0bd"]]), yi = ["id"
     ], 8, yi));
   }
 });
-const mi = /* @__PURE__ */ A(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @__PURE__ */ L({
+const mi = /* @__PURE__ */ L(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @__PURE__ */ T({
   __name: "PaginationIcon",
   props: {
     label: {
@@ -3778,7 +3801,7 @@ const mi = /* @__PURE__ */ A(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @_
   },
   emits: ["click"],
   setup(e) {
-    return (t, n) => (f(), B(de, {
+    return (t, n) => (f(), E(de, {
       class: "joy-pagination__icon",
       "aria-label": e.label,
       title: e.label,
@@ -3791,7 +3814,7 @@ const mi = /* @__PURE__ */ A(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @_
       onClick: n[0] || (n[0] = (a) => t.$emit("click"))
     }, null, 8, ["aria-label", "title", "icon", "disabled"]));
   }
-}), bi = ["aria-label", "data-current"], gi = { class: "joy-pagination__previous" }, hi = ["aria-current", "onClick"], _i = { class: "joy-pagination__next" }, wi = 6, Si = /* @__PURE__ */ L({
+}), bi = ["aria-label", "data-current"], gi = { class: "joy-pagination__previous" }, hi = ["aria-current", "onClick"], _i = { class: "joy-pagination__next" }, wi = 6, Si = /* @__PURE__ */ T({
   __name: "VJoyPagination",
   props: {
     /** Current page number */
@@ -3822,10 +3845,10 @@ const mi = /* @__PURE__ */ A(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @_
   },
   emits: ["update:current-page"],
   setup(e, { emit: t }) {
-    const n = e, a = E(() => {
+    const n = e, a = I(() => {
       const v = r.value.length;
       return r.value[v - 1] !== r.value[v - 2] + 1;
-    }), o = E(() => r.value[0] !== r.value[1] - 1), r = E(() => n.totalPages < wi ? i(2, n.totalPages - 1) : u(n.currentPage));
+    }), o = I(() => r.value[0] !== r.value[1] - 1), r = I(() => n.totalPages < wi ? i(2, n.totalPages - 1) : u(n.currentPage));
     function l(v) {
       t("update:current-page", v);
     }
@@ -3868,7 +3891,7 @@ const mi = /* @__PURE__ */ A(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @_
                   "joy-pagination__separator joy-pagination__separator-before": c === e.totalPages && a.value
                 }),
                 onClick: (p) => l(c)
-              }, N(c), 11, hi)
+              }, J(c), 11, hi)
             ]))), 128))
           ])
         ]),
@@ -3886,7 +3909,7 @@ const mi = /* @__PURE__ */ A(pi, [["__scopeId", "data-v-c278b02d"]]), on = /* @_
     ], 8, bi));
   }
 });
-const ki = /* @__PURE__ */ A(Si, [["__scopeId", "data-v-e5b57944"]]), xi = ["small", "medium", "large"], Ci = ["small", "large"], ji = {
+const ki = /* @__PURE__ */ L(Si, [["__scopeId", "data-v-e5b57944"]]), xi = ["small", "medium", "large"], Ci = ["small", "large"], ji = {
   key: 0,
   class: /* @__PURE__ */ C(["joy-panel__header"])
 }, $i = {
@@ -3898,7 +3921,7 @@ const ki = /* @__PURE__ */ A(Si, [["__scopeId", "data-v-e5b57944"]]), xi = ["sma
 }, Ti = { class: "joy-panel__body" }, Ii = {
   key: 1,
   class: "joy-panel__footer"
-}, Li = /* @__PURE__ */ L({
+}, Li = /* @__PURE__ */ T({
   __name: "VJoyPanel",
   props: {
     flex: {
@@ -3932,7 +3955,7 @@ const ki = /* @__PURE__ */ A(Si, [["__scopeId", "data-v-e5b57944"]]), xi = ["sma
     }
   },
   setup(e) {
-    const t = lt("VJoyWrapperContext", {}), n = E(() => Object.keys(t).length > 0), a = ee(), o = x(), r = E(() => a["panel-title"] || a["panel-subtitle"] || a["panel-title-action"]);
+    const t = lt("VJoyWrapperContext", {}), n = I(() => Object.keys(t).length > 0), a = ee(), o = x(), r = I(() => a["panel-title"] || a["panel-subtitle"] || a["panel-title-action"]);
     return (l, i) => (f(), g("section", {
       ref_key: "panel",
       ref: o,
@@ -3966,7 +3989,7 @@ const ki = /* @__PURE__ */ A(Si, [["__scopeId", "data-v-e5b57944"]]), xi = ["sma
       $(a)["panel-action"] ? (f(), g("footer", Ii, [
         w(l.$slots, "panel-action", {}, void 0, !0)
       ])) : S("", !0),
-      e.loading ? (f(), B($(Lt), {
+      e.loading ? (f(), E($(Lt), {
         key: 2,
         overlay: "",
         color: e.loadingColor
@@ -3979,18 +4002,18 @@ const ki = /* @__PURE__ */ A(Si, [["__scopeId", "data-v-e5b57944"]]), xi = ["sma
     ], 6));
   }
 });
-const Ei = /* @__PURE__ */ A(Li, [["__scopeId", "data-v-4a8b703c"]]), Ai = { class: "joy-panel-section" }, Bi = {
+const Ei = /* @__PURE__ */ L(Li, [["__scopeId", "data-v-4a8b703c"]]), Bi = { class: "joy-panel-section" }, Ai = {
   key: 0,
   class: "joy-panel-section__title"
 }, Oi = {
   key: 1,
   class: "joy-panel-section__content"
-}, Ni = /* @__PURE__ */ L({
+}, Ni = /* @__PURE__ */ T({
   __name: "VJoyPanelSection",
   setup(e) {
     const t = ee();
-    return (n, a) => (f(), g("div", Ai, [
-      $(t)["panel-section-title"] ? (f(), g("div", Bi, [
+    return (n, a) => (f(), g("div", Bi, [
+      $(t)["panel-section-title"] ? (f(), g("div", Ai, [
         w(n.$slots, "panel-section-title", {}, void 0, !0)
       ])) : S("", !0),
       $(t)["panel-section-content"] ? (f(), g("div", Oi, [
@@ -3999,7 +4022,7 @@ const Ei = /* @__PURE__ */ A(Li, [["__scopeId", "data-v-4a8b703c"]]), Ai = { cla
     ]));
   }
 });
-const Ji = /* @__PURE__ */ A(Ni, [["__scopeId", "data-v-d88510ab"]]), Fi = { class: "joy-progress-bar-wrapper" }, Pi = /* @__PURE__ */ L({
+const Ji = /* @__PURE__ */ L(Ni, [["__scopeId", "data-v-d88510ab"]]), Fi = { class: "joy-progress-bar-wrapper" }, Pi = /* @__PURE__ */ T({
   __name: "VJoyProgressBar",
   props: {
     color: {
@@ -4026,7 +4049,7 @@ const Ji = /* @__PURE__ */ A(Ni, [["__scopeId", "data-v-d88510ab"]]), Fi = { cla
     }
   },
   setup(e, { expose: t }) {
-    const n = e, a = x(0), o = E(() => r());
+    const n = e, a = x(0), o = I(() => r());
     function r() {
       return n.percentage ? a.value = n.percentage : n.currentStep && n.steps ? a.value = Math.round(n.currentStep / n.steps * 100) : a.value = 0, a.value < 0 && (a.value = 0), a.value > 100 && (a.value = 100), a.value + "%";
     }
@@ -4041,7 +4064,7 @@ const Ji = /* @__PURE__ */ A(Ni, [["__scopeId", "data-v-d88510ab"]]), Fi = { cla
     ]));
   }
 });
-const Ri = /* @__PURE__ */ A(Pi, [["__scopeId", "data-v-1b2b3de8"]]), Di = ["id", "value", "checked", "disabled", "required", "name"], Mi = { class: "joy-radio-label" }, zi = { class: "joy-radio-content__wrapper" }, qi = { class: "joy-radio-content" }, Hi = /* @__PURE__ */ L({
+const Ri = /* @__PURE__ */ L(Pi, [["__scopeId", "data-v-1b2b3de8"]]), Di = ["id", "value", "checked", "disabled", "required", "name"], Mi = { class: "joy-radio-label" }, zi = { class: "joy-radio-content__wrapper" }, qi = { class: "joy-radio-content" }, Hi = /* @__PURE__ */ T({
   __name: "VJoyRadio",
   props: {
     disabled: {
@@ -4077,7 +4100,7 @@ const Ri = /* @__PURE__ */ A(Pi, [["__scopeId", "data-v-1b2b3de8"]]), Di = ["id"
   },
   emits: ["update:modelValue"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = x(!1), r = x(!1), l = x(null), i = x(null), u = ee(), v = E(() => !a.modelValue || !a.value ? !1 : a.modelValue === a.value);
+    const a = e, o = x(!1), r = x(!1), l = x(null), i = x(null), u = ee(), v = I(() => !a.modelValue || !a.value ? !1 : a.modelValue === a.value);
     function d() {
       o.value = !!u["expandable-content"] && v.value;
     }
@@ -4146,7 +4169,7 @@ const Ri = /* @__PURE__ */ A(Pi, [["__scopeId", "data-v-1b2b3de8"]]), Di = ["id"
     ], 2));
   }
 });
-const Wi = /* @__PURE__ */ A(Hi, [["__scopeId", "data-v-24cea99b"]]), Ui = ["form", "name"], Ki = /* @__PURE__ */ L({
+const Wi = /* @__PURE__ */ L(Hi, [["__scopeId", "data-v-24cea99b"]]), Ui = ["form", "name"], Ki = /* @__PURE__ */ T({
   __name: "VJoyRadioGroup",
   props: {
     /**
@@ -4183,7 +4206,7 @@ const Wi = /* @__PURE__ */ A(Hi, [["__scopeId", "data-v-24cea99b"]]), Ui = ["for
     ], 8, Ui));
   }
 });
-const Gi = /* @__PURE__ */ A(Ki, [["__scopeId", "data-v-a77e7f95"]]), Yi = ["ariaLabel"], Zi = { class: "joy-rating-stars" }, Qi = { class: "joy-rating-stars__content" }, Xi = { key: 0 }, es = /* @__PURE__ */ L({
+const Gi = /* @__PURE__ */ L(Ki, [["__scopeId", "data-v-a77e7f95"]]), Yi = ["ariaLabel"], Zi = { class: "joy-rating-stars" }, Qi = { class: "joy-rating-stars__content" }, Xi = { key: 0 }, es = /* @__PURE__ */ T({
   __name: "VJoyRatingStars",
   props: {
     ratingValue: {
@@ -4200,7 +4223,7 @@ const Gi = /* @__PURE__ */ A(Ki, [["__scopeId", "data-v-a77e7f95"]]), Yi = ["ari
     }
   },
   setup(e, { expose: t }) {
-    const n = e, a = ht(), o = E(() => {
+    const n = e, a = ht(), o = I(() => {
       let r = [], l = 0.24, i = 0.75;
       for (let u = 0; u < 5; u++)
         n.ratingValue > l ? r.push(n.ratingValue < i ? "half" : "full") : r.push("empty"), l += 1, i += 1;
@@ -4218,17 +4241,17 @@ const Gi = /* @__PURE__ */ A(Ki, [["__scopeId", "data-v-a77e7f95"]]), Yi = ["ari
           key: u,
           class: C([`joy-rating-stars--${e.size}`])
         }, [
-          i === "full" ? (f(), B(H, {
+          i === "full" ? (f(), E(H, {
             key: 0,
             "aria-hidden": "true",
             name: "star-fill",
             color: "quaternary"
-          })) : i === "half" ? (f(), B(H, {
+          })) : i === "half" ? (f(), E(H, {
             key: 1,
             "aria-hidden": "true",
             name: "star-half",
             color: "quaternary"
-          })) : (f(), B(H, {
+          })) : (f(), E(H, {
             key: 2,
             "aria-hidden": "true",
             name: "star",
@@ -4238,16 +4261,16 @@ const Gi = /* @__PURE__ */ A(Ki, [["__scopeId", "data-v-a77e7f95"]]), Yi = ["ari
       ]),
       b("div", Qi, [
         w(r.$slots, "rating-stars-content", {}, () => [
-          e.reviewCount ? (f(), g("span", Xi, "(" + N(e.reviewCount) + ")", 1)) : S("", !0)
+          e.reviewCount ? (f(), g("span", Xi, "(" + J(e.reviewCount) + ")", 1)) : S("", !0)
         ], !0)
       ])
     ], 8, Yi));
   }
 });
-const Ln = /* @__PURE__ */ A(es, [["__scopeId", "data-v-c9a5e140"]]), ts = { class: "joy-screen-loader__content" }, ns = {
+const Ln = /* @__PURE__ */ L(es, [["__scopeId", "data-v-c9a5e140"]]), ts = { class: "joy-screen-loader__content" }, ns = {
   key: 0,
   class: "joy-screen-loader__content"
-}, as = /* @__PURE__ */ L({
+}, as = /* @__PURE__ */ T({
   __name: "VJoyScreenLoader",
   props: {
     /** Light or dark. Changes the spinner and background color */
@@ -4278,7 +4301,7 @@ const Ln = /* @__PURE__ */ A(es, [["__scopeId", "data-v-c9a5e140"]]), ts = { cla
     ], 2));
   }
 });
-const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id", "name", "aria-invalid", "required", "disabled"], ls = ["selected"], rs = /* @__PURE__ */ L({
+const Lt = /* @__PURE__ */ L(as, [["__scopeId", "data-v-1112514f"]]), os = ["id", "name", "aria-invalid", "required", "disabled"], ls = ["selected"], rs = /* @__PURE__ */ T({
   __name: "VJoySelect",
   props: {
     disabled: {
@@ -4322,7 +4345,7 @@ const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id"
   },
   emits: ["update:modelValue"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = ee(), r = E(() => {
+    const a = e, o = ee(), r = I(() => {
       const y = o.default();
       let m = [];
       return y.forEach((k) => {
@@ -4332,15 +4355,15 @@ const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id"
           const j = k.children;
           if (typeof j == "string" || !j.length)
             return;
-          const V = j.filter(l);
-          m = [...m, ...V];
+          const B = j.filter(l);
+          m = [...m, ...B];
         }
       }), m;
     });
     function l(y) {
       return (y == null ? void 0 : y.type) === "option";
     }
-    const i = x(), u = x(), v = x(!1), d = E(() => a.labelSize ? a.labelSize : a.size !== "medium" ? "small" : "medium");
+    const i = x(), u = x(), v = x(!1), d = I(() => a.labelSize ? a.labelSize : a.size !== "medium" ? "small" : "medium");
     se(() => {
       var k;
       const y = o["select-label"] && o["select-label"]();
@@ -4373,7 +4396,7 @@ const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id"
       ref: i
     }, [
       w(y.$slots, "select-label", {}, () => [
-        e.label ? (f(), B(Ce, {
+        e.label ? (f(), E(Ce, {
           key: 0,
           required: e.required && e.requiredMark,
           "optional-label": e.optionalLabel,
@@ -4381,7 +4404,7 @@ const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id"
           size: d.value
         }, {
           default: D(() => [
-            z(N(e.label), 1)
+            z(J(e.label), 1)
           ]),
           _: 1
         }, 8, ["required", "optional-label", "for", "size"])) : S("", !0)
@@ -4411,12 +4434,12 @@ const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id"
           onBlur: s
         }, [
           (f(!0), g(K, null, G(r.value, (k) => {
-            var j, V;
+            var j, B;
             return f(), g("option", ie({
               key: (j = k.props) == null ? void 0 : j.value
             }, k.props, {
-              selected: ((V = k.props) == null ? void 0 : V.value) === e.modelValue
-            }), N(k.children), 17, ls);
+              selected: ((B = k.props) == null ? void 0 : B.value) === e.modelValue
+            }), J(k.children), 17, ls);
           }), 128))
         ], 40, os),
         W(H, {
@@ -4427,7 +4450,7 @@ const Lt = /* @__PURE__ */ A(as, [["__scopeId", "data-v-1112514f"]]), os = ["id"
     ], 512));
   }
 });
-const is = /* @__PURE__ */ A(rs, [["__scopeId", "data-v-743c6829"]]), ss = ["aria-disabled"], us = ["id", "value", "checked", "disabled", "required", "name"], cs = /* @__PURE__ */ L({
+const is = /* @__PURE__ */ L(rs, [["__scopeId", "data-v-743c6829"]]), ss = ["aria-disabled"], us = ["id", "value", "checked", "disabled", "required", "name"], cs = /* @__PURE__ */ T({
   __name: "VJoySelectableItem",
   props: {
     disabled: {
@@ -4513,7 +4536,7 @@ const is = /* @__PURE__ */ A(rs, [["__scopeId", "data-v-743c6829"]]), ss = ["ari
         onBlur: d[2] || (d[2] = //@ts-ignore
         (...c) => i.onBlur && i.onBlur(...c))
       }, null, 40, us)),
-      (f(), B(ae($(l)), {
+      (f(), E(ae($(l)), {
         for: e.id,
         class: C([
           "joy-selectable-item",
@@ -4527,7 +4550,7 @@ const is = /* @__PURE__ */ A(rs, [["__scopeId", "data-v-743c6829"]]), ss = ["ari
         onClick: i.onLabelClick
       }, {
         default: D(() => [
-          e.multiple ? (f(), B($(It), {
+          e.multiple ? (f(), E($(It), {
             key: 0,
             id: e.id,
             checked: a.value,
@@ -4560,7 +4583,7 @@ const is = /* @__PURE__ */ A(rs, [["__scopeId", "data-v-743c6829"]]), ss = ["ari
     ], 10, ss));
   }
 });
-const En = /* @__PURE__ */ A(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"], fs = /* @__PURE__ */ L({
+const En = /* @__PURE__ */ L(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"], fs = /* @__PURE__ */ T({
   __name: "VJoySelectableItemGroup",
   props: {
     options: {
@@ -4615,7 +4638,7 @@ const En = /* @__PURE__ */ A(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"
       id: e.id,
       class: "joy-selectable-item-group__wrapper"
     }, [
-      e.label ? (f(), B($(Ce), {
+      e.label ? (f(), E($(Ce), {
         key: 0,
         "tag-name": "legend",
         required: e.required && e.requiredMark,
@@ -4623,7 +4646,7 @@ const En = /* @__PURE__ */ A(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"
         size: e.labelSize
       }, {
         default: D(() => [
-          z(N(e.label), 1)
+          z(J(e.label), 1)
         ]),
         _: 1
       }, 8, ["required", "optional-label", "size"])) : S("", !0),
@@ -4637,7 +4660,7 @@ const En = /* @__PURE__ */ A(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"
           }
         ])
       }, [
-        (f(!0), g(K, null, G(e.options, (i) => (f(), B($(En), {
+        (f(!0), g(K, null, G(e.options, (i) => (f(), E($(En), {
           id: i.id,
           key: i.id,
           name: i.name,
@@ -4648,14 +4671,14 @@ const En = /* @__PURE__ */ A(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"
           "onUpdate:checked": (u) => o(i.value, u)
         }, fn({
           default: D(() => [
-            z(N(i.label) + " ", 1)
+            z(J(i.label) + " ", 1)
           ]),
           _: 2
         }, [
           i.subLabel ? {
             name: "selectable-item-sublabel",
             fn: D(() => [
-              z(N(i.subLabel), 1)
+              z(J(i.subLabel), 1)
             ]),
             key: "0"
           } : void 0
@@ -4664,7 +4687,7 @@ const En = /* @__PURE__ */ A(cs, [["__scopeId", "data-v-cb2531c0"]]), ds = ["id"
     ], 8, ds));
   }
 });
-const ys = /* @__PURE__ */ A(fs, [["__scopeId", "data-v-b0fd1c74"]]), vs = /* @__PURE__ */ L({
+const ys = /* @__PURE__ */ L(fs, [["__scopeId", "data-v-b0fd1c74"]]), vs = /* @__PURE__ */ T({
   __name: "VJoySeparator",
   props: {
     /** Main text to apply in the central area */
@@ -4680,11 +4703,11 @@ const ys = /* @__PURE__ */ A(fs, [["__scopeId", "data-v-b0fd1c74"]]), vs = /* @_
     return (t, n) => (f(), g("div", {
       class: C(["joy-separator", { "joy-separator__small": e.size === "small" }])
     }, [
-      b("span", null, N(e.text), 1)
+      b("span", null, J(e.text), 1)
     ], 2));
   }
 });
-const ps = /* @__PURE__ */ A(vs, [["__scopeId", "data-v-21db2899"]]), ms = { class: "joy-snackbar__img" }, bs = { class: "joy-snackbar__content" }, gs = { key: 0 }, hs = ["innerHTML"], _s = /* @__PURE__ */ L({
+const ps = /* @__PURE__ */ L(vs, [["__scopeId", "data-v-21db2899"]]), ms = { class: "joy-snackbar__img" }, bs = { class: "joy-snackbar__content" }, gs = { key: 0 }, hs = ["innerHTML"], _s = /* @__PURE__ */ T({
   __name: "VJoySnackbar",
   props: {
     level: {
@@ -4732,7 +4755,7 @@ const ps = /* @__PURE__ */ A(vs, [["__scopeId", "data-v-21db2899"]]), ms = { cla
   setup(e, { expose: t }) {
     const n = e, a = x(!0);
     let o, r;
-    const l = "joy-snackbar-" + he(), i = E(() => pn(n.level));
+    const l = "joy-snackbar-" + he(), i = I(() => pn(n.level));
     function u() {
       var y;
       (y = n.bus) == null || y.emit("snackbar:action-click");
@@ -4777,15 +4800,15 @@ const ps = /* @__PURE__ */ A(vs, [["__scopeId", "data-v-21db2899"]]), ms = { cla
           W($(H), { name: i.value }, null, 8, ["name"])
         ]),
         b("div", bs, [
-          e.header ? (f(), g("strong", gs, N(e.header), 1)) : S("", !0),
+          e.header ? (f(), g("strong", gs, J(e.header), 1)) : S("", !0),
           b("span", { innerHTML: e.message }, null, 8, hs),
           e.actionText ? (f(), g("p", {
             key: 1,
             class: "joy-snackbar__trigger___action",
             onClick: u
-          }, N(e.actionText), 1)) : S("", !0)
+          }, J(e.actionText), 1)) : S("", !0)
         ]),
-        e.closable ? (f(), B($(de), {
+        e.closable ? (f(), E($(de), {
           key: 0,
           class: "joy-snackbar__close-icon",
           circle: "",
@@ -4798,7 +4821,7 @@ const ps = /* @__PURE__ */ A(vs, [["__scopeId", "data-v-21db2899"]]), ms = { cla
     ], 2));
   }
 });
-const An = /* @__PURE__ */ A(_s, [["__scopeId", "data-v-5b417f26"]]), ws = ["id"], Ss = { class: "joy-step__stroke" }, ks = { class: "joy-step__label" }, xs = /* @__PURE__ */ L({
+const Bn = /* @__PURE__ */ L(_s, [["__scopeId", "data-v-5b417f26"]]), ws = ["id"], Ss = { class: "joy-step__stroke" }, ks = { class: "joy-step__label" }, xs = /* @__PURE__ */ T({
   __name: "VJoyStep",
   props: {
     completed: {
@@ -4824,7 +4847,7 @@ const An = /* @__PURE__ */ A(_s, [["__scopeId", "data-v-5b417f26"]]), ws = ["id"
   },
   emits: ["update:subSteps"],
   setup(e, { expose: t, emit: n }) {
-    const a = e, o = x(0.1), r = E(() => a.completed ? "100%" : l.value ? a.subSteps <= 1 || a.currentSubStep === 1 ? "10%" : (Math.min(a.currentSubStep / a.subSteps - o.value, 1 - o.value) * 100).toFixed(1) + "%" : "0%"), l = E(() => a.currentSubStep > 0);
+    const a = e, o = x(0.1), r = I(() => a.completed ? "100%" : l.value ? a.subSteps <= 1 || a.currentSubStep === 1 ? "10%" : (Math.min(a.currentSubStep / a.subSteps - o.value, 1 - o.value) * 100).toFixed(1) + "%" : "0%"), l = I(() => a.currentSubStep > 0);
     function i(u) {
       u <= 0 && console.warn("subSteps must be equal or greater than 1"), n("update:subSteps");
     }
@@ -4853,7 +4876,7 @@ const An = /* @__PURE__ */ A(_s, [["__scopeId", "data-v-5b417f26"]]), ws = ["id"
     ], 10, ws));
   }
 });
-const Bn = /* @__PURE__ */ A(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { class: "joy-stepper" }, js = /* @__PURE__ */ L({
+const An = /* @__PURE__ */ L(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { class: "joy-stepper" }, js = /* @__PURE__ */ T({
   __name: "VJoyStepper",
   props: {
     step: {
@@ -4866,7 +4889,7 @@ const Bn = /* @__PURE__ */ A(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { cla
     }
   },
   setup(e, { expose: t }) {
-    const n = e, a = ee(), o = E(() => {
+    const n = e, a = ee(), o = I(() => {
       const d = a.default();
       return d.length === 1 && typeof d[0].type != "object" ? d[0].children.filter(r) : d.filter(r);
     });
@@ -4874,7 +4897,7 @@ const Bn = /* @__PURE__ */ A(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { cla
       var c;
       return ((c = d == null ? void 0 : d.type) == null ? void 0 : c.__name) === "VJoyStep";
     }
-    const l = E(() => o.value[n.step - 1]), i = E(() => !u.value && !l.value.props ? !1 : n.subStep <= 0 || n.subStep > l.value.props["sub-steps"]), u = E(() => i.value ? l.value.props["sub-steps"] : n.subStep);
+    const l = I(() => o.value[n.step - 1]), i = I(() => !u.value && !l.value.props ? !1 : n.subStep <= 0 || n.subStep > l.value.props["sub-steps"]), u = I(() => i.value ? l.value.props["sub-steps"] : n.subStep);
     function v(d) {
       return d !== n.step - 1 ? 0 : u.value;
     }
@@ -4885,7 +4908,7 @@ const Bn = /* @__PURE__ */ A(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { cla
     }), (d, c) => (f(), g("div", Cs, [
       (f(!0), g(K, null, G(o.value, (p, s) => {
         var y;
-        return f(), B($(Bn), ie(p.props, {
+        return f(), E($(An), ie(p.props, {
           key: (y = p.props) == null ? void 0 : y.id,
           completed: s < e.step - 1,
           "current-sub-step": v(s)
@@ -4893,7 +4916,7 @@ const Bn = /* @__PURE__ */ A(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { cla
           default: D(() => {
             var m;
             return [
-              (m = p.children) != null && m.default ? (f(), B(ae(p.children.default), { key: 0 })) : S("", !0)
+              (m = p.children) != null && m.default ? (f(), E(ae(p.children.default), { key: 0 })) : S("", !0)
             ];
           }),
           _: 2
@@ -4902,7 +4925,7 @@ const Bn = /* @__PURE__ */ A(xs, [["__scopeId", "data-v-7b9e5926"]]), Cs = { cla
     ]));
   }
 });
-const $s = /* @__PURE__ */ A(js, [["__scopeId", "data-v-c80ba82b"]]), Vs = ["id", "aria-hidden", "aria-labelledby"], Ts = /* @__PURE__ */ L({
+const $s = /* @__PURE__ */ L(js, [["__scopeId", "data-v-c80ba82b"]]), Vs = ["id", "aria-hidden", "aria-labelledby"], Ts = /* @__PURE__ */ T({
   __name: "VJoyTab",
   props: {
     /**
@@ -4929,7 +4952,7 @@ const $s = /* @__PURE__ */ A(js, [["__scopeId", "data-v-c80ba82b"]]), Vs = ["id"
     }
   },
   setup(e) {
-    const t = e, n = lt("VJoyTabs", x("")), a = E(() => n.value === t.tab);
+    const t = e, n = lt("VJoyTabs", x("")), a = I(() => n.value === t.tab);
     return (o, r) => (f(), g("div", {
       id: `joy-tab-${e.tab}`,
       role: "tabpanel",
@@ -4944,10 +4967,10 @@ const $s = /* @__PURE__ */ A(js, [["__scopeId", "data-v-c80ba82b"]]), Vs = ["id"
     ], 10, Vs));
   }
 });
-const Is = /* @__PURE__ */ A(Ts, [["__scopeId", "data-v-47a75127"]]), Ls = ["id", "href", "aria-selected", "aria-controls"], Es = {
+const Is = /* @__PURE__ */ L(Ts, [["__scopeId", "data-v-47a75127"]]), Ls = ["id", "href", "aria-selected", "aria-controls"], Es = {
   type: "button",
   tabindex: "-1"
-}, As = /* @__PURE__ */ L({
+}, Bs = /* @__PURE__ */ T({
   __name: "TabButton",
   props: {
     /**
@@ -5007,7 +5030,7 @@ const Is = /* @__PURE__ */ A(Ts, [["__scopeId", "data-v-47a75127"]]), Ls = ["id"
         b("button", Es, [
           b("div", null, [
             w(o.$slots, "default", {}, () => [
-              z(N(e.label), 1)
+              z(J(e.label), 1)
             ], !0)
           ])
         ])
@@ -5015,7 +5038,7 @@ const Is = /* @__PURE__ */ A(Ts, [["__scopeId", "data-v-47a75127"]]), Ls = ["id"
     ], 40, Ls));
   }
 });
-const Bs = /* @__PURE__ */ A(As, [["__scopeId", "data-v-437a6e09"]]), Os = { class: "joy-tabs" }, Ns = /* @__PURE__ */ L({
+const As = /* @__PURE__ */ L(Bs, [["__scopeId", "data-v-437a6e09"]]), Os = { class: "joy-tabs" }, Ns = /* @__PURE__ */ T({
   __name: "VJoyTabs",
   props: {
     /** Use this prop to activate a specific tab by default by giving its name */
@@ -5027,7 +5050,7 @@ const Bs = /* @__PURE__ */ A(As, [["__scopeId", "data-v-437a6e09"]]), Os = { cla
   setup(e, { expose: t, emit: n }) {
     const a = e, o = ee(), r = x(a.selectedTab);
     xt("VJoyTabs", r);
-    const l = x(null), i = x(null), u = x(!1), v = x(!1), d = E(() => {
+    const l = x(null), i = x(null), u = x(!1), v = x(!1), d = I(() => {
       const m = o.default();
       return m.length === 1 && typeof m[0].type != "object" ? m[0].children.filter(c) : m.filter(c);
     });
@@ -5077,17 +5100,17 @@ const Bs = /* @__PURE__ */ A(As, [["__scopeId", "data-v-437a6e09"]]), Os = { cla
           (f(!0), g(K, null, G(d.value, (j) => (f(), g("div", {
             key: j.props.tab
           }, [
-            W(Bs, {
+            W(As, {
               tab: j.props.tab,
               label: j.props.label,
               href: j.props.href,
               selected: p(j),
-              onChangeTab: (V) => y(j.props.tab, !j.props.href)
+              onChangeTab: (B) => y(j.props.tab, !j.props.href)
             }, {
               default: D(() => {
-                var V;
+                var B;
                 return [
-                  (V = j.children) != null && V.header ? (f(), B(ae(j.children.header), { key: 0 })) : S("", !0)
+                  (B = j.children) != null && B.header ? (f(), E(ae(j.children.header), { key: 0 })) : S("", !0)
                 ];
               }),
               _: 2
@@ -5101,7 +5124,7 @@ const Bs = /* @__PURE__ */ A(As, [["__scopeId", "data-v-437a6e09"]]), Os = { cla
     ]));
   }
 });
-const Js = /* @__PURE__ */ A(Ns, [["__scopeId", "data-v-b70db3b8"]]), Fs = ["id", "role"], Ps = /* @__PURE__ */ L({
+const Js = /* @__PURE__ */ L(Ns, [["__scopeId", "data-v-b70db3b8"]]), Fs = ["id", "role"], Ps = /* @__PURE__ */ T({
   __name: "VJoyTag",
   props: {
     /** Text injected within the tag */
@@ -5140,7 +5163,7 @@ const Js = /* @__PURE__ */ A(Ns, [["__scopeId", "data-v-b70db3b8"]]), Fs = ["id"
   },
   emits: ["selected", "remove", "click"],
   setup(e, { emit: t }) {
-    const n = e, a = ["primary", "secondary"], o = E(() => ({
+    const n = e, a = ["primary", "secondary"], o = I(() => ({
       "joy-tag": !0,
       "joy-tag__selected": n.selected,
       "joy-tag__selectable": n.selectable || n.link,
@@ -5160,14 +5183,14 @@ const Js = /* @__PURE__ */ A(Ns, [["__scopeId", "data-v-b70db3b8"]]), Fs = ["id"
       role: e.link || e.selectable ? "button" : void 0,
       onClick: l
     }, [
-      e.draggable ? (f(), B(H, {
+      e.draggable ? (f(), E(H, {
         key: 0,
         class: "joy-tag__drag",
         name: "drag",
         size: "xxsmall"
       })) : S("", !0),
-      z(" " + N(e.label) + " ", 1),
-      e.removable ? (f(), B(H, {
+      z(" " + J(e.label) + " ", 1),
+      e.removable ? (f(), E(H, {
         key: 1,
         class: "joy-tag__removable",
         name: "cross",
@@ -5177,7 +5200,7 @@ const Js = /* @__PURE__ */ A(Ns, [["__scopeId", "data-v-b70db3b8"]]), Fs = ["id"
     ], 10, Fs));
   }
 });
-const On = /* @__PURE__ */ A(Ps, [["__scopeId", "data-v-9770b43b"]]), Rs = /* @__PURE__ */ L({
+const On = /* @__PURE__ */ L(Ps, [["__scopeId", "data-v-9770b43b"]]), Rs = /* @__PURE__ */ T({
   __name: "VJoyTagsList",
   props: {
     align: {
@@ -5233,7 +5256,7 @@ const On = /* @__PURE__ */ A(Ps, [["__scopeId", "data-v-9770b43b"]]), Rs = /* @_
     return (u, v) => (f(), g("div", {
       class: C(["joy-tags-list", `joy-tags-list--${e.align}`])
     }, [
-      (f(!0), g(K, null, G(e.tags, (d) => (f(), B(On, ie({
+      (f(!0), g(K, null, G(e.tags, (d) => (f(), E(On, ie({
         key: d.value || d.label
       }, d, {
         selectable: o(d),
@@ -5246,7 +5269,7 @@ const On = /* @__PURE__ */ A(Ps, [["__scopeId", "data-v-9770b43b"]]), Rs = /* @_
     ], 2));
   }
 });
-const Ds = /* @__PURE__ */ A(Rs, [["__scopeId", "data-v-5be625a7"]]);
+const Ds = /* @__PURE__ */ L(Rs, [["__scopeId", "data-v-5be625a7"]]);
 const Ms = {}, zs = {
   class: /* @__PURE__ */ C(["joy-template-shape__shapes"])
 }, qs = /* @__PURE__ */ yn('<div class="shapes__wrapper" data-v-8b258f92><div class="shape_1" data-v-8b258f92></div><div class="shape_2" data-v-8b258f92></div><div class="shape_3" data-v-8b258f92></div><div class="shape_4" data-v-8b258f92></div></div>', 1), Hs = [
@@ -5255,7 +5278,7 @@ const Ms = {}, zs = {
 function Ws(e, t) {
   return f(), g("div", zs, Hs);
 }
-const Nn = /* @__PURE__ */ A(Ms, [["render", Ws], ["__scopeId", "data-v-8b258f92"]]), Us = { class: "joy-template__wrapper" }, Ks = {
+const Nn = /* @__PURE__ */ L(Ms, [["render", Ws], ["__scopeId", "data-v-8b258f92"]]), Us = { class: "joy-template__wrapper" }, Ks = {
   key: 0,
   class: "joy-template__heading"
 }, Gs = {
@@ -5276,7 +5299,7 @@ const Nn = /* @__PURE__ */ A(Ms, [["render", Ws], ["__scopeId", "data-v-8b258f92
 }, tu = {
   key: 1,
   class: "joy-template-slot-sidebar"
-}, nu = /* @__PURE__ */ L({
+}, nu = /* @__PURE__ */ T({
   __name: "VJoyTemplate",
   props: {
     full: { type: Boolean, default: !1 },
@@ -5295,11 +5318,11 @@ const Nn = /* @__PURE__ */ A(Ms, [["render", Ws], ["__scopeId", "data-v-8b258f92
     }
   },
   setup(e) {
-    const t = e, n = ee(), a = E(() => !!n["template-back"] || !!n["template-title"] || !!n["template-subtitle"] || !!n["template-actions"]);
+    const t = e, n = ee(), a = I(() => !!n["template-back"] || !!n["template-title"] || !!n["template-subtitle"] || !!n["template-actions"]);
     return (o, r) => (f(), g("main", {
       class: C(["joy-template", { "joy-template--full": e.full, "joy-template--loading": e.loading }])
     }, [
-      e.shapes ? (f(), B(Nn, { key: 0 })) : S("", !0),
+      e.shapes ? (f(), E(Nn, { key: 0 })) : S("", !0),
       b("div", Us, [
         a.value ? (f(), g("div", Ks, [
           $(n)["template-back"] ? (f(), g("div", Gs, [
@@ -5333,7 +5356,7 @@ const Nn = /* @__PURE__ */ A(Ms, [["render", Ws], ["__scopeId", "data-v-8b258f92
           ])) : S("", !0)
         ], 2)
       ]),
-      e.loading ? (f(), B(Lt, {
+      e.loading ? (f(), E(Lt, {
         key: 1,
         overlay: "",
         color: e.loadingColor
@@ -5346,7 +5369,7 @@ const Nn = /* @__PURE__ */ A(Ms, [["render", Ws], ["__scopeId", "data-v-8b258f92
     ], 2));
   }
 });
-const au = /* @__PURE__ */ A(nu, [["__scopeId", "data-v-7c83eb21"]]), ou = /* @__PURE__ */ L({
+const au = /* @__PURE__ */ L(nu, [["__scopeId", "data-v-7c83eb21"]]), ou = /* @__PURE__ */ T({
   __name: "VJoyText",
   props: {
     /** Defines the tag name of the Node you want to create. By default it's a simple P tag. Lowercase only */
@@ -5361,7 +5384,7 @@ const au = /* @__PURE__ */ A(nu, [["__scopeId", "data-v-7c83eb21"]]), ou = /* @_
     }
   },
   setup(e) {
-    return (t, n) => (f(), B(ae(e.tagName), {
+    return (t, n) => (f(), E(ae(e.tagName), {
       class: C(`joy-text joy-font-${e.preset}`)
     }, {
       default: D(() => [
@@ -5371,12 +5394,12 @@ const au = /* @__PURE__ */ A(nu, [["__scopeId", "data-v-7c83eb21"]]), ou = /* @_
     }, 8, ["class"]));
   }
 });
-const lu = /* @__PURE__ */ A(ou, [["__scopeId", "data-v-1af4e700"]]), ru = ["aria-disabled"], iu = { class: "joy-textarea_wrapper" }, su = ["id", "disabled", "name", "required", "minlength", "value"], uu = {
+const lu = /* @__PURE__ */ L(ou, [["__scopeId", "data-v-1af4e700"]]), ru = ["aria-disabled"], iu = { class: "joy-textarea_wrapper" }, su = ["id", "disabled", "name", "required", "minlength", "value"], uu = {
   key: 0,
   class: "joy-textarea_helpers"
 }, cu = {
   inheritAttrs: !1
-}, du = /* @__PURE__ */ L({
+}, du = /* @__PURE__ */ T({
   ...cu,
   __name: "VJoyTextarea",
   props: {
@@ -5433,7 +5456,7 @@ const lu = /* @__PURE__ */ A(ou, [["__scopeId", "data-v-1af4e700"]]), ru = ["ari
   setup(e, { expose: t, emit: n }) {
     const a = e, o = x(), { triggerResize: r } = co({
       element: a.autogrow ? o : void 0
-    }), l = x(!1), i = x(!1), u = E(() => a.maxlength ? a.modelValue.length > a.maxlength : !1), v = E(() => a.minlength ? a.modelValue.length < a.minlength : !1), d = {
+    }), l = x(!1), i = x(!1), u = I(() => a.maxlength ? a.modelValue.length > a.maxlength : !1), v = I(() => a.minlength ? a.modelValue.length < a.minlength : !1), d = {
       onInput: (c) => {
         a.modelModifiers.lazy || n("update:modelValue", c.target.value), r();
       },
@@ -5471,7 +5494,7 @@ const lu = /* @__PURE__ */ A(ou, [["__scopeId", "data-v-1af4e700"]]), ru = ["ari
       }, {
         default: D(() => [
           w(c.$slots, "default", {}, () => [
-            z(N(e.label), 1)
+            z(J(e.label), 1)
           ], !0)
         ]),
         _: 3
@@ -5502,23 +5525,23 @@ const lu = /* @__PURE__ */ A(ou, [["__scopeId", "data-v-1af4e700"]]), ru = ["ari
           key: 0,
           class: C(["joy-textarea-min", { "joy-textarea-min-invalid": e.invalid }])
         }, [
-          v.value ? S("", !0) : (f(), B(H, {
+          v.value ? S("", !0) : (f(), E(H, {
             key: 0,
             name: "check",
             color: "neutral",
             size: "xxsmall"
           })),
-          z(" " + N(e.minlengthLabel || `Minimum ${e.minlength} characters`), 1)
+          z(" " + J(e.minlengthLabel || `Minimum ${e.minlength} characters`), 1)
         ], 2)) : S("", !0),
         e.maxlength ? (f(), g("p", {
           key: 1,
           class: C(["joy-textarea-count", { "joy-textarea-count-invalid": u.value }])
-        }, N(e.modelValue.length + "/" + e.maxlength), 3)) : S("", !0)
+        }, J(e.modelValue.length + "/" + e.maxlength), 3)) : S("", !0)
       ])) : S("", !0)
     ], 10, ru));
   }
 });
-const fu = /* @__PURE__ */ A(du, [["__scopeId", "data-v-de43ee01"]]), Jn = (e) => (et("data-v-cf79d999"), e = e(), tt(), e), yu = { class: "joy-toggle__wrapper" }, vu = ["name", "disabled", "checked", "required", "aria-checked", "value"], pu = { class: "joy-toggle__content" }, mu = /* @__PURE__ */ Jn(() => /* @__PURE__ */ b("span", { class: "joy-toggle__symbol" }, null, -1)), bu = { class: "joy-toggle__content-label" }, gu = /* @__PURE__ */ Jn(() => /* @__PURE__ */ b("span", { class: "joy-toggle__smile" }, [
+const fu = /* @__PURE__ */ L(du, [["__scopeId", "data-v-de43ee01"]]), Jn = (e) => (et("data-v-cf79d999"), e = e(), tt(), e), yu = { class: "joy-toggle__wrapper" }, vu = ["name", "disabled", "checked", "required", "aria-checked", "value"], pu = { class: "joy-toggle__content" }, mu = /* @__PURE__ */ Jn(() => /* @__PURE__ */ b("span", { class: "joy-toggle__symbol" }, null, -1)), bu = { class: "joy-toggle__content-label" }, gu = /* @__PURE__ */ Jn(() => /* @__PURE__ */ b("span", { class: "joy-toggle__smile" }, [
   /* @__PURE__ */ b("svg", {
     width: "18",
     height: "10",
@@ -5531,7 +5554,7 @@ const fu = /* @__PURE__ */ A(du, [["__scopeId", "data-v-de43ee01"]]), Jn = (e) =
       fill: "currentColor"
     })
   ])
-], -1)), hu = /* @__PURE__ */ L({
+], -1)), hu = /* @__PURE__ */ T({
   __name: "VJoyToggle",
   props: {
     modelValue: {
@@ -5610,7 +5633,7 @@ const fu = /* @__PURE__ */ A(du, [["__scopeId", "data-v-de43ee01"]]), Jn = (e) =
           mu,
           b("span", bu, [
             w(o.$slots, "default", {}, () => [
-              z(N(e.label), 1)
+              z(J(e.label), 1)
             ], !0)
           ]),
           gu
@@ -5619,7 +5642,7 @@ const fu = /* @__PURE__ */ A(du, [["__scopeId", "data-v-de43ee01"]]), Jn = (e) =
     ]));
   }
 });
-const _u = /* @__PURE__ */ A(hu, [["__scopeId", "data-v-cf79d999"]]), Pe = Math.min, Te = Math.max, Ze = Math.round, me = (e) => ({
+const _u = /* @__PURE__ */ L(hu, [["__scopeId", "data-v-cf79d999"]]), Pe = Math.min, Te = Math.max, Ze = Math.round, me = (e) => ({
   x: e,
   y: e
 }), wu = {
@@ -5646,18 +5669,18 @@ function De(e) {
 function Et(e) {
   return e === "x" ? "y" : "x";
 }
-function At(e) {
+function Bt(e) {
   return e === "y" ? "height" : "width";
 }
 function Me(e) {
   return ["top", "bottom"].includes(be(e)) ? "y" : "x";
 }
-function Bt(e) {
+function At(e) {
   return Et(Me(e));
 }
 function ku(e, t, n) {
   n === void 0 && (n = !1);
-  const a = De(e), o = Bt(e), r = At(o);
+  const a = De(e), o = At(e), r = Bt(o);
   let l = o === "x" ? a === (n ? "end" : "start") ? "right" : "left" : a === "start" ? "bottom" : "top";
   return t.reference[r] > t.floating[r] && (l = Qe(l)), [l, Qe(l)];
 }
@@ -5720,7 +5743,7 @@ function ln(e, t, n) {
     reference: a,
     floating: o
   } = e;
-  const r = Me(t), l = Bt(t), i = At(l), u = be(t), v = r === "y", d = a.x + a.width / 2 - o.width / 2, c = a.y + a.height / 2 - o.height / 2, p = a[i] / 2 - o[i] / 2;
+  const r = Me(t), l = At(t), i = Bt(l), u = be(t), v = r === "y", d = a.x + a.width / 2 - o.width / 2, c = a.y + a.height / 2 - o.height / 2, p = a[i] / 2 - o[i] / 2;
   let s;
   switch (u) {
     case "top":
@@ -5783,10 +5806,10 @@ const Vu = async (e, t, n) => {
       name: k,
       fn: j
     } = i[m], {
-      x: V,
-      y: T,
-      data: J,
-      reset: O
+      x: B,
+      y: N,
+      data: O,
+      reset: A
     } = await j({
       x: d,
       y: c,
@@ -5801,18 +5824,18 @@ const Vu = async (e, t, n) => {
         floating: t
       }
     });
-    if (d = V ?? d, c = T ?? c, s = {
+    if (d = B ?? d, c = N ?? c, s = {
       ...s,
       [k]: {
         ...s[k],
-        ...J
+        ...O
       }
-    }, O && y <= 50) {
-      y++, typeof O == "object" && (O.placement && (p = O.placement), O.rects && (v = O.rects === !0 ? await l.getElementRects({
+    }, A && y <= 50) {
+      y++, typeof A == "object" && (A.placement && (p = A.placement), A.rects && (v = A.rects === !0 ? await l.getElementRects({
         reference: e,
         floating: t,
         strategy: o
-      }) : O.rects), {
+      }) : A.rects), {
         x: d,
         y: c
       } = ln(v, p, u)), m = -1;
@@ -5848,26 +5871,26 @@ async function Pn(e, t) {
     boundary: v,
     rootBoundary: d,
     strategy: u
-  })), V = c === "floating" ? {
+  })), B = c === "floating" ? {
     ...l.floating,
     x: a,
     y: o
-  } : l.reference, T = await (r.getOffsetParent == null ? void 0 : r.getOffsetParent(i.floating)), J = await (r.isElement == null ? void 0 : r.isElement(T)) ? await (r.getScale == null ? void 0 : r.getScale(T)) || {
+  } : l.reference, N = await (r.getOffsetParent == null ? void 0 : r.getOffsetParent(i.floating)), O = await (r.isElement == null ? void 0 : r.isElement(N)) ? await (r.getScale == null ? void 0 : r.getScale(N)) || {
     x: 1,
     y: 1
   } : {
     x: 1,
     y: 1
-  }, O = Xe(r.convertOffsetParentRelativeRectToViewportRelativeRect ? await r.convertOffsetParentRelativeRectToViewportRelativeRect({
-    rect: V,
-    offsetParent: T,
+  }, A = Xe(r.convertOffsetParentRelativeRectToViewportRelativeRect ? await r.convertOffsetParentRelativeRectToViewportRelativeRect({
+    rect: B,
+    offsetParent: N,
     strategy: u
-  }) : V);
+  }) : B);
   return {
-    top: (j.top - O.top + y.top) / J.y,
-    bottom: (O.bottom - j.bottom + y.bottom) / J.y,
-    left: (j.left - O.left + y.left) / J.x,
-    right: (O.right - j.right + y.right) / J.x
+    top: (j.top - A.top + y.top) / O.y,
+    bottom: (A.bottom - j.bottom + y.bottom) / O.y,
+    left: (j.left - A.left + y.left) / O.x,
+    right: (A.right - j.right + y.right) / O.x
   };
 }
 const Tu = (e) => ({
@@ -5891,15 +5914,15 @@ const Tu = (e) => ({
     const c = Fn(d), p = {
       x: n,
       y: a
-    }, s = Bt(o), y = At(s), m = await l.getDimensions(v), k = s === "y", j = k ? "top" : "left", V = k ? "bottom" : "right", T = k ? "clientHeight" : "clientWidth", J = r.reference[y] + r.reference[s] - p[s] - r.floating[y], O = p[s] - r.reference[s], Z = await (l.getOffsetParent == null ? void 0 : l.getOffsetParent(v));
-    let R = Z ? Z[T] : 0;
-    (!R || !await (l.isElement == null ? void 0 : l.isElement(Z))) && (R = i.floating[T] || r.floating[y]);
-    const oe = J / 2 - O / 2, le = R / 2 - m[y] / 2 - 1, ue = Pe(c[j], le), q = Pe(c[V], le), h = ue, _ = R - m[y] - q, I = R / 2 - m[y] / 2 + oe, F = pt(h, I, _), P = !u.arrow && De(o) != null && I != F && r.reference[y] / 2 - (I < h ? ue : q) - m[y] / 2 < 0, M = P ? I < h ? I - h : I - _ : 0;
+    }, s = At(o), y = Bt(s), m = await l.getDimensions(v), k = s === "y", j = k ? "top" : "left", B = k ? "bottom" : "right", N = k ? "clientHeight" : "clientWidth", O = r.reference[y] + r.reference[s] - p[s] - r.floating[y], A = p[s] - r.reference[s], Z = await (l.getOffsetParent == null ? void 0 : l.getOffsetParent(v));
+    let R = Z ? Z[N] : 0;
+    (!R || !await (l.isElement == null ? void 0 : l.isElement(Z))) && (R = i.floating[N] || r.floating[y]);
+    const oe = O / 2 - A / 2, le = R / 2 - m[y] / 2 - 1, ue = Pe(c[j], le), q = Pe(c[B], le), h = ue, _ = R - m[y] - q, V = R / 2 - m[y] / 2 + oe, F = pt(h, V, _), P = !u.arrow && De(o) != null && V != F && r.reference[y] / 2 - (V < h ? ue : q) - m[y] / 2 < 0, M = P ? V < h ? V - h : V - _ : 0;
     return {
       [s]: p[s] + M,
       data: {
         [s]: F,
-        centerOffset: I - F - M,
+        centerOffset: V - F - M,
         ...P && {
           alignmentOffset: M
         }
@@ -5931,12 +5954,12 @@ const Tu = (e) => ({
       } = xe(e, t);
       if ((n = r.arrow) != null && n.alignmentOffset)
         return {};
-      const j = be(o), V = be(i) === i, T = await (u.isRTL == null ? void 0 : u.isRTL(v.floating)), J = p || (V || !m ? [Qe(i)] : xu(i));
-      !p && y !== "none" && J.push(...ju(i, m, y, T));
-      const O = [i, ...J], Z = await Pn(t, k), R = [];
+      const j = be(o), B = be(i) === i, N = await (u.isRTL == null ? void 0 : u.isRTL(v.floating)), O = p || (B || !m ? [Qe(i)] : xu(i));
+      !p && y !== "none" && O.push(...ju(i, m, y, N));
+      const A = [i, ...O], Z = await Pn(t, k), R = [];
       let oe = ((a = r.flip) == null ? void 0 : a.overflows) || [];
       if (d && R.push(Z[j]), c) {
-        const h = ku(o, l, T);
+        const h = ku(o, l, N);
         R.push(Z[h[0]], Z[h[1]]);
       }
       if (oe = [...oe, {
@@ -5944,7 +5967,7 @@ const Tu = (e) => ({
         overflows: R
       }], !R.every((h) => h <= 0)) {
         var le, ue;
-        const h = (((le = r.flip) == null ? void 0 : le.index) || 0) + 1, _ = O[h];
+        const h = (((le = r.flip) == null ? void 0 : le.index) || 0) + 1, _ = A[h];
         if (_)
           return {
             data: {
@@ -5955,23 +5978,23 @@ const Tu = (e) => ({
               placement: _
             }
           };
-        let I = (ue = oe.filter((F) => F.overflows[0] <= 0).sort((F, P) => F.overflows[1] - P.overflows[1])[0]) == null ? void 0 : ue.placement;
-        if (!I)
+        let V = (ue = oe.filter((F) => F.overflows[0] <= 0).sort((F, P) => F.overflows[1] - P.overflows[1])[0]) == null ? void 0 : ue.placement;
+        if (!V)
           switch (s) {
             case "bestFit": {
               var q;
               const F = (q = oe.map((P) => [P.placement, P.overflows.filter((M) => M > 0).reduce((M, U) => M + U, 0)]).sort((P, M) => P[1] - M[1])[0]) == null ? void 0 : q[0];
-              F && (I = F);
+              F && (V = F);
               break;
             }
             case "initialPlacement":
-              I = i;
+              V = i;
               break;
           }
-        if (o !== I)
+        if (o !== V)
           return {
             reset: {
-              placement: I
+              placement: V
             }
           };
       }
@@ -6023,7 +6046,7 @@ const Eu = function(e) {
       };
     }
   };
-}, Au = function(e) {
+}, Bu = function(e) {
   return e === void 0 && (e = {}), {
     name: "shift",
     options: e,
@@ -6039,11 +6062,11 @@ const Eu = function(e) {
           fn: (k) => {
             let {
               x: j,
-              y: V
+              y: B
             } = k;
             return {
               x: j,
-              y: V
+              y: B
             };
           }
         },
@@ -6054,12 +6077,12 @@ const Eu = function(e) {
       }, d = await Pn(t, u), c = Me(be(o)), p = Et(c);
       let s = v[p], y = v[c];
       if (r) {
-        const k = p === "y" ? "top" : "left", j = p === "y" ? "bottom" : "right", V = s + d[k], T = s - d[j];
-        s = pt(V, s, T);
+        const k = p === "y" ? "top" : "left", j = p === "y" ? "bottom" : "right", B = s + d[k], N = s - d[j];
+        s = pt(B, s, N);
       }
       if (l) {
-        const k = c === "y" ? "top" : "left", j = c === "y" ? "bottom" : "right", V = y + d[k], T = y - d[j];
-        y = pt(V, y, T);
+        const k = c === "y" ? "top" : "left", j = c === "y" ? "bottom" : "right", B = y + d[k], N = y - d[j];
+        y = pt(B, y, N);
       }
       const m = i.fn({
         ...t,
@@ -6075,7 +6098,7 @@ const Eu = function(e) {
       };
     }
   };
-}, Bu = function(e) {
+}, Au = function(e) {
   return e === void 0 && (e = {}), {
     options: e,
     fn(t) {
@@ -6103,13 +6126,13 @@ const Eu = function(e) {
         ...m
       };
       if (u) {
-        const T = p === "y" ? "height" : "width", J = r.reference[p] - r.floating[T] + k.mainAxis, O = r.reference[p] + r.reference[T] - k.mainAxis;
-        s < J ? s = J : s > O && (s = O);
+        const N = p === "y" ? "height" : "width", O = r.reference[p] - r.floating[N] + k.mainAxis, A = r.reference[p] + r.reference[N] - k.mainAxis;
+        s < O ? s = O : s > A && (s = A);
       }
       if (v) {
-        var j, V;
-        const T = p === "y" ? "width" : "height", J = ["top", "left"].includes(be(o)), O = r.reference[c] - r.floating[T] + (J && ((j = l.offset) == null ? void 0 : j[c]) || 0) + (J ? 0 : k.crossAxis), Z = r.reference[c] + r.reference[T] + (J ? 0 : ((V = l.offset) == null ? void 0 : V[c]) || 0) - (J ? k.crossAxis : 0);
-        y < O ? y = O : y > Z && (y = Z);
+        var j, B;
+        const N = p === "y" ? "width" : "height", O = ["top", "left"].includes(be(o)), A = r.reference[c] - r.floating[N] + (O && ((j = l.offset) == null ? void 0 : j[c]) || 0) + (O ? 0 : k.crossAxis), Z = r.reference[c] + r.reference[N] + (O ? 0 : ((B = l.offset) == null ? void 0 : B[c]) || 0) - (O ? k.crossAxis : 0);
+        y < A ? y = A : y > Z && (y = Z);
       }
       return {
         [p]: s,
@@ -6158,11 +6181,11 @@ function Ot(e) {
   return n.transform !== "none" || n.perspective !== "none" || (n.containerType ? n.containerType !== "normal" : !1) || !t && (n.backdropFilter ? n.backdropFilter !== "none" : !1) || !t && (n.filter ? n.filter !== "none" : !1) || ["transform", "perspective", "filter"].some((a) => (n.willChange || "").includes(a)) || ["paint", "layout", "strict", "content"].some((a) => (n.contain || "").includes(a));
 }
 function Nu(e) {
-  let t = Ae(e);
+  let t = Be(e);
   for (; ye(t) && !it(t); ) {
     if (Ot(t))
       return t;
-    t = Ae(t);
+    t = Be(t);
   }
   return null;
 }
@@ -6184,7 +6207,7 @@ function st(e) {
     scrollTop: e.pageYOffset
   };
 }
-function Ae(e) {
+function Be(e) {
   if (ge(e) === "html")
     return e;
   const t = (
@@ -6197,7 +6220,7 @@ function Ae(e) {
   return rn(t) ? t.host : t;
 }
 function Dn(e) {
-  const t = Ae(e);
+  const t = Be(e);
   return it(t) ? e.ownerDocument ? e.ownerDocument.body : e.body : ye(t) && ze(t) ? t : Dn(t);
 }
 function bt(e, t, n) {
@@ -6256,8 +6279,8 @@ function Re(e, t, n, a) {
     const p = ne(r), s = a && ve(a) ? ne(a) : a;
     let y = p.frameElement;
     for (; y && a && s !== p; ) {
-      const m = Ie(y), k = y.getBoundingClientRect(), j = re(y), V = k.left + (y.clientLeft + parseFloat(j.paddingLeft)) * m.x, T = k.top + (y.clientTop + parseFloat(j.paddingTop)) * m.y;
-      u *= m.x, v *= m.y, d *= m.x, c *= m.y, u += V, v += T, y = ne(y).frameElement;
+      const m = Ie(y), k = y.getBoundingClientRect(), j = re(y), B = k.left + (y.clientLeft + parseFloat(j.paddingLeft)) * m.x, N = k.top + (y.clientTop + parseFloat(j.paddingTop)) * m.y;
+      u *= m.x, v *= m.y, d *= m.x, c *= m.y, u += B, v += N, y = ne(y).frameElement;
     }
   }
   return Xe({
@@ -6352,7 +6375,7 @@ function sn(e, t, n) {
   return Xe(a);
 }
 function Wn(e, t) {
-  const n = Ae(e);
+  const n = Be(e);
   return n === t || !ve(n) || it(n) ? !1 : re(n).position === "fixed" || Wn(n, t);
 }
 function qu(e, t) {
@@ -6361,10 +6384,10 @@ function qu(e, t) {
     return n;
   let a = bt(e, [], !1).filter((i) => ve(i) && ge(i) !== "body"), o = null;
   const r = re(e).position === "fixed";
-  let l = r ? Ae(e) : e;
+  let l = r ? Be(e) : e;
   for (; ve(l) && !it(l); ) {
     const i = re(l), u = Ot(l);
-    !u && i.position === "fixed" && (o = null), (r ? !u && !o : !u && i.position === "static" && !!o && ["absolute", "fixed"].includes(o.position) || ze(l) && !u && Wn(e, l)) ? a = a.filter((d) => d !== l) : o = i, l = Ae(l);
+    !u && i.position === "fixed" && (o = null), (r ? !u && !o : !u && i.position === "static" && !!o && ["absolute", "fixed"].includes(o.position) || ze(l) && !u && Wn(e, l)) ? a = a.filter((d) => d !== l) : o = i, l = Be(l);
   }
   return t.set(e, a), a;
 }
@@ -6490,19 +6513,19 @@ function cn(e, t) {
 }
 function Xu(e, t, n) {
   n === void 0 && (n = {});
-  const a = n.whileElementsMounted, o = E(() => {
+  const a = n.whileElementsMounted, o = I(() => {
     var R;
     return (R = $(n.open)) != null ? R : !0;
-  }), r = E(() => $(n.middleware)), l = E(() => {
+  }), r = I(() => $(n.middleware)), l = I(() => {
     var R;
     return (R = $(n.placement)) != null ? R : "bottom";
-  }), i = E(() => {
+  }), i = I(() => {
     var R;
     return (R = $(n.strategy)) != null ? R : "absolute";
-  }), u = E(() => {
+  }), u = I(() => {
     var R;
     return (R = $(n.transform)) != null ? R : !0;
-  }), v = E(() => gt(e.value)), d = E(() => gt(t.value)), c = x(0), p = x(0), s = x(i.value), y = x(l.value), m = oa({}), k = x(!1), j = E(() => {
+  }), v = I(() => gt(e.value)), d = I(() => gt(t.value)), c = x(0), p = x(0), s = x(i.value), y = x(l.value), m = oa({}), k = x(!1), j = I(() => {
     const R = {
       position: s.value,
       left: "0",
@@ -6523,8 +6546,8 @@ function Xu(e, t, n) {
       top: le + "px"
     };
   });
-  let V;
-  function T() {
+  let B;
+  function N() {
     v.value == null || d.value == null || Zu(v.value, d.value, {
       middleware: r.value,
       placement: l.value,
@@ -6533,29 +6556,29 @@ function Xu(e, t, n) {
       c.value = R.x, p.value = R.y, s.value = R.strategy, y.value = R.placement, m.value = R.middlewareData, k.value = !0;
     });
   }
-  function J() {
-    typeof V == "function" && (V(), V = void 0);
-  }
   function O() {
-    if (J(), a === void 0) {
-      T();
+    typeof B == "function" && (B(), B = void 0);
+  }
+  function A() {
+    if (O(), a === void 0) {
+      N();
       return;
     }
     if (v.value != null && d.value != null) {
-      V = a(v.value, d.value, T);
+      B = a(v.value, d.value, N);
       return;
     }
   }
   function Z() {
     o.value || (k.value = !1);
   }
-  return X([r, l, i], T, {
+  return X([r, l, i], N, {
     flush: "sync"
-  }), X([v, d], O, {
+  }), X([v, d], A, {
     flush: "sync"
   }), X(o, Z, {
     flush: "sync"
-  }), _t() && wt(J), {
+  }), _t() && wt(O), {
     x: je(c),
     y: je(p),
     strategy: je(s),
@@ -6563,10 +6586,10 @@ function Xu(e, t, n) {
     middlewareData: je(m),
     isPositioned: je(k),
     floatingStyles: j,
-    update: T
+    update: N
   };
 }
-const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
+const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ T({
   __name: "VJoyTooltip",
   props: {
     /** If you are 100% sure the content you want to inject does not contain anything that could lead to any XSS, use this  */
@@ -6610,8 +6633,8 @@ const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
         transform: !1,
         middleware: [
           Eu(10),
-          Au({
-            limiter: Bu()
+          Bu({
+            limiter: Au()
           }),
           Iu({
             fallbackPlacements: ["bottom", "top", "left", "right"]
@@ -6635,7 +6658,7 @@ const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
         a.value = s;
       }, n.delay);
     }
-    const p = E(() => {
+    const p = I(() => {
       const { middlewareData: s, placement: y } = i.value, m = s.arrow, k = {
         top: "bottom",
         right: "left",
@@ -6655,7 +6678,7 @@ const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
     }), t({
       tooltipVisible: a,
       tooltip: r
-    }), (s, y) => (f(), B($(Tt), {
+    }), (s, y) => (f(), E($(Tt), {
       ref: "tooltipClickOutside",
       class: "joy-tooltip__click-outside",
       onTrigger: y[1] || (y[1] = (m) => c(!1))
@@ -6673,7 +6696,7 @@ const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
             onKeydown: y[0] || (y[0] = St((k) => c(!1), ["tab"]))
           }, [
             w(s.$slots, "default", {}, void 0, !0),
-            (f(), B(nt, { to: "body" }, [
+            (f(), E(nt, { to: "body" }, [
               a.value ? (f(), g("div", {
                 key: 0,
                 ref_key: "tooltip",
@@ -6690,7 +6713,7 @@ const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
               }, [
                 b("div", ec, [
                   w(s.$slots, "tooltip-content", {}, () => [
-                    z(N(e.text), 1)
+                    z(J(e.text), 1)
                   ], !0)
                 ]),
                 b("div", {
@@ -6708,7 +6731,7 @@ const ec = { class: "joy-tooltip__content__inner" }, tc = /* @__PURE__ */ L({
     }, 512));
   }
 });
-const nc = /* @__PURE__ */ A(tc, [["__scopeId", "data-v-ee2c7027"]]), ac = { class: "joy-user-card__picture" }, oc = { class: "joy-user-card__informations" }, lc = { class: "joy-user-card__title" }, rc = { class: "joy-user-card__subtitle" }, ic = /* @__PURE__ */ L({
+const nc = /* @__PURE__ */ L(tc, [["__scopeId", "data-v-ee2c7027"]]), ac = { class: "joy-user-card__picture" }, oc = { class: "joy-user-card__informations" }, lc = { class: "joy-user-card__title" }, rc = { class: "joy-user-card__subtitle" }, ic = /* @__PURE__ */ T({
   __name: "VJoyUserCard",
   props: {
     /**
@@ -6734,7 +6757,7 @@ const nc = /* @__PURE__ */ A(tc, [["__scopeId", "data-v-ee2c7027"]]), ac = { cla
     }
   },
   setup(e) {
-    return (t, n) => (f(), B(ae(e.link ? "a" : "div"), ie({
+    return (t, n) => (f(), E(ae(e.link ? "a" : "div"), ie({
       class: "joy-user-card",
       href: e.link,
       title: e.fullName
@@ -6751,16 +6774,16 @@ const nc = /* @__PURE__ */ A(tc, [["__scopeId", "data-v-ee2c7027"]]), ac = { cla
         b("div", oc, [
           b("p", lc, [
             w(t.$slots, "user-card-title", {}, () => [
-              z(N(e.fullName), 1)
+              z(J(e.fullName), 1)
             ], !0)
           ]),
           b("p", rc, [
             w(t.$slots, "user-card-subtitle", {}, () => [
-              z(N(e.subTitle), 1)
+              z(J(e.subTitle), 1)
             ], !0)
           ]),
           w(t.$slots, "user-card-rating-stars", {}, () => [
-            e.ratingValue ? (f(), B($(Ln), {
+            e.ratingValue ? (f(), E($(Ln), {
               key: 0,
               "rating-value": e.ratingValue
             }, null, 8, ["rating-value"])) : S("", !0)
@@ -6774,7 +6797,7 @@ const nc = /* @__PURE__ */ A(tc, [["__scopeId", "data-v-ee2c7027"]]), ac = { cla
     }, 16, ["href", "title"]));
   }
 });
-const sc = /* @__PURE__ */ A(ic, [["__scopeId", "data-v-2a8e1076"]]), uc = /* @__PURE__ */ L({
+const sc = /* @__PURE__ */ L(ic, [["__scopeId", "data-v-2a8e1076"]]), uc = /* @__PURE__ */ T({
   __name: "VJoyWrapper",
   props: {
     /** Horizontal spread. Refers to CSS flex justify-content. */
@@ -6835,7 +6858,7 @@ const sc = /* @__PURE__ */ A(ic, [["__scopeId", "data-v-2a8e1076"]]), uc = /* @_
     ], 2));
   }
 });
-const Jt = /* @__PURE__ */ A(uc, [["__scopeId", "data-v-68d89412"]]), cc = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Jt = /* @__PURE__ */ L(uc, [["__scopeId", "data-v-68d89412"]]), cc = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   VJoyAvailability: ua,
   VJoyAvatar: vn,
@@ -6862,7 +6885,7 @@ const Jt = /* @__PURE__ */ A(uc, [["__scopeId", "data-v-68d89412"]]), cc = /* @_
   VJoyFooter: Sr,
   VJoyFormError: Tn,
   VJoyFormFieldSkeleton: jr,
-  VJoyFunnel: Br,
+  VJoyFunnel: Ar,
   VJoyHeader: Pr,
   VJoyHighlight: qr,
   VJoyIcon: H,
@@ -6885,9 +6908,9 @@ const Jt = /* @__PURE__ */ A(uc, [["__scopeId", "data-v-68d89412"]]), cc = /* @_
   VJoySelectableItem: En,
   VJoySelectableItemGroup: ys,
   VJoySeparator: ps,
-  VJoySnackbar: An,
+  VJoySnackbar: Bn,
   VJoySpinner: Ct,
-  VJoyStep: Bn,
+  VJoyStep: An,
   VJoyStepper: $s,
   VJoyTab: Is,
   VJoyTabs: Js,
@@ -6948,7 +6971,7 @@ function gc(e) {
   let t, n;
   const a = fc();
   t = la(
-    An,
+    Bn,
     Object.assign(e.props, {
       bus: a,
       instanceNb: We
@@ -6996,7 +7019,7 @@ export {
   Sr as VJoyFooter,
   Tn as VJoyFormError,
   jr as VJoyFormFieldSkeleton,
-  Br as VJoyFunnel,
+  Ar as VJoyFunnel,
   Pr as VJoyHeader,
   qr as VJoyHighlight,
   H as VJoyIcon,
@@ -7019,9 +7042,9 @@ export {
   En as VJoySelectableItem,
   ys as VJoySelectableItemGroup,
   ps as VJoySeparator,
-  An as VJoySnackbar,
+  Bn as VJoySnackbar,
   Ct as VJoySpinner,
-  Bn as VJoyStep,
+  An as VJoyStep,
   $s as VJoyStepper,
   Is as VJoyTab,
   Js as VJoyTabs,