vlite3 1.2.2 → 1.2.4

package/components/SidebarMenu/SidebarMenuItem.vue.js

@@ -1,18 +1,18 @@
-import { defineComponent as ae, inject as oe, computed as r, resolveComponent as le, openBlock as s, createElementBlock as p, normalizeClass as d, createBlock as g, unref as a, withCtx as y, createElementVNode as v, normalizeStyle as M, createCommentVNode as f, toDisplayString as w, createVNode as C, resolveDynamicComponent as R, mergeProps as W, createTextVNode as re, Fragment as F, withKeys as se, withModifiers as ce, Transition as ue, renderList as de } from "vue";
-import { useRouter as me, useRoute as fe } from "vue-router";
+import { defineComponent as re, inject as ce, ref as se, computed as l, onMounted as ue, nextTick as de, watch as me, resolveComponent as fe, openBlock as c, createElementBlock as v, normalizeClass as d, unref as o, createBlock as g, withCtx as x, createElementVNode as b, normalizeStyle as M, createCommentVNode as p, toDisplayString as w, createVNode as C, resolveDynamicComponent as q, mergeProps as G, createTextVNode as pe, Fragment as J, withKeys as ve, withModifiers as he, Transition as be, renderList as ye } from "vue";
+import { useRouter as ge, useRoute as xe } from "vue-router";
 import k from "../Icon.vue.js";
-import q from "../Tooltip.vue.js";
-import pe from "../Dropdown/Dropdown.vue.js";
-import { $t as G } from "../../utils/i18n.js";
+import Q from "../Tooltip.vue.js";
+import we from "../Dropdown/Dropdown.vue.js";
+import { $t as U } from "../../utils/i18n.js";
 /* empty css            */
 /* empty css                            */
