vlite3 0.1.4 → 0.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/DataTable/DataTable.vue.js +1 -1
- package/components/DataTable/DataTable.vue2.js +31 -34
- package/components/FilePicker/FilePicker.vue.js +3 -3
- package/components/Navbar/Navbar.vue.js +160 -118
- package/components/Navbar/NavbarItem.vue.js +65 -57
- package/components/SidebarMenu/SidebarMenu.vue.js +12 -12
- package/components/SidebarMenu/SidebarMenuItem.vue.js +20 -20
- package/components/Workbook/Sheet.vue.d.ts +2 -0
- package/components/Workbook/Sheet.vue.js +57 -48
- package/components/Workbook/Workbook.vue.d.ts +1 -0
- package/components/Workbook/Workbook.vue.js +2 -2
- package/components/Workbook/Workbook.vue2.js +49 -47
- package/components/Workbook/types.d.ts +1 -0
- package/composables/useKeyStroke.js +32 -31
- package/package.json +1 -1
- package/router/index.d.ts +2 -0
- package/style.css +3 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./DataTable.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import t from "../../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
-
const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-
|
|
4
|
+
const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-896cd72f"]]);
|
|
5
5
|
export {
|
|
6
6
|
m as default
|
|
7
7
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as ee, ref as g, computed as
|
|
1
|
+
import { defineComponent as ee, ref as g, computed as b, watch as p, onMounted as te, openBlock as r, createElementBlock as d, createVNode as C, createSlots as V, withCtx as T, renderSlot as S, createBlock as D, createCommentVNode as I, createElementVNode as n, normalizeClass as B, Fragment as R, renderList as $, normalizeStyle as A, mergeProps as le, toDisplayString as M, createTextVNode as ae, unref as se } from "vue";
|
|
2
2
|
import oe from "../Icon.vue.js";
|
|
3
3
|
import re from "../CheckBox.vue.js";
|
|
4
4
|
import ne from "../Button.vue.js";
|
|
@@ -12,11 +12,11 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
12
12
|
scope: "col",
|
|
13
13
|
class: "w-[48px] px-0 text-center font-medium text-muted-foreground",
|
|
14
14
|
style: { width: "48px" }
|
|
15
|
-
}, pe = { class: "flex items-center justify-center" },
|
|
15
|
+
}, pe = { class: "flex items-center justify-center" }, we = { class: "[&_tr:last-child]:border-0" }, ye = {
|
|
16
16
|
key: 0,
|
|
17
17
|
class: "w-[48px] px-0 py-4 align-middle text-center",
|
|
18
18
|
style: { width: "48px" }
|
|
19
|
-
},
|
|
19
|
+
}, be = { key: 2 }, ke = ["colspan"], Pe = { class: "flex flex-col items-center justify-center gap-2 text-muted-foreground p-8" }, xe = { class: "flex h-12 w-12 items-center justify-center rounded-full bg-muted" }, Ce = { class: "mt-1 text-base font-semibold text-foreground" }, Se = { class: "text-sm max-w-sm mx-auto" }, Ie = {
|
|
20
20
|
key: 0,
|
|
21
21
|
class: "mt-4"
|
|
22
22
|
}, $e = { key: 0 }, Ve = /* @__PURE__ */ ee({
|
|
@@ -50,7 +50,7 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
50
50
|
},
|
|
51
51
|
emits: ["change", "select", "rowClick", "update:itemsPerPage", "update:selectedRows", "delete"],
|
|
52
52
|
setup(a, { emit: U }) {
|
|
53
|
-
const O = (e, t) => t.split(".").reduce((s, c) => s?.[c], e), u = (e, t) => O(e, t), l = a,
|
|
53
|
+
const O = (e, t) => t.split(".").reduce((s, c) => s?.[c], e), u = (e, t) => O(e, t), l = a, w = U, i = g({ field: "", order: "" }), k = g(l.itemsPerPage), h = g(l.pageInfo?.currentPage || 1), y = g(l.search || ""), P = g(!1), v = g("initial"), L = b(() => l.loading && (v.value === "initial" || v.value === "page"));
|
|
54
54
|
p(
|
|
55
55
|
() => l.loading,
|
|
56
56
|
(e, t) => {
|
|
@@ -59,12 +59,12 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
59
59
|
), p(
|
|
60
60
|
() => l.search,
|
|
61
61
|
(e) => {
|
|
62
|
-
e !== void 0 && e !==
|
|
62
|
+
e !== void 0 && e !== y.value && (y.value = e);
|
|
63
63
|
}
|
|
64
64
|
);
|
|
65
|
-
let
|
|
66
|
-
p(
|
|
67
|
-
|
|
65
|
+
let F = null;
|
|
66
|
+
p(y, (e) => {
|
|
67
|
+
F && clearTimeout(F), F = setTimeout(() => {
|
|
68
68
|
h.value = 1, v.value = "search", x();
|
|
69
69
|
}, 300);
|
|
70
70
|
}), p(
|
|
@@ -87,7 +87,7 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
87
87
|
},
|
|
88
88
|
{ immediate: !0, deep: !0 }
|
|
89
89
|
);
|
|
90
|
-
const z =
|
|
90
|
+
const z = b(() => l.rows.length === 0 ? !1 : l.rows.every((e) => o.value.has(u(e, l.keyField)))), E = b(() => o.value.size > 0 && !z.value), W = b(() => {
|
|
91
91
|
const e = [...l.selectedRows || [], ...l.rows], t = /* @__PURE__ */ new Map();
|
|
92
92
|
return e.forEach((s) => t.set(u(s, l.keyField), s)), Array.from(o.value).map((s) => t.get(s)).filter(Boolean);
|
|
93
93
|
}), q = (e) => {
|
|
@@ -108,37 +108,34 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
108
108
|
all: z.value,
|
|
109
109
|
indeterminate: E.value
|
|
110
110
|
};
|
|
111
|
-
|
|
111
|
+
w("select", c), w("update:selectedRows", s);
|
|
112
112
|
}, H = (e) => {
|
|
113
113
|
i.value.field === e ? i.value.order === "asc" ? i.value.order = "desc" : i.value.order === "desc" ? (i.value.order = "", i.value.field = "") : i.value.order = "asc" : (i.value.field = e, i.value.order = "asc"), h.value = 1, v.value = "sort", x();
|
|
114
114
|
}, J = (e) => {
|
|
115
115
|
h.value = e, v.value = "page", x();
|
|
116
116
|
}, K = (e) => {
|
|
117
|
-
k.value = e, h.value = 1, v.value = "limit",
|
|
117
|
+
k.value = e, h.value = 1, v.value = "limit", w("update:itemsPerPage", e), x();
|
|
118
118
|
}, Q = (e) => {
|
|
119
|
-
|
|
119
|
+
w("rowClick", e);
|
|
120
120
|
}, X = () => {
|
|
121
121
|
const e = W.value;
|
|
122
|
-
|
|
122
|
+
w("delete", e), P.value = !1;
|
|
123
123
|
}, x = () => {
|
|
124
|
-
|
|
124
|
+
w("change", {
|
|
125
125
|
pagination: {
|
|
126
126
|
page: h.value,
|
|
127
127
|
limit: k.value
|
|
128
128
|
},
|
|
129
129
|
sorting: { ...i.value },
|
|
130
|
-
search:
|
|
130
|
+
search: y.value
|
|
131
131
|
});
|
|
132
|
-
}, Y =
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
l.class
|
|
140
|
-
].join(" ");
|
|
141
|
-
}), Z = y(() => ["w-full caption-bottom text-sm", l.tableClass].join(" ")), _ = (e) => e.width ? e.width : "auto";
|
|
132
|
+
}, Y = b(() => [
|
|
133
|
+
"w-full flex flex-col",
|
|
134
|
+
l.variant === "raised" ? "bg-background shadow-sm p-2 rounded-lg" : "bg-background rounded",
|
|
135
|
+
"overflow-hidden",
|
|
136
|
+
l.bordered ? "border border-border/60" : "",
|
|
137
|
+
l.class
|
|
138
|
+
].join(" ")), Z = b(() => ["w-full caption-bottom text-sm", l.tableClass].join(" ")), _ = (e) => e.width ? e.width : "auto";
|
|
142
139
|
return p(
|
|
143
140
|
() => l.rows,
|
|
144
141
|
() => {
|
|
@@ -149,8 +146,8 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
149
146
|
x();
|
|
150
147
|
}), (e, t) => (r(), d("div", fe, [
|
|
151
148
|
C(me, {
|
|
152
|
-
modelValue:
|
|
153
|
-
"onUpdate:modelValue": t[1] || (t[1] = (s) =>
|
|
149
|
+
modelValue: y.value,
|
|
150
|
+
"onUpdate:modelValue": t[1] || (t[1] = (s) => y.value = s),
|
|
154
151
|
"show-search": a.showSearch,
|
|
155
152
|
placeholder: a.searchPlaceholder
|
|
156
153
|
}, V({ _: 2 }, [
|
|
@@ -201,7 +198,7 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
201
198
|
}, null, 8, ["model-value", "indeterminate"])
|
|
202
199
|
])
|
|
203
200
|
])) : I("", !0),
|
|
204
|
-
(r(!0), d(
|
|
201
|
+
(r(!0), d(R, null, $(a.headers, (s) => (r(), D(ue, {
|
|
205
202
|
key: s.field,
|
|
206
203
|
header: s,
|
|
207
204
|
"sort-config": i.value,
|
|
@@ -215,17 +212,17 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
215
212
|
}, null, 8, ["header", "sort-config", "compact", "table-sortable", "style"]))), 128))
|
|
216
213
|
])
|
|
217
214
|
], 2),
|
|
218
|
-
n("tbody",
|
|
219
|
-
L.value ? (r(!0), d(
|
|
215
|
+
n("tbody", we, [
|
|
216
|
+
L.value ? (r(!0), d(R, { key: 0 }, $(Math.min(k.value, 15), (s) => (r(), d("tr", {
|
|
220
217
|
key: "skeleton-" + s,
|
|
221
218
|
class: "border-b border-border/50 bg-background transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"
|
|
222
219
|
}, [
|
|
223
|
-
a.selectable ? (r(), d("td",
|
|
220
|
+
a.selectable ? (r(), d("td", ye, [...t[4] || (t[4] = [
|
|
224
221
|
n("div", { class: "flex items-center justify-center" }, [
|
|
225
222
|
n("div", { class: "h-4 w-4 rounded-[4px] bg-muted/50 animate-pulse" })
|
|
226
223
|
], -1)
|
|
227
224
|
])])) : I("", !0),
|
|
228
|
-
(r(!0), d(
|
|
225
|
+
(r(!0), d(R, null, $(a.headers, (c) => (r(), d("td", {
|
|
229
226
|
key: c.field,
|
|
230
227
|
class: B(["p-5! align-middle last:pr-6!", [c.hideOnMobile ? "hidden md:table-cell" : ""]])
|
|
231
228
|
}, [
|
|
@@ -236,7 +233,7 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
236
233
|
})
|
|
237
234
|
}, null, 4)
|
|
238
235
|
], 2))), 128))
|
|
239
|
-
]))), 128)) : a.rows.length > 0 ? (r(!0), d(
|
|
236
|
+
]))), 128)) : a.rows.length > 0 ? (r(!0), d(R, { key: 1 }, $(a.rows, (s, c) => (r(), D(ce, {
|
|
240
237
|
key: j(s),
|
|
241
238
|
row: s,
|
|
242
239
|
headers: a.headers,
|
|
@@ -257,7 +254,7 @@ const fe = { class: "space-y-4" }, he = { class: "overflow-x-auto w-full" }, ve
|
|
|
257
254
|
S(e.$slots, m.field, le({ ref_for: !0 }, f), void 0, !0)
|
|
258
255
|
])
|
|
259
256
|
}))
|
|
260
|
-
]), 1032, ["row", "headers", "index", "key-field", "selectable", "is-selected", "hoverable", "striped", "compact"]))), 128)) : (r(), d("tr",
|
|
257
|
+
]), 1032, ["row", "headers", "index", "key-field", "selectable", "is-selected", "hoverable", "striped", "compact"]))), 128)) : (r(), d("tr", be, [
|
|
261
258
|
n("td", {
|
|
262
259
|
colspan: a.selectable ? a.headers.length + 1 : a.headers.length,
|
|
263
260
|
class: "h-96 text-center align-middle hover:bg-transparent"
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { defineComponent as K, ref as S, useSlots as O, computed as v, openBlock as a, createElementBlock as u, createElementVNode as s, renderSlot as q, normalizeClass as z, createBlock as y, withModifiers as D, createVNode as b, createTextVNode as H, toDisplayString as F, createCommentVNode as x, Fragment as J, renderList as Q } from "vue";
|
|
2
2
|
import f from "../Icon.vue.js";
|
|
3
3
|
import T from "../Button.vue.js";
|
|
4
|
-
const X = { class: "w-full" }, Y = ["multiple", "accept"], Z = ["value", "placeholder", "disabled"], _ = { class: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center gap-2 bg-background" }, ee = { class: "p-3 bg-muted
|
|
4
|
+
const X = { class: "w-full" }, Y = ["multiple", "accept"], Z = ["value", "placeholder", "disabled"], _ = { class: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center gap-2 bg-background" }, ee = { class: "p-3 bg-muted rounded-full text-muted-foreground" }, le = { class: "space-y-1" }, te = {
|
|
5
5
|
key: 0,
|
|
6
6
|
class: "text-xs text-muted-foreground"
|
|
7
7
|
}, oe = {
|
|
8
8
|
key: 1,
|
|
9
9
|
class: "space-y-2"
|
|
10
|
-
}, ie = { class: "shrink-0 mr-3" }, re = { class: "p-2 bg-primary-light rounded text-primary" }, ae = { class: "flex-1 min-w-0" }, ne = { class: "text-sm font-medium text-foreground truncate" }, se = { class: "text-xs text-muted-foreground" }, de = { class: "flex-shrink-0 ml-3 flex gap-2" }, ue = {
|
|
10
|
+
}, ie = { class: "shrink-0 mr-3" }, re = { class: "p-2 bg-primary-light rounded text-primary-fg-light" }, ae = { class: "flex-1 min-w-0" }, ne = { class: "text-sm font-medium text-foreground truncate" }, se = { class: "text-xs text-muted-foreground" }, de = { class: "flex-shrink-0 ml-3 flex gap-2" }, ue = {
|
|
11
11
|
key: 0,
|
|
12
12
|
class: "flex gap-2"
|
|
13
13
|
}, ce = {
|
|
@@ -242,7 +242,7 @@ const X = { class: "w-full" }, Y = ["multiple", "accept"], Z = ["value", "placeh
|
|
|
242
242
|
])) : x("", !0)
|
|
243
243
|
])) : (a(), u("div", {
|
|
244
244
|
key: 0,
|
|
245
|
-
class: z(["border-2 border-dashed border-border rounded-lg p-6 transition-all duration-200 ease-in-out cursor-pointer flex flex-col items-center justify-center text-center gap-
|
|
245
|
+
class: z(["border-2 border-dashed border-border rounded-lg p-6 transition-all duration-200 ease-in-out cursor-pointer flex flex-col items-center justify-center text-center gap-2", [
|
|
246
246
|
m.value ? "border-primary bg-primary/5" : "hover:border-primary/50 hover:bg-muted/50",
|
|
247
247
|
o.disabled || o.loading || d.value ? "opacity-50 cursor-not-allowed" : ""
|
|
248
248
|
]]),
|
|
@@ -1,14 +1,27 @@
|
|
|
1
|
-
import { defineComponent as
|
|
1
|
+
import { defineComponent as j, ref as y, useSlots as T, onMounted as L, onUnmounted as M, computed as g, provide as N, watch as P, openBlock as s, createElementBlock as r, normalizeClass as d, Fragment as k, createElementVNode as n, renderSlot as o, createVNode as h, createBlock as w, resolveDynamicComponent as E, withCtx as v, createCommentVNode as a, toDisplayString as V, createTextVNode as A } from "vue";
|
|
2
|
+
import { useRoute as H } from "vue-router";
|
|
2
3
|
import $ from "../Icon.vue.js";
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
const
|
|
4
|
+
import O from "../SidePanel.vue.js";
|
|
5
|
+
import D from "../Logo.vue.js";
|
|
6
|
+
const U = { class: "flex items-center gap-4 shrink-0 z-10" }, F = {
|
|
7
|
+
key: 0,
|
|
8
|
+
class: "shrink-0"
|
|
9
|
+
}, R = { key: 1 }, Y = { key: 2 }, q = {
|
|
10
|
+
key: 0,
|
|
11
|
+
class: "h-16 flex items-center px-6 z-10"
|
|
12
|
+
}, G = { class: "flex-1 px-4 py-4 overflow-y-auto space-y-4 scrollbar-thin" }, I = {
|
|
13
|
+
key: 1,
|
|
14
|
+
class: "p-4 border-t border-border shrink-0 bg-background mt-auto"
|
|
15
|
+
}, J = { class: "flex flex-col space-y-6 pt-4 h-full" }, K = {
|
|
6
16
|
key: 0,
|
|
7
17
|
class: "flex flex-col space-y-1"
|
|
8
|
-
},
|
|
18
|
+
}, Q = {
|
|
9
19
|
key: 1,
|
|
10
20
|
class: "flex flex-col space-y-4 flex-1 overflow-y-auto"
|
|
11
|
-
},
|
|
21
|
+
}, W = {
|
|
22
|
+
key: 2,
|
|
23
|
+
class: "mt-auto pt-4 border-t border-border"
|
|
24
|
+
}, oe = /* @__PURE__ */ j({
|
|
12
25
|
__name: "Navbar",
|
|
13
26
|
props: {
|
|
14
27
|
variant: { default: "header" },
|
|
@@ -26,187 +39,216 @@ const A = { class: "flex items-center gap-4 shrink-0 z-10" }, O = { class: "shri
|
|
|
26
39
|
mobileBreakpoint: { default: "md" }
|
|
27
40
|
},
|
|
28
41
|
emits: ["toggle-mobile"],
|
|
29
|
-
setup(
|
|
30
|
-
const
|
|
31
|
-
|
|
32
|
-
const
|
|
33
|
-
|
|
42
|
+
setup(f, { emit: X }) {
|
|
43
|
+
const l = f, m = y(!1), b = y(!1);
|
|
44
|
+
T();
|
|
45
|
+
const x = () => {
|
|
46
|
+
b.value = window.scrollY > 10;
|
|
34
47
|
};
|
|
35
|
-
|
|
36
|
-
window.addEventListener("scroll",
|
|
48
|
+
L(() => {
|
|
49
|
+
window.addEventListener("scroll", x, { passive: !0 });
|
|
37
50
|
}), M(() => {
|
|
38
|
-
window.removeEventListener("scroll",
|
|
51
|
+
window.removeEventListener("scroll", x);
|
|
39
52
|
});
|
|
40
|
-
const
|
|
41
|
-
const e =
|
|
53
|
+
const C = g(() => {
|
|
54
|
+
const e = l.variant === "sidebar", t = {
|
|
42
55
|
fixed: "fixed top-0 left-0 z-40",
|
|
43
56
|
sticky: "sticky top-0 z-40",
|
|
44
57
|
relative: "relative z-10",
|
|
45
58
|
absolute: "absolute top-0 left-0 w-full z-40"
|
|
46
|
-
}, u = "
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
59
|
+
}, u = "bg-body", p = [
|
|
60
|
+
l.glass && (b.value || e || l.floating) ? "backdrop-blur-md bg-background/80 supports-[backdrop-filter]:bg-background/60" : "bg-background",
|
|
61
|
+
l.border && !l.floating ? e ? "border-r border-border" : "border-b border-border" : "",
|
|
62
|
+
l.floating ? "m-4 rounded-xl shadow-lg border border-border/50" : "",
|
|
63
|
+
b.value && !l.floating && !e && l.position === "sticky" ? "shadow-sm" : ""
|
|
51
64
|
];
|
|
52
|
-
let
|
|
53
|
-
return e ?
|
|
54
|
-
}),
|
|
55
|
-
const e =
|
|
65
|
+
let c = "";
|
|
66
|
+
return e ? c = i.value.sidebarLayout : c = `flex items-center gap-4 w-full px-4 sm:px-6 lg:px-8 ${l.height}`, [u, t[l.position], ...p, c, l.class].join(" ");
|
|
67
|
+
}), i = g(() => {
|
|
68
|
+
const e = l.mobileBreakpoint || "md", t = {
|
|
69
|
+
sm: "sm:hidden",
|
|
70
|
+
md: "md:hidden",
|
|
71
|
+
lg: "lg:hidden",
|
|
72
|
+
xl: "xl:hidden"
|
|
73
|
+
}, u = {
|
|
74
|
+
sm: "hidden sm:flex",
|
|
75
|
+
md: "hidden md:flex",
|
|
76
|
+
lg: "hidden lg:flex",
|
|
77
|
+
xl: "hidden xl:flex"
|
|
78
|
+
}, p = {
|
|
79
|
+
sm: `flex flex-col max-sm:w-full ${l.compact ? "w-20" : l.width} h-auto sm:h-full sm:max-h-screen`,
|
|
80
|
+
md: `flex flex-col max-md:w-full ${l.compact ? "w-20" : l.width} h-auto md:h-full md:max-h-screen`,
|
|
81
|
+
lg: `flex flex-col max-lg:w-full ${l.compact ? "w-20" : l.width} h-auto lg:h-full lg:max-h-screen`,
|
|
82
|
+
xl: `flex flex-col max-xl:w-full ${l.compact ? "w-20" : l.width} h-auto xl:h-full xl:max-h-screen`
|
|
83
|
+
}, c = {
|
|
84
|
+
sm: "sm:hidden flex items-center justify-between px-4 py-3 shrink-0 bg-background",
|
|
85
|
+
md: "md:hidden flex items-center justify-between px-4 py-3 shrink-0 bg-background",
|
|
86
|
+
lg: "lg:hidden flex items-center justify-between px-4 py-3 shrink-0 bg-background",
|
|
87
|
+
xl: "xl:hidden flex items-center justify-between px-4 py-3 shrink-0 bg-background"
|
|
88
|
+
}, S = {
|
|
89
|
+
sm: "hidden sm:flex flex-col h-full w-full overflow-hidden",
|
|
90
|
+
md: "hidden md:flex flex-col h-full w-full overflow-hidden",
|
|
91
|
+
lg: "hidden lg:flex flex-col h-full w-full overflow-hidden",
|
|
92
|
+
xl: "hidden xl:flex flex-col h-full w-full overflow-hidden"
|
|
93
|
+
};
|
|
56
94
|
return {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
sidebarLayout: `flex flex-col max-${e}:w-full ${t.compact ? "w-20" : t.width} h-auto ${e}:h-full ${e}:max-h-screen`,
|
|
63
|
-
// Mobile Header (visible only on small screens)
|
|
64
|
-
mobileHeader: `${e}:hidden flex items-center justify-between px-4 py-3 shrink-0 bg-background`,
|
|
65
|
-
// Desktop Sidebar Content (hidden on small screens)
|
|
66
|
-
desktopSidebar: `hidden ${e}:flex flex-col h-full w-full overflow-hidden`
|
|
95
|
+
mobileTrigger: t[e],
|
|
96
|
+
desktopContent: u[e],
|
|
97
|
+
sidebarLayout: p[e],
|
|
98
|
+
mobileHeader: c[e],
|
|
99
|
+
desktopSidebar: S[e]
|
|
67
100
|
};
|
|
68
|
-
}),
|
|
69
|
-
if (
|
|
70
|
-
switch (
|
|
101
|
+
}), B = g(() => {
|
|
102
|
+
if (l.variant === "sidebar") return "flex-1 py-4 overflow-y-auto";
|
|
103
|
+
switch (l.centerPosition) {
|
|
71
104
|
case "left":
|
|
72
105
|
return "flex items-center justify-start";
|
|
73
106
|
case "right":
|
|
74
107
|
return "flex items-center justify-end ml-auto";
|
|
75
108
|
default:
|
|
76
|
-
return `${
|
|
109
|
+
return `${i.value.desktopContent} items-center justify-center mx-auto`;
|
|
77
110
|
}
|
|
78
111
|
});
|
|
79
|
-
|
|
80
|
-
compact:
|
|
81
|
-
})
|
|
82
|
-
|
|
112
|
+
N("navbar-context", {
|
|
113
|
+
compact: g(() => l.compact)
|
|
114
|
+
});
|
|
115
|
+
const z = H();
|
|
116
|
+
return P(
|
|
117
|
+
() => z.path,
|
|
118
|
+
() => {
|
|
119
|
+
m.value = !1;
|
|
120
|
+
}
|
|
121
|
+
), (e, t) => (s(), r("nav", {
|
|
122
|
+
class: d(C.value),
|
|
83
123
|
role: "navigation"
|
|
84
124
|
}, [
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
125
|
+
f.variant === "header" ? (s(), r(k, { key: 0 }, [
|
|
126
|
+
n("div", U, [
|
|
127
|
+
o(e.$slots, "mobile-trigger", {}, () => [
|
|
128
|
+
n("button", {
|
|
89
129
|
type: "button",
|
|
90
|
-
class:
|
|
91
|
-
onClick:
|
|
130
|
+
class: d(["p-2 -ml-2 text-muted-foreground hover:bg-accent rounded-md shrink-0", i.value.mobileTrigger]),
|
|
131
|
+
onClick: t[0] || (t[0] = (u) => m.value = !0)
|
|
92
132
|
}, [
|
|
93
|
-
|
|
133
|
+
h($, {
|
|
94
134
|
icon: "lucide:menu",
|
|
95
135
|
class: "w-5 h-5"
|
|
96
136
|
}),
|
|
97
|
-
|
|
137
|
+
t[3] || (t[3] = n("span", { class: "sr-only" }, "Open Menu", -1))
|
|
98
138
|
], 2)
|
|
99
139
|
]),
|
|
100
|
-
s("div",
|
|
101
|
-
|
|
102
|
-
(
|
|
103
|
-
src:
|
|
140
|
+
e.$slots?.logo ? (s(), r("div", F, [
|
|
141
|
+
o(e.$slots, "logo", {}, () => [
|
|
142
|
+
(s(), w(E(l.logo ? "img" : "div"), {
|
|
143
|
+
src: l.logo,
|
|
104
144
|
class: "h-8 w-auto font-bold text-xl flex items-center gap-2"
|
|
105
145
|
}, {
|
|
106
|
-
default:
|
|
107
|
-
|
|
146
|
+
default: v(() => [
|
|
147
|
+
l.logo ? a("", !0) : (s(), w(D, {
|
|
108
148
|
key: 0,
|
|
109
149
|
class: "h-6 w-6"
|
|
110
150
|
})),
|
|
111
|
-
!
|
|
151
|
+
!l.logo && l.logoAlt ? (s(), r("span", R, V(l.logoAlt), 1)) : l.logo ? a("", !0) : (s(), r("span", Y, "Brand"))
|
|
112
152
|
]),
|
|
113
153
|
_: 1
|
|
114
154
|
}, 8, ["src"]))
|
|
115
155
|
])
|
|
116
|
-
]),
|
|
117
|
-
s("div", {
|
|
118
|
-
|
|
156
|
+
])) : a("", !0),
|
|
157
|
+
e.$slots?.left ? (s(), r("div", {
|
|
158
|
+
key: 1,
|
|
159
|
+
class: d(["items-center gap-1 overflow-x-auto no-scrollbar mask-gradient", i.value.desktopContent])
|
|
119
160
|
}, [
|
|
120
|
-
|
|
121
|
-
], 2)
|
|
161
|
+
o(e.$slots, "left")
|
|
162
|
+
], 2)) : a("", !0)
|
|
122
163
|
]),
|
|
123
|
-
s("div", {
|
|
124
|
-
|
|
125
|
-
|
|
164
|
+
e.$slots?.center ? (s(), r("div", {
|
|
165
|
+
key: 0,
|
|
166
|
+
class: d([
|
|
167
|
+
B.value,
|
|
126
168
|
// Width constraint to ensure it doesn't crush others, but allows simple resizing
|
|
127
169
|
"max-w-full"
|
|
128
170
|
])
|
|
129
171
|
}, [
|
|
130
|
-
|
|
131
|
-
], 2),
|
|
132
|
-
|
|
133
|
-
class:
|
|
172
|
+
o(e.$slots, "center")
|
|
173
|
+
], 2)) : a("", !0),
|
|
174
|
+
n("div", {
|
|
175
|
+
class: d(["flex items-center gap-2 shrink-0 max-w-[40%] z-10", {
|
|
134
176
|
// Always push to end unless Center is pushing it.
|
|
135
177
|
// If Center is 'center' (mx-auto) or 'right' (ml-auto), this naturally falls to end.
|
|
136
178
|
// If Center is 'left', we MUST have ml-auto here.
|
|
137
|
-
"ml-auto":
|
|
179
|
+
"ml-auto": f.centerPosition === "left" || f.centerPosition === "center"
|
|
138
180
|
// If center is 'right', Center has ml-auto. Right just sits next to it.
|
|
139
181
|
// But if we add ml-auto here too, they might split space? No, flexbox parses strictly.
|
|
140
182
|
}])
|
|
141
183
|
}, [
|
|
142
|
-
|
|
184
|
+
o(e.$slots, "right")
|
|
143
185
|
], 2)
|
|
144
|
-
], 64)) : (
|
|
145
|
-
|
|
146
|
-
class:
|
|
186
|
+
], 64)) : (s(), r(k, { key: 1 }, [
|
|
187
|
+
n("div", {
|
|
188
|
+
class: d(i.value.mobileHeader)
|
|
147
189
|
}, [
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
]),
|
|
151
|
-
|
|
190
|
+
e.$slots?.right ? o(e.$slots, "logo", { key: 0 }, () => [
|
|
191
|
+
t[4] || (t[4] = n("div", { class: "font-bold text-xl truncate" }, "Brand", -1))
|
|
192
|
+
]) : a("", !0),
|
|
193
|
+
n("button", {
|
|
152
194
|
type: "button",
|
|
153
195
|
class: "p-2 -mr-2 text-muted-foreground hover:bg-accent rounded-md",
|
|
154
|
-
onClick:
|
|
196
|
+
onClick: t[1] || (t[1] = (u) => m.value = !0)
|
|
155
197
|
}, [
|
|
156
|
-
|
|
198
|
+
h($, {
|
|
157
199
|
icon: "lucide:menu",
|
|
158
200
|
class: "w-5 h-5"
|
|
159
201
|
}),
|
|
160
|
-
|
|
202
|
+
t[5] || (t[5] = n("span", { class: "sr-only" }, "Open Menu", -1))
|
|
161
203
|
])
|
|
162
204
|
], 2),
|
|
163
|
-
|
|
164
|
-
class:
|
|
205
|
+
n("div", {
|
|
206
|
+
class: d(i.value.desktopSidebar)
|
|
165
207
|
}, [
|
|
166
|
-
s("div",
|
|
167
|
-
|
|
168
|
-
|
|
208
|
+
e.$slots?.logo ? (s(), r("div", q, [
|
|
209
|
+
o(e.$slots, "logo", {}, () => [
|
|
210
|
+
t[6] || (t[6] = n("div", { class: "font-bold text-xl truncate" }, "Brand", -1))
|
|
169
211
|
])
|
|
212
|
+
])) : a("", !0),
|
|
213
|
+
n("div", G, [
|
|
214
|
+
o(e.$slots, "left"),
|
|
215
|
+
o(e.$slots, "default"),
|
|
216
|
+
o(e.$slots, "center")
|
|
170
217
|
]),
|
|
171
|
-
s("div",
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
l(e.$slots, "center")
|
|
175
|
-
]),
|
|
176
|
-
s("div", Y, [
|
|
177
|
-
l(e.$slots, "right")
|
|
178
|
-
])
|
|
218
|
+
e.$slots?.right ? (s(), r("div", I, [
|
|
219
|
+
o(e.$slots, "right")
|
|
220
|
+
])) : a("", !0)
|
|
179
221
|
], 2)
|
|
180
222
|
], 64)),
|
|
181
|
-
|
|
182
|
-
show:
|
|
183
|
-
"onUpdate:show":
|
|
223
|
+
h(O, {
|
|
224
|
+
show: m.value,
|
|
225
|
+
"onUpdate:show": t[2] || (t[2] = (u) => m.value = u),
|
|
184
226
|
position: "left",
|
|
185
227
|
size: "sm",
|
|
186
|
-
triggerClass:
|
|
187
|
-
class:
|
|
228
|
+
triggerClass: i.value.mobileTrigger,
|
|
229
|
+
class: d(["z-60", i.value.mobileTrigger])
|
|
188
230
|
}, {
|
|
189
|
-
header:
|
|
190
|
-
|
|
191
|
-
|
|
231
|
+
header: v(() => [
|
|
232
|
+
o(e.$slots, "logo", {}, () => [
|
|
233
|
+
t[7] || (t[7] = A("Brand", -1))
|
|
192
234
|
])
|
|
193
235
|
]),
|
|
194
|
-
default:
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
236
|
+
default: v(() => [
|
|
237
|
+
n("div", J, [
|
|
238
|
+
f.variant === "header" ? (s(), r("div", K, [
|
|
239
|
+
o(e.$slots, "mobile-menu", {}, () => [
|
|
240
|
+
o(e.$slots, "left"),
|
|
241
|
+
t[8] || (t[8] = n("div", { class: "h-px bg-border my-2" }, null, -1)),
|
|
242
|
+
o(e.$slots, "center")
|
|
201
243
|
])
|
|
202
|
-
])) : (
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
244
|
+
])) : (s(), r("div", Q, [
|
|
245
|
+
o(e.$slots, "left"),
|
|
246
|
+
o(e.$slots, "default"),
|
|
247
|
+
o(e.$slots, "center")
|
|
206
248
|
])),
|
|
207
|
-
s("div",
|
|
208
|
-
|
|
209
|
-
])
|
|
249
|
+
e.$slots?.right ? (s(), r("div", W, [
|
|
250
|
+
o(e.$slots, "right")
|
|
251
|
+
])) : a("", !0)
|
|
210
252
|
])
|
|
211
253
|
]),
|
|
212
254
|
_: 3
|
|
@@ -215,5 +257,5 @@ const A = { class: "flex items-center gap-4 shrink-0 z-10" }, O = { class: "shri
|
|
|
215
257
|
}
|
|
216
258
|
});
|
|
217
259
|
export {
|
|
218
|
-
|
|
260
|
+
oe as default
|
|
219
261
|
};
|