vlite3 0.6.1 → 0.6.4

package/components/SidePanel.vue.js

@@ -1,11 +1,11 @@
-import { defineComponent as N, ref as P, watch as b, onUnmounted as D, computed as f, openBlock as s, createElementBlock as r, Fragment as T, createElementVNode as c, mergeProps as C, withModifiers as V, renderSlot as i, createCommentVNode as l, createBlock as y, Teleport as K, createVNode as h, Transition as k, withCtx as g, normalizeClass as d, toDisplayString as w, resolveDynamicComponent as j } from "vue";
-import F from "./Button.vue.js";
-import { useKeyStroke as L } from "../composables/useKeyStroke.js";
-import { $t as x } from "../utils/i18n.js";
-const M = { class: "text-lg font-bold text-foreground" }, U = {
+import { defineComponent as N, ref as P, inject as D, watch as C, onMounted as V, onUnmounted as j, computed as c, openBlock as l, createElementBlock as i, Fragment as K, createElementVNode as m, mergeProps as g, withModifiers as M, renderSlot as d, createCommentVNode as n, createBlock as p, Teleport as F, createVNode as h, Transition as k, withCtx as w, normalizeClass as u, toDisplayString as x, resolveDynamicComponent as L } from "vue";
+import U from "./Button.vue.js";
+import { useKeyStroke as q } from "../composables/useKeyStroke.js";
+import { $t as $ } from "../utils/i18n.js";
+const G = { class: "text-lg font-bold text-foreground" }, H = {
   key: 0,
   class: "mt-1 text-sm text-muted-foreground"
-}, Q = /* @__PURE__ */ N({
+}, X = /* @__PURE__ */ N({
   inheritAttrs: !1,
   __name: "SidePanel",
   props: {
@@ -29,45 +29,47 @@ const M = { class: "text-lg font-bold text-foreground" }, U = {
     bodyProps: {}
   },
   emits: ["close", "update:show", "onOpen", "onAfterOpen", "onAfterClose"],
-  setup(t, { emit: $ }) {
-    const o = t, m = $, a = P(o.show);
-    b(
+  setup(t, { emit: B }) {
+    const o = t, y = B, s = P(o.show), r = D("dropdown-context", null);
+    C(
       () => o.show,
       (e) => {
-        a.value = e, e && m("onOpen");
+        s.value = e, e && (y("onOpen"), r?.close());
       }
     );
-    const B = () => {
-      a.value = !0;
-    }, n = () => {
-      a.value = !1, m("update:show", !1), m("close");
-    }, z = () => {
-      o.closeOutside && n();
-    }, { onKeyStroke: A } = L();
-    A("Escape", n), b(a, (e) => {
-      e ? document.body.style.overflow = "hidden" : document.body.style.overflow = "";
-    }), D(() => {
-      document.body.style.overflow = "";
+    const z = () => {
+      s.value = !0, r?.close();
+    }, a = () => {
+      s.value = !1, y("update:show", !1), y("close");
+    }, A = () => {
+      o.closeOutside && a();
+    }, { onKeyStroke: O } = q();
+    O("Escape", a), C(s, (e) => {
+      r?.onChildToggle?.(e), e ? document.body.style.overflow = "hidden" : document.body.style.overflow = "";
+    }), V(() => {
+      s.value && r?.onChildToggle?.(!0);
+    }), j(() => {
+      s.value && r?.onChildToggle?.(!1), document.body.style.overflow = "";
     });
-    const O = {
+    const I = {
       sm: "max-w-sm",
       md: "max-w-md",
       lg: "max-w-lg",
       xl: "max-w-xl",
       full: "max-w-full"
-    }, I = f(() => o.position === "left" ? "left-0" : "right-0"), S = f(() => o.position === "left" ? "slide-left" : "slide-right"), p = f(() => o.titleI18n ? x(o.titleI18n) : o.title), v = f(
-      () => o.descriptionI18n ? x(o.descriptionI18n) : o.description
+    }, T = c(() => o.position === "left" ? "left-0" : "right-0"), S = c(() => o.position === "left" ? "slide-left" : "slide-right"), v = c(() => o.titleI18n ? $(o.titleI18n) : o.title), b = c(
+      () => o.descriptionI18n ? $(o.descriptionI18n) : o.description
     );
-    return (e, u) => (s(), r(T, null, [
-      c("span", C({
-        onClick: V(B, ["stop"]),
+    return (e, f) => (l(), i(K, null, [
+      m("span", g({
+        onClick: M(z, ["stop"]),
         class: `${t.triggerClass}`
       }, e.$attrs), [
-        i(e.$slots, "trigger", {}, () => [
-          t.body ? i(e.$slots, "default", { key: 0 }) : l("", !0)
+        d(e.$slots, "trigger", {}, () => [
+          t.body ? d(e.$slots, "default", { key: 0 }) : n("", !0)
         ])
       ], 16),
-      (s(), y(K, { to: "body" }, [
+      (l(), p(F, { to: "body" }, [
         h(k, {
           "enter-active-class": "transition-opacity duration-300 ease-out",
           "enter-from-class": "opacity-0",
@@ -76,60 +78,60 @@ const M = { class: "text-lg font-bold text-foreground" }, U = {
           "leave-from-class": "opacity-100",
           "leave-to-class": "opacity-0"
         }, {
-          default: g(() => [
-            a.value ? (s(), r("div", {
+          default: w(() => [
+            s.value ? (l(), i("div", {
               key: 0,
-              class: d(["fixed inset-0 z-50 bg-[#00000033]", [t.overlayClass, { "backdrop-blur-[2px]": t.backdrop }]]),
-              onClick: z
-            }, null, 2)) : l("", !0)
+              class: u(["fixed inset-0 z-50 bg-[#00000033] v-sidepanel-overlay", [t.overlayClass, { "backdrop-blur-[2px]": t.backdrop }]]),
+              onClick: A
+            }, null, 2)) : n("", !0)
           ]),
           _: 1
         }),
         h(k, {
           name: S.value,
-          onAfterEnter: u[0] || (u[0] = (E) => e.$emit("onAfterOpen")),
-          onAfterLeave: u[1] || (u[1] = (E) => e.$emit("onAfterClose"))
+          onAfterEnter: f[0] || (f[0] = (E) => e.$emit("onAfterOpen")),
+          onAfterLeave: f[1] || (f[1] = (E) => e.$emit("onAfterClose"))
         }, {
-          default: g(() => [
-            a.value ? (s(), r("div", {
+          default: w(() => [
+            s.value ? (l(), i("div", {
               key: 0,
-              class: d(["sidepanel-body fixed inset-y-0 z-50 flex flex-col bg-body shadow-sm border transition-transform duration-300 ease-in-out w-full", [O[t.size], I.value, o.class]])
+              class: u(["sidepanel-body fixed inset-y-0 z-50 flex flex-col bg-body shadow-sm border transition-transform duration-300 ease-in-out w-full", [I[t.size], T.value, o.class]])
             }, [
-              p.value || e.$slots.header ? (s(), r("div", {
+              v.value || e.$slots.header ? (l(), i("div", {
                 key: 0,
-                class: d([t.headerClass, "flex-none flex items-center justify-between px-6 py-2 border-b border-border"])
+                class: u([t.headerClass, "flex-none flex items-center justify-between px-6 py-2 border-b border-border"])
               }, [
-                i(e.$slots, "header", {}, () => [
-                  c("div", null, [
-                    c("h3", M, w(p.value), 1),
-                    v.value ? (s(), r("p", U, w(v.value), 1)) : l("", !0)
+                d(e.$slots, "header", {}, () => [
+                  m("div", null, [
+                    m("h3", G, x(v.value), 1),
+                    b.value ? (l(), i("p", H, x(b.value), 1)) : n("", !0)
                   ])
                 ]),
-                t.hideCloseButton ? l("", !0) : (s(), y(F, {
+                t.hideCloseButton ? n("", !0) : (l(), p(U, {
                   key: 0,
                   rounded: "full",
                   size: "sm",
                   variant: "ghost",
                   icon: "lucide:x",
-                  onClick: n,
+                  onClick: a,
                   class: "-mr-2"
                 }))
-              ], 2)) : l("", !0),
-              c("div", {
-                class: d(["flex-1 overflow-y-auto px-6 py-4", t.bodyClass])
+              ], 2)) : n("", !0),
+              m("div", {
+                class: u(["flex-1 overflow-y-auto px-6 py-4", t.bodyClass])
               }, [
-                t.body ? (s(), y(j(t.body), C({ key: 0 }, { ...t.bodyProps, ...e.$attrs }, { close: n }), null, 16)) : i(e.$slots, "default", {
+                t.body ? (l(), p(L(t.body), g({ key: 0 }, { ...t.bodyProps, ...e.$attrs }, { close: a }), null, 16)) : d(e.$slots, "default", {
                   key: 1,
-                  close: n
+                  close: a
                 })
               ], 2),
-              e.$slots.footer ? (s(), r("div", {
+              e.$slots.footer ? (l(), i("div", {
                 key: 1,
-                class: d(["flex-none px-6 py-3 border-t border-border", t.footerClass])
+                class: u(["flex-none px-6 py-3 border-t border-border", t.footerClass])
               }, [
-                i(e.$slots, "footer", { close: n })
-              ], 2)) : l("", !0)
-            ], 2)) : l("", !0)
+                d(e.$slots, "footer", { close: a })
+              ], 2)) : n("", !0)
+            ], 2)) : n("", !0)
           ]),
           _: 3
         }, 8, ["name"])
@@ -138,5 +140,5 @@ const M = { class: "text-lg font-bold text-foreground" }, U = {
   }
 });
 export {
-  Q as default
+  X as default
 };

package/components/SidebarMenu/SidebarMenu.vue.js

@@ -1,9 +1,9 @@
-import { defineComponent as S, inject as I, ref as w, computed as n, watch as h, reactive as E, provide as N, openBlock as g, createElementBlock as y, normalizeClass as L, Fragment as P, renderList as A, createBlock as O } from "vue";
-import { useRoute as F } from "vue-router";
-import { useBreakpoints as W, breakpointsTailwind as H } from "@vueuse/core";
-import D from "./SidebarMenuItem.vue.js";
+import { defineComponent as S, inject as E, ref as T, computed as l, watch as g, reactive as N, provide as L, openBlock as C, createElementBlock as k, normalizeClass as P, Fragment as A, renderList as O, createBlock as F } from "vue";
+import { useRoute as W } from "vue-router";
+import { useBreakpoints as H, breakpointsTailwind as D } from "@vueuse/core";
+import R from "./SidebarMenuItem.vue.js";
 /* empty css                     */
-const J = /* @__PURE__ */ S({
+const K = /* @__PURE__ */ S({
   __name: "SidebarMenu",
   props: {
     items: { default: () => [] },
@@ -15,7 +15,7 @@ const J = /* @__PURE__ */ S({
     showCompactLabels: { type: Boolean, default: !1 },
     renderMode: { default: "tree" },
     iconSize: { default: "16px" },
-    compactIconSize: { default: "20px" },
+    compactIconSize: { default: "21px" },
     labelClass: { default: "text-sm" },
     compactLabelClass: { default: "text-[11.5px] mt-1" },
     itemPadding: { default: "py-2 px-2" },
@@ -29,112 +29,114 @@ const J = /* @__PURE__ */ S({
     showTooltip: { type: Boolean, default: !0 }
   },
   setup(m) {
-    const d = I("navbar-context", null), t = m, c = F(), T = W(H), u = w([...t.defaultExpanded]), i = w(null), k = n(() => !t.mobileBreakpoint || t.mobileBreakpoint === "none" ? !0 : T.greaterOrEqual(t.mobileBreakpoint).value), v = n(() => k.value && t.orientation || "vertical"), M = (l, s) => {
-      if (i.value === l.id) return !0;
-      if (l.to) {
-        const a = typeof l.to == "string" ? l.to : l.to.path;
-        if (a && (s === a || s.startsWith(a) && a !== "/" && a.length > 1))
-          return !0;
+    const c = E("navbar-context", null), e = m, f = W(), y = H(D), d = T([...e.defaultExpanded]), s = T(null), B = l(() => !e.mobileBreakpoint || e.mobileBreakpoint === "none" ? !0 : y.greaterOrEqual(e.mobileBreakpoint).value), v = l(() => B.value && e.orientation || "vertical"), r = (t) => t.id || (typeof t.to == "string" ? t.to : null) || t.label, M = (t, o) => {
+      if (s.value === r(t)) return !0;
+      if (t.to) {
+        const a = typeof t.to == "string" ? t.to : t.to.path;
+        if (a) {
+          if (o === a) return !0;
+          if (o.startsWith(a) && a !== "/" && a.length > 1) {
+            const i = o[a.length];
+            if (!i || i === "/" || i === "?")
+              return !0;
+          }
+        }
       }
       return !1;
-    }, b = (l, s, a = []) => {
-      let r = !1;
-      for (const e of l) {
-        const o = e.id || (typeof e.to == "string" ? e.to : null) || e.label;
-        let f = !1;
-        e.children && (f = b(e.children, s, [...a, o]), f && (r = !0));
-        const p = M(e, s), z = f && d?.renderNestedTabs?.value && a.length === 0;
-        (p || z) && (i.value = o, a.forEach((C) => {
-          u.value.includes(C) || u.value.push(C);
-        }), r = !0);
+    }, b = (t, o, a = []) => {
+      let i = !1;
+      for (const n of t) {
+        const u = r(n);
+        let p = !1;
+        n.children && (p = b(n.children, o, [...a, u]), p && (i = !0));
+        const x = M(n, o), z = p && c?.renderNestedTabs?.value && a.length === 0;
+        (x || z) && (s.value = u, a.forEach((w) => {
+          d.value.includes(w) || d.value.push(w);
+        }), i = !0);
       }
-      return r;
-    }, x = (l) => {
-      if (!d?.renderNestedTabs?.value) return;
-      const s = t.items.find((a) => i.value === (a.id || a.label || a.to) ? !0 : a.children?.some((e) => i.value === (e.id || e.label || e.to) || e.children && e.children.some(
-        (o) => i.value === (o.id || o.label || o.to)
-      )) || M(a, l));
-      if (s && s.children) {
-        const a = s.children.map((e) => ({
-          label: e.label,
-          labelI18n: e.labelI18n,
-          value: e.id || (typeof e.to == "string" ? e.to : null) || e.label,
-          icon: e.icon,
-          disabled: e.disabled,
-          to: e.to,
-          href: e.href
+      return i;
+    }, h = (t) => {
+      if (!c?.renderNestedTabs?.value) return;
+      const o = e.items.find((a) => s.value === r(a) ? !0 : a.children?.some((n) => s.value === r(n) || n.children && n.children.some((u) => s.value === r(u))) || M(a, t));
+      if (o && o.children) {
+        const a = o.children.map((n) => ({
+          label: n.label,
+          labelI18n: n.labelI18n,
+          value: r(n),
+          icon: n.icon,
+          disabled: n.disabled,
+          to: n.to,
+          href: n.href
         }));
-        let r = a[0].value;
-        if (i.value) {
-          const e = a.find((o) => o.value === i.value);
-          if (e)
-            r = e.value;
+        let i = a[0].value;
+        if (s.value) {
+          const n = a.find((u) => u.value === s.value);
+          if (n)
+            i = n.value;
           else {
-            const o = s.children.find((f) => f.children?.some(
-              (p) => (p.id || p.label || p.to) === i.value
-            ));
-            o && (r = o.id || (typeof o.to == "string" ? o.to : null) || o.label);
+            const u = o.children.find((p) => p.children?.some((x) => r(x) === s.value));
+            u && (i = r(u));
           }
         }
-        d.setNestedTabs(a, r);
+        c.setNestedTabs(a, i);
       } else
-        t.items.some(
-          (r) => r.children?.some((e) => (e.id || e.label || e.to) === i.value)
-        ) || d.setNestedTabs([], "");
+        e.items.some(
+          (i) => i.children?.some((n) => r(n) === s.value)
+        ) || c.setNestedTabs([], "");
     };
-    h(
-      () => c?.path,
-      (l) => {
-        l && (b(t.items, l), x(l));
+    g(
+      () => f?.path,
+      (t) => {
+        t && (b(e.items, t), h(t));
       },
       { immediate: !0 }
-    ), h(
-      () => t.items,
+    ), g(
+      () => e.items,
       () => {
-        c?.path && (b(t.items, c.path), x(c.path));
+        f?.path && (b(e.items, f.path), h(f.path));
       },
       { deep: !0 }
-    ), h(
-      () => i.value,
+    ), g(
+      () => s.value,
       () => {
-        d?.renderNestedTabs?.value && x(c?.path || "");
+        c?.renderNestedTabs?.value && h(f?.path || "");
       }
     );
-    const B = E({
-      activeItem: i,
-      expandedItems: u,
-      toggleExpand: (l) => {
-        u.value.includes(l) ? u.value = u.value.filter((a) => a !== l) : t.allowMultiple ? u.value.push(l) : u.value = [l];
+    const I = N({
+      activeItem: s,
+      expandedItems: d,
+      toggleExpand: (t) => {
+        d.value.includes(t) ? d.value = d.value.filter((a) => a !== t) : e.allowMultiple ? d.value.push(t) : d.value = [t];
       },
-      setActive: (l) => {
-        i.value = l;
+      setActive: (t) => {
+        s.value = t;
       },
-      indentSize: n(() => t.indentSize),
-      variant: n(() => t.variant),
-      renderMode: n(() => t.renderMode || "tree"),
-      renderNestedTabs: n(() => !!d?.renderNestedTabs?.value),
-      compact: n(() => t.compact),
-      showCompactLabels: n(() => t.showCompactLabels),
-      iconSize: n(() => t.iconSize),
-      compactIconSize: n(() => t.compactIconSize),
-      labelClass: n(() => t.labelClass),
-      compactLabelClass: n(() => t.compactLabelClass),
-      itemPadding: n(() => t.itemPadding),
-      compactItemPadding: n(() => t.compactItemPadding),
-      nestedMenuWidth: n(() => t.nestedMenuWidth),
-      nestedMenuMaxHeight: n(() => t.nestedMenuMaxHeight),
+      indentSize: l(() => e.indentSize),
+      variant: l(() => e.variant),
+      renderMode: l(() => e.renderMode || "tree"),
+      renderNestedTabs: l(() => !!c?.renderNestedTabs?.value),
+      compact: l(() => e.compact),
+      showCompactLabels: l(() => e.showCompactLabels),
+      iconSize: l(() => e.iconSize),
+      compactIconSize: l(() => e.compactIconSize),
+      labelClass: l(() => e.labelClass),
+      compactLabelClass: l(() => e.compactLabelClass),
+      itemPadding: l(() => e.itemPadding),
+      compactItemPadding: l(() => e.compactItemPadding),
+      nestedMenuWidth: l(() => e.nestedMenuWidth),
+      nestedMenuMaxHeight: l(() => e.nestedMenuMaxHeight),
       currentOrientation: v,
-      showTooltip: n(() => t.showTooltip)
+      showTooltip: l(() => e.showTooltip)
     });
-    return N("sidebar-menu-ctx", B), (l, s) => (g(), y("nav", {
-      class: L(["flex w-full transition-all duration-300", [
+    return L("sidebar-menu-ctx", I), (t, o) => (C(), k("nav", {
+      class: P(["flex w-full transition-all duration-300", [
         v.value === "horizontal" ? "flex-row flex-wrap gap-2 items-center" : "flex-col",
-        v.value === "vertical" && !t.compact ? "space-y-1" : ""
+        v.value === "vertical" && !e.compact ? "space-y-1" : ""
       ]]),
       role: "tree",
       "aria-label": "Sidebar Menu"
     }, [
-      (g(!0), y(P, null, A(m.items, (a) => (g(), O(D, {
+      (C(!0), k(A, null, O(m.items, (a) => (C(), F(R, {
         key: a.id || a.label,
         item: a,
         itemClass: m.itemClass,
@@ -144,5 +146,5 @@ const J = /* @__PURE__ */ S({
   }
 });
 export {
-  J as default
+  K as default
 };