-const he = {
+const ke = {
   key: 0,
   class: "px-3 py-1.5 text-sm flex items-center gap-2 font-medium border-b bg-muted-light rounded-t-md text-center truncate"
-}, ve = { class: "w-full" }, be = { class: "flex items-center w-full gap-2 text-sm" }, ge = { class: "truncate flex-1 font-medium" }, ye = ["onKeydown"], xe = {
+}, Ce = { class: "w-full" }, Ie = { class: "flex items-center w-full gap-2 text-sm" }, Se = { class: "truncate flex-1 font-medium" }, ze = ["onKeydown"], $e = {
   key: 0,
   class: "sidebar-children-container overflow-hidden transition-all duration-300 ease-in-out relative"
-}, we = { class: "pt-1 space-y-0.5 pb-1.5" }, je = /* @__PURE__ */ ae({
+}, Te = { class: "pt-1 space-y-0.5" }, De = /* @__PURE__ */ re({
   __name: "SidebarMenuItem",
   props: {
     item: {},
@@ -20,201 +20,223 @@ const he = {
     menuOffset: {},
     itemClass: {}
   },
-  setup(c) {
-    const t = c, e = oe("sidebar-menu-ctx"), S = me(), J = fe();
+  setup(u) {
+    const t = u, e = ce("sidebar-menu-ctx"), I = ge(), X = xe();
     if (!e)
       throw new Error("SidebarMenuItem must be used within a SidebarMenu");
-    const o = r(
+    const E = se(null), a = l(
       () => e.currentOrientation === "horizontal" && t.depth === 0
-    ), m = r(() => !!t.item.children?.length), N = r(() => o.value && m.value || e.compact && m.value ? "popover" : t.item.renderMode || e.renderMode || "tree"), I = r(() => e.renderNestedTabs && t.depth === 0 ? !1 : N.value === "drilldown" && m.value), $ = r(() => e.renderNestedTabs && t.depth === 0 || I.value ? !1 : N.value === "popover" && m.value), x = r(() => t.item.id ? t.item.id : t.item.to && typeof t.item.to == "string" ? t.item.to : t.item.label), j = r(() => $.value || I.value || e.renderNestedTabs && t.depth === 0 ? !1 : e.expandedItems.includes(x.value)), T = r(() => !(!m.value || I.value || e.renderNestedTabs && t.depth === 0)), Q = r(() => I.value && m.value), _ = (i, n, u) => {
-      const l = i.id || (typeof i.to == "string" ? i.to : null) || i.label;
-      if (n && l === n) return !0;
+    ), f = l(() => !!t.item.children?.length), _ = l(() => a.value && f.value || e.compact && f.value ? "popover" : t.item.renderMode || e.renderMode || "tree"), S = l(() => e.renderNestedTabs && t.depth === 0 ? !1 : _.value === "drilldown" && f.value), $ = l(() => e.renderNestedTabs && t.depth === 0 || S.value ? !1 : _.value === "popover" && f.value), y = l(() => t.item.id ? t.item.id : t.item.to && typeof t.item.to == "string" ? t.item.to : t.item.label), L = l(() => $.value || S.value || e.renderNestedTabs && t.depth === 0 ? !1 : e.expandedItems.includes(y.value)), P = l(() => !(!f.value || S.value || e.renderNestedTabs && t.depth === 0)), Y = l(() => S.value && f.value), A = (i, n, s) => {
+      const r = i.id || (typeof i.to == "string" ? i.to : null) || i.label;
+      if (n && r === n) return !0;
       if (i.to) {
-        const b = typeof i.to == "string" ? i.to : i.to.path;
-        if (b) {
-          if (u === b) return !0;
-          if (b !== "/" && b.length > 1 && u.startsWith(b)) {
-            const E = u[b.length];
-            if (!E || E === "/" || E === "?") return !0;
+        const m = typeof i.to == "string" ? i.to : i.to.path;
+        if (m) {
+          if (s === m) return !0;
+          if (m !== "/" && m.length > 1 && s.startsWith(m)) {
+            const j = s[m.length];
+            if (!j || j === "/" || j === "?") return !0;
           }
         }
       }
-      return i.children?.length ? i.children.some((b) => _(b, n, u)) : !1;
-    }, L = r(() => {
-      const i = J?.path || "", n = e.activeItem;
-      return m.value ? _(t.item, n, i) : n === x.value;
-    }), P = (i) => {
+      return i.children?.length ? i.children.some((m) => A(m, n, s)) : !1;
+    }, T = l(() => {
+      const i = X?.path || "", n = e.activeItem;
+      return f.value ? A(t.item, n, i) : n === y.value;
+    }), N = l(() => e.activeItem === y.value), D = (i = !0) => {
+      N.value && E.value && E.value.scrollIntoView({ behavior: i ? "smooth" : "auto", block: "center" });
+    };
+    ue(() => {
+      N.value && de(() => {
+        D(!1);
+      });
+    }), me(N, (i) => {
+      i && setTimeout(() => {
+        D(!0);
+      }, 250);
+    });
+    const H = (i) => {
       if (!t.item.disabled) {
-        if (I.value) {
+        if (S.value) {
           t.item.action && t.item.action(t.item), e.drillInto(t.item);
           return;
         }
         if (e.renderNestedTabs && t.depth === 0) {
           if (t.item.action && t.item.action(t.item), t.item.to)
-            S.push(t.item.to).catch(() => {
+            I.push(t.item.to).catch(() => {
             });
           else if (t.item.href)
             window.open(t.item.href, "_blank");
-          else if (m.value) {
+          else if (f.value) {
             const n = t.item.children?.[0];
-            n && (n.to ? S.push(n.to).catch(() => {
+            n && (n.to ? I.push(n.to).catch(() => {
             }) : n.href && window.open(n.href, "_blank"));
           }
-          e.setActive(x.value);
+          e.setActive(y.value);
           return;
         }
-        m.value && !t.item.to && !t.item.href && ($.value || e.toggleExpand(x.value)), t.item.action && t.item.action(t.item), (!m.value || t.item.to) && e.setActive(x.value);
+        f.value && !t.item.to && !t.item.href && ($.value || e.toggleExpand(y.value)), t.item.action && t.item.action(t.item), (!f.value || t.item.to) && e.setActive(y.value);
       }
-    }, A = (i) => {
+    }, B = (i) => {
       if (i.stopPropagation(), e.renderNestedTabs && t.depth === 0) {
         if (t.item.action && t.item.action(t.item), t.item.to)
-          S.push(t.item.to).catch(() => {
+          I.push(t.item.to).catch(() => {
           });
         else if (t.item.href)
           window.open(t.item.href, "_blank");
-        else if (m.value) {
+        else if (f.value) {
           const n = t.item.children?.[0];
-          n && (n.to ? S.push(n.to).catch(() => {
+          n && (n.to ? I.push(n.to).catch(() => {
           }) : n.href && window.open(n.href, "_blank"));
         }
-        e.setActive(x.value);
+        e.setActive(y.value);
         return;
       }
-      $.value || e.toggleExpand(x.value);
-    }, D = r(() => e.indentSize || 12), U = r(() => {
+      $.value || e.toggleExpand(y.value);
+    }, R = l(() => e.indentSize || 12), Z = l(() => {
       const n = 8 + parseInt(e.iconSize || "16", 10) / 2;
-      return `${t.depth * D.value + n}px`;
-    }), H = r(() => {
-      if (o.value) return {};
+      return `${t.depth * R.value + n}px`;
+    }), V = l(() => {
+      if (a.value) return {};
       if (e.compact)
         return { width: "100%" };
       if (t.depth > 0) {
-        const n = 8 + parseInt(e.iconSize || "16", 10) / 2, u = (t.depth - 1) * D.value + n + 8;
+        const n = 8 + parseInt(e.iconSize || "16", 10) / 2, s = (t.depth - 1) * R.value + n + 8;
         return {
-          marginLeft: `${u}px`,
-          width: `calc(100% - ${u}px)`
+          marginLeft: `${s}px`,
+          width: `calc(100% - ${s}px)`
         };
       }
       return {};
-    }), B = r(() => {
-      const n = `group flex items-center justify-between font-medium rounded-md focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 relative border border-transparent select-none cursor-pointer ${o.value ? "w-auto" : "w-full"} ${t?.itemClass || ""} ${e.labelClass}`, u = e.compact ? `justify-center ${e.compactItemPadding}` : `justify-between ${e.itemPadding}`;
-      let l = "";
-      return L.value ? l = "bg-primary-light text-primary-fg-light" : l = "text-muted hover:bg-accent/80 hover:text-foreground", t.item.disabled && (l = "opacity-50 cursor-not-allowed pointer-events-none"), `${n} ${u} ${l} ${t.item.class || ""}`;
-    }), h = r(() => e.compact && e.showCompactLabels), z = r(
-      () => t.item.labelI18n ? G(t.item.labelI18n) : t.item.label
-    ), V = (i) => ({
-      label: i.labelI18n ? G(i.labelI18n) : i.label,
+    }), K = l(() => {
+      const n = `group flex items-center justify-between font-medium rounded-md focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 relative border border-transparent select-none cursor-pointer ${a.value ? "w-auto" : "w-full"} ${t?.itemClass || ""} ${e.labelClass}`;
+      let s = e.compact ? e.compactItemPadding : e.itemPadding;
+      !e.compact && t.depth > 0 && (s = s.replace(/py-[\d\.]+/, "py-1.5"));
+      const r = e.compact ? `justify-center ${s}` : `justify-between ${s}`;
+      let m = "";
+      return T.value ? m = "bg-primary-light text-primary-fg-light" : m = "text-muted hover:bg-accent/80 hover:text-foreground", t.item.disabled && (m = "opacity-50 cursor-not-allowed pointer-events-none"), `${n} ${r} ${m} ${t.item.class || ""}`;
+    }), h = l(() => e.compact && e.showCompactLabels), z = l(
+      () => t.item.labelI18n ? U(t.item.labelI18n) : t.item.label
+    ), O = (i) => ({
+      label: i.labelI18n ? U(i.labelI18n) : i.label,
       value: i.id || i.label,
       icon: i.icon,
       disabled: i.disabled,
-      children: i.children ? i.children.map(V) : void 0,
+      children: i.children ? i.children.map(O) : void 0,
       data: i
-    }), X = r(() => t.item.children ? t.item.children.map(V) : []), Y = (i) => {
+    }), ee = l(() => t.item.children ? t.item.children.map(O) : []), te = (i) => {
       const n = i.data;
       if (n) {
         n.action && n.action(n);
-        const u = n.id || n.label || (typeof n.to == "string" ? n.to : "");
-        u && e.setActive(u), n.to ? S.push(n.to).catch(() => {
+        const s = n.id || n.label || (typeof n.to == "string" ? n.to : "");
+        s && e.setActive(s), n.to ? I.push(n.to).catch(() => {
         }) : n.href && window.open(n.href, "_blank");
       }
-    }, Z = (i) => {
+    }, ne = (i) => {
       const n = i;
       n.style.height = "0", n.style.opacity = "0";
-    }, ee = (i) => {
+    }, ie = (i) => {
       const n = i;
       n.style.height = n.scrollHeight + "px", n.style.opacity = "1";
-    }, te = (i) => {
+    }, oe = (i) => {
       const n = i;
       n.style.height = "auto", n.style.overflow = "visible";
-    }, ne = (i) => {
+    }, ae = (i) => {
       const n = i;
       n.style.height = n.scrollHeight + "px", n.style.overflow = "hidden", n.style.opacity = "1";
-    }, ie = (i) => {
+    }, le = (i) => {
       const n = i;
       n.style.height = "0", n.style.opacity = "0";
-    }, K = r(() => t.item.to ? "router-link" : t.item.href ? "a" : "button"), O = r(() => t.item.to ? { to: t.item.to } : t.item.href ? {
+    }, W = l(() => t.item.to ? "router-link" : t.item.href ? "a" : "button"), F = l(() => t.item.to ? { to: t.item.to } : t.item.href ? {
       href: t.item.href,
       target: "_blank",
       rel: "noopener noreferrer"
     } : { type: "button" });
     return (i, n) => {
-      const u = le("SidebarMenuItem", !0);
-      return s(), p("div", {
-        class: d(["relative sidebar-manu-item", o.value ? "w-auto" : "w-full"])
+      const s = fe("SidebarMenuItem", !0);
+      return c(), v("div", {
+        ref_key: "itemRef",
+        ref: E,
+        class: d([
+          "relative sidebar-manu-item",
+          a.value ? "w-auto" : "w-full",
+          o(e).compact && "mb-px"
+        ])
       }, [
-        $.value ? (s(), g(a(pe), {
+        $.value ? (c(), g(o(we), {
           key: 0,
-          position: o.value ? "bottom-start" : "right-start",
-          offset: c.menuOffset,
+          position: a.value ? "bottom-start" : "right-start",
+          offset: u.menuOffset,
           class: "w-full block",
           searchable: !1,
-          width: a(e).nestedMenuWidth,
-          maxHeight: a(e).nestedMenuMaxHeight,
-          options: X.value,
-          onOnSelect: Y
+          width: o(e).nestedMenuWidth,
+          maxHeight: o(e).nestedMenuMaxHeight,
+          options: ee.value,
+          onOnSelect: te
         }, {
-          header: y(() => [
-            a(e).compact && !o.value ? (s(), p("div", he, [
-              c.item.icon ? (s(), g(k, {
+          header: x(() => [
+            o(e).compact && !a.value ? (c(), v("div", ke, [
+              u.item.icon ? (c(), g(k, {
                 key: 0,
-                icon: c.item.icon,
+                icon: u.item.icon,
                 class: "shrink-0 transition-colors opacity-90 group-hover:opacity-100"
-              }, null, 8, ["icon"])) : f("", !0),
-              re(" " + w(z.value), 1)
-            ])) : f("", !0)
+              }, null, 8, ["icon"])) : p("", !0),
+              pe(" " + w(z.value), 1)
+            ])) : p("", !0)
           ]),
-          trigger: y(({ isOpen: l }) => [
-            C(q, {
+          trigger: x(({ isOpen: r }) => [
+            C(Q, {
               content: z.value,
-              placement: o.value ? "bottom" : "right",
+              placement: a.value ? "bottom" : "right",
               className: "sidebar-menu-tooltip",
-              disabled: !a(e).showTooltip || !a(e).compact && !o.value || l,
+              disabled: !o(e).showTooltip || !o(e).compact && !a.value || r,
               class: "w-full block"
             }, {
-              default: y(() => [
-                v("div", ve, [
-                  (s(), g(R(K.value), W(O.value, {
-                    class: [B.value, l ? "bg-muted text-foreground" : ""],
-                    style: H.value,
+              default: x(() => [
+                b("div", Ce, [
+                  (c(), g(q(W.value), G(F.value, {
+                    class: [K.value, r ? "bg-muted text-foreground" : ""],
+                    style: V.value,
                     "aria-haspopup": !0,
-                    "aria-expanded": l,
-                    onClick: P
+                    "aria-expanded": r,
+                    onClick: H
                   }), {
-                    default: y(() => [
-                      v("div", {
+                    default: x(() => [
+                      b("div", {
                         class: d(["min-w-0 flex-1 flex", [
-                          h.value && !o.value ? "flex-col items-center justify-center gap-1" : a(e).compact && !o.value ? "justify-center" : "items-center gap-2.5"
+                          h.value && !a.value ? "flex-col items-center justify-center text-center gap-1" : o(e).compact && !a.value ? "justify-center" : "items-center gap-2.5"
                         ]])
                       }, [
-                        c.item.icon ? (s(), g(k, {
+                        u.item.icon ? (c(), g(k, {
                           key: 0,
-                          icon: c.item.icon,
-                          class: d(["shrink-0 transition-colors opacity-90 group-hover:opacity-100", [L.value || l ? "opacity-100" : ""]]),
+                          icon: u.item.icon,
+                          class: d(["shrink-0 transition-colors opacity-90 group-hover:opacity-100", [T.value || r ? "opacity-100" : ""]]),
                           style: M({
-                            width: a(e).compact && !o.value ? a(e).compactIconSize : a(e).iconSize,
-                            height: a(e).compact && !o.value ? a(e).compactIconSize : a(e).iconSize
+                            width: o(e).compact && !a.value ? o(e).compactIconSize : o(e).iconSize,
+                            height: o(e).compact && !a.value ? o(e).compactIconSize : o(e).iconSize
                           })
-                        }, null, 8, ["icon", "class", "style"])) : f("", !0),
-                        v("span", {
+                        }, null, 8, ["icon", "class", "style"])) : p("", !0),
+                        b("span", {
                           class: d(["truncate leading-none pt-0.5 text-wrap", {
-                            [a(e).compactLabelClass]: h.value && !o.value,
-                            hidden: a(e).compact && !h.value && !o.value,
-                            "md:hidden": a(e).compact && !h.value && !o.value
+                            [o(e).compactLabelClass]: h.value && !a.value,
+                            "w-full text-center": o(e).compact,
+                            hidden: o(e).compact && !h.value && !a.value,
+                            "md:hidden": o(e).compact && !h.value && !a.value
                           }])
                         }, w(z.value), 3),
-                        c.item.badge && (!a(e).compact || !h.value || o.value) ? (s(), p("span", {
+                        u.item.badge && (!o(e).compact || !h.value || a.value) ? (c(), v("span", {
                           key: 1,
                           class: d(["ml-auto inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium", [
-                            c.item.badgeClass || "bg-muted text-muted-foreground",
-                            { "md:hidden": a(e).compact && !o.value }
+                            u.item.badgeClass || "bg-muted text-muted-foreground",
+                            { "md:hidden": o(e).compact && !a.value }
                           ]])
-                        }, w(c.item.badge), 3)) : f("", !0)
+                        }, w(u.item.badge), 3)) : p("", !0)
                       ], 2),
-                      v("div", {
-                        class: d(["ml-1.5 flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground", { "md:hidden": a(e).compact && !o.value }])
+                      b("div", {
+                        class: d(["ml-1.5 flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground", { "md:hidden": o(e).compact && !a.value }])
                       }, [
                         C(k, {
-                          icon: o.value ? "lucide:chevron-down" : "lucide:chevron-right",
+                          icon: a.value ? "lucide:chevron-down" : "lucide:chevron-right",
                           class: "h-3 w-3"
                         }, null, 8, ["icon"])
                       ], 2)
@@ -226,124 +248,125 @@ const he = {
               _: 2
             }, 1032, ["content", "placement", "disabled"])
           ]),
-          item: y(({ option: l }) => [
-            v("div", be, [
-              l.icon ? (s(), g(k, {
+          item: x(({ option: r }) => [
+            b("div", Ie, [
+              r.icon ? (c(), g(k, {
                 key: 0,
-                icon: l.icon,
+                icon: r.icon,
                 class: "shrink-0 opacity-90",
-                style: M({ width: a(e).iconSize, height: a(e).iconSize })
-              }, null, 8, ["icon", "style"])) : f("", !0),
-              v("span", ge, w(l.label), 1),
-              l.data?.badge ? (s(), p("span", {
+                style: M({ width: o(e).iconSize, height: o(e).iconSize })
+              }, null, 8, ["icon", "style"])) : p("", !0),
+              b("span", Se, w(r.label), 1),
+              r.data?.badge ? (c(), v("span", {
                 key: 1,
-                class: d(["ml-auto inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium", l.data?.badgeClass || "bg-muted text-muted-foreground"])
-              }, w(l.data.badge), 3)) : f("", !0)
+                class: d(["ml-auto inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium", r.data?.badgeClass || "bg-muted text-muted-foreground"])
+              }, w(r.data.badge), 3)) : p("", !0)
             ])
           ]),
           _: 1
-        }, 8, ["position", "offset", "width", "maxHeight", "options"])) : (s(), p(F, { key: 1 }, [
-          C(q, {
+        }, 8, ["position", "offset", "width", "maxHeight", "options"])) : (c(), v(J, { key: 1 }, [
+          C(Q, {
             content: z.value,
-            placement: o.value ? "bottom" : "right",
-            disabled: !a(e).showTooltip || !a(e).compact && !o.value,
+            placement: a.value ? "bottom" : "right",
+            disabled: !o(e).showTooltip || !o(e).compact && !a.value,
             class: "w-full block"
           }, {
-            default: y(() => [
-              (s(), g(R(K.value), W(O.value, {
-                class: B.value,
-                style: H.value,
-                "aria-expanded": T.value ? j.value : void 0,
-                "aria-current": L.value ? "page" : void 0,
-                onClick: P
+            default: x(() => [
+              (c(), g(q(W.value), G(F.value, {
+                class: K.value,
+                style: V.value,
+                "aria-expanded": P.value ? L.value : void 0,
+                "aria-current": T.value ? "page" : void 0,
+                onClick: H
               }), {
-                default: y(() => [
-                  v("div", {
+                default: x(() => [
+                  b("div", {
                     class: d(["min-w-0 flex-1 flex py-0.5", [
-                      h.value && !o.value ? "flex-col items-center justify-center gap-1" : a(e).compact && !o.value ? "justify-center" : "items-center gap-2.5"
+                      h.value && !a.value ? "flex-col items-center justify-center text-center gap-1" : o(e).compact && !a.value ? "justify-center" : "items-center gap-2.5"
                     ]])
                   }, [
-                    c.item.icon ? (s(), g(k, {
+                    u.item.icon ? (c(), g(k, {
                       key: 0,
-                      icon: c.item.icon,
-                      class: d(["shrink-0 transition-colors opacity-90 group-hover:opacity-100", [L.value ? "opacity-100" : ""]]),
+                      icon: u.item.icon,
+                      class: d(["shrink-0 transition-colors opacity-90 group-hover:opacity-100", [T.value ? "opacity-100" : ""]]),
                       style: M({
-                        width: a(e).compact && !o.value ? a(e).compactIconSize : a(e).iconSize,
-                        height: a(e).compact && !o.value ? a(e).compactIconSize : a(e).iconSize
+                        width: o(e).compact && !a.value ? o(e).compactIconSize : o(e).iconSize,
+                        height: o(e).compact && !a.value ? o(e).compactIconSize : o(e).iconSize
                       })
-                    }, null, 8, ["icon", "class", "style"])) : f("", !0),
-                    v("span", {
+                    }, null, 8, ["icon", "class", "style"])) : p("", !0),
+                    b("span", {
                       class: d(["truncate leading-none pt-0.5 wrap-break-word flex-wrap text-wrap", {
-                        [a(e).compactLabelClass]: h.value && !o.value,
-                        hidden: a(e).compact && !h.value && !o.value,
-                        "md:hidden": a(e).compact && !h.value && !o.value
+                        [o(e).compactLabelClass]: h.value && !a.value,
+                        "w-full text-center": o(e).compact,
+                        hidden: o(e).compact && !h.value && !a.value,
+                        "md:hidden": o(e).compact && !h.value && !a.value
                       }])
                     }, w(z.value), 3),
-                    c.item.badge && (!a(e).compact || !h.value || o.value) ? (s(), p("span", {
+                    u.item.badge && (!o(e).compact || !h.value || a.value) ? (c(), v("span", {
                       key: 1,
                       class: d(["ml-auto inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium", [
-                        c.item.badgeClass || "bg-muted text-muted-foreground",
-                        { "md:hidden": a(e).compact && !o.value }
+                        u.item.badgeClass || "bg-muted text-muted-foreground",
+                        { "md:hidden": o(e).compact && !a.value }
                       ]])
-                    }, w(c.item.badge), 3)) : f("", !0)
+                    }, w(u.item.badge), 3)) : p("", !0)
                   ], 2),
-                  T.value ? (s(), p("div", {
+                  P.value ? (c(), v("div", {
                     key: 0,
                     role: "button",
                     tabindex: "0",
-                    class: d(["ml-1.5 flex shrink-0 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent/50 hover:text-foreground transition-all", { "md:hidden": a(e).compact && !o.value }]),
-                    onClick: A,
-                    onKeydown: se(ce(A, ["prevent"]), ["enter", "space"])
+                    class: d(["ml-1.5 flex shrink-0 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent/50 hover:text-foreground transition-all", { "md:hidden": o(e).compact && !a.value }]),
+                    onClick: B,
+                    onKeydown: ve(he(B, ["prevent"]), ["enter", "space"])
                   }, [
                     C(k, {
                       icon: "lucide:chevron-down",
-                      class: d(["h-3 w-3 transition-transform duration-200", { "rotate-180": j.value && !o.value }])
+                      class: d(["h-3 w-3 transition-transform duration-200", { "rotate-180": L.value && !a.value }])
                     }, null, 8, ["class"])
-                  ], 42, ye)) : f("", !0),
-                  Q.value ? (s(), p("div", {
+                  ], 42, ze)) : p("", !0),
+                  Y.value ? (c(), v("div", {
                     key: 1,
-                    class: d(["ml-1.5 flex shrink-0 items-center justify-center text-muted-foreground", { "md:hidden": a(e).compact && !o.value }])
+                    class: d(["ml-1.5 flex shrink-0 items-center justify-center text-muted-foreground", { "md:hidden": o(e).compact && !a.value }])
                   }, [
                     C(k, {
                       icon: "lucide:chevron-right",
                       class: "h-3.5 w-3.5 opacity-50 transition-opacity group-hover:opacity-80"
                     })
-                  ], 2)) : f("", !0)
+                  ], 2)) : p("", !0)
                 ]),
                 _: 1
               }, 16, ["class", "style", "aria-expanded", "aria-current"]))
             ]),
             _: 1
           }, 8, ["content", "placement", "disabled"]),
-          C(ue, {
+          C(be, {
             name: "sidebar-slide",
-            onBeforeEnter: Z,
-            onEnter: ee,
-            onAfterEnter: te,
-            onBeforeLeave: ne,
-            onLeave: ie
+            onBeforeEnter: ne,
+            onEnter: ie,
+            onAfterEnter: oe,
+            onBeforeLeave: ae,
+            onLeave: le
           }, {
-            default: y(() => [
-              m.value && j.value && !o.value ? (s(), p("div", xe, [
-                a(e).variant === "default" ? (s(), p("div", {
+            default: x(() => [
+              f.value && L.value && !a.value ? (c(), v("div", $e, [
+                o(e).variant === "default" ? (c(), v("div", {
                   key: 0,
                   class: "sidebar-tree-line absolute rounded-full z-[1]",
                   style: M({
-                    left: U.value,
+                    left: Z.value,
                     top: "4px",
                     bottom: "10px",
                     width: "1px",
                     backgroundColor: "var(--color-border)"
                   })
-                }, null, 4)) : f("", !0),
-                v("div", we, [
-                  (s(!0), p(F, null, de(c.item.children, (l) => (s(), g(u, {
-                    key: l.id || l.label,
-                    item: l,
-                    depth: c.depth + 1
+                }, null, 4)) : p("", !0),
+                b("div", Te, [
+                  (c(!0), v(J, null, ye(u.item.children, (r) => (c(), g(s, {
+                    key: r.id || r.label,
+                    item: r,
+                    depth: u.depth + 1
                   }, null, 8, ["item", "depth"]))), 128))
                 ])
-              ])) : f("", !0)
+              ])) : p("", !0)
             ]),
             _: 1
           })
@@ -353,5 +376,5 @@ const he = {
   }
 });
 export {
-  je as default
+  De as default
 };