vlite3 1.2.1 → 1.2.2
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/AppShell/AppShellLayoutClassic.vue.js +67 -64
- package/components/AppShell/AppShellLayoutDashboard.vue.js +75 -70
- package/components/AppShell/AppShellLayoutDock.vue.js +27 -27
- package/components/AppShell/AppShellLayoutHeaderShell.vue.js +80 -75
- package/components/AppShell/AppShellLayoutSidebarFirst.vue.js +56 -56
- package/components/DataTable/DataTable.vue.d.ts +3 -3
- package/components/DataTable/DataTableRow.vue.d.ts +1 -1
- package/components/Form/CustomFields.vue.js +2 -2
- package/components/Form/CustomFields.vue2.js +15 -2
- package/components/Invoice/InvoiceVariant1.vue.js +225 -176
- package/components/Invoice/InvoiceVariant2.vue.js +174 -125
- package/components/Invoice/InvoiceVariant3.vue.js +186 -157
- package/components/Invoice/InvoiceVariant4.vue.js +200 -156
- package/components/Invoice/types.d.ts +10 -1
- package/components/List/ListFieldRow.vue.js +16 -16
- package/components/List/utils.d.ts +2 -2
- package/components/List/utils.js +6 -9
- package/components/NavbarCommandPalette.vue.js +1 -1
- package/components/Price/Price.vue.d.ts +2 -0
- package/components/Price/Price.vue.js +15 -12
- package/components/Screen/Screen.vue.d.ts +36 -10
- package/components/Screen/Screen.vue.js +398 -304
- package/components/Screen/components/ScreenToolbar.vue.d.ts +62 -0
- package/components/Screen/components/ScreenToolbar.vue.js +116 -0
- package/components/Screen/components/ScreenToolbar.vue2.js +4 -0
- package/components/Screen/types.d.ts +9 -0
- package/components/Stats/StatItem.vue.js +88 -87
- package/components/Stats/Stats.vue.js +20 -20
- package/components/Stats/types.d.ts +3 -1
- package/core/config.d.ts +10 -0
- package/core/config.js +11 -9
- package/index.js +131 -131
- package/package.json +1 -1
- package/style.css +1 -1
- package/types/config.type.d.ts +2 -0
- package/types/list.type.d.ts +4 -0
- package/utils/functions.d.ts +9 -10
- package/utils/functions.js +78 -63
|
@@ -1,70 +1,70 @@
|
|
|
1
|
-
import { defineComponent as B, inject as E, ref as
|
|
2
|
-
import { onClickOutside as
|
|
1
|
+
import { defineComponent as B, inject as E, ref as $, openBlock as a, createElementBlock as n, renderSlot as l, unref as e, createCommentVNode as b, createElementVNode as i, createVNode as u, Transition as L, withCtx as g, withDirectives as A, normalizeStyle as H, normalizeClass as d, Fragment as y, vShow as U, isRef as w, createBlock as D, createSlots as I, createTextVNode as Y } from "vue";
|
|
2
|
+
import { onClickOutside as j } from "@vueuse/core";
|
|
3
3
|
import C from "../Icon.vue.js";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import F from "../SidePanel.vue.js";
|
|
5
|
+
import K from "../Navbar/NavbarTabs.vue.js";
|
|
6
6
|
/* empty css */
|
|
7
|
-
import
|
|
7
|
+
import q from "../Breadcrumb/Breadcrumb.vue.js";
|
|
8
8
|
/* empty css */
|
|
9
|
-
import { APPSHELL_LAYOUT_KEY as
|
|
10
|
-
const
|
|
9
|
+
import { APPSHELL_LAYOUT_KEY as G } from "./useAppShell.js";
|
|
10
|
+
const J = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflow-hidden" }, Q = {
|
|
11
11
|
key: 0,
|
|
12
|
-
class: "w-full shrink-0 z-50 flex flex-col relative"
|
|
13
|
-
},
|
|
12
|
+
class: "w-full shrink-0 z-50 flex flex-col relative border-b"
|
|
13
|
+
}, W = { class: "flex flex-1 w-full overflow-hidden relative" }, X = { class: "flex items-center gap-4 shrink-0 z-10" }, Z = {
|
|
14
14
|
key: 0,
|
|
15
15
|
class: "shrink-0 w-full"
|
|
16
|
-
},
|
|
16
|
+
}, _ = {
|
|
17
17
|
class: "flex flex-col max-h-[80vh] overflow-y-auto scrollbar-thin",
|
|
18
18
|
style: { "will-change": "transform", contain: "layout style" }
|
|
19
|
-
},
|
|
19
|
+
}, ee = { class: "space-y-1 p-2" }, se = { class: "space-y-1 p-2" }, le = { class: "flex flex-col space-y-6 pt-4 h-full" }, oe = {
|
|
20
20
|
key: 0,
|
|
21
21
|
class: "flex flex-col space-y-1"
|
|
22
|
-
},
|
|
22
|
+
}, re = {
|
|
23
23
|
key: 1,
|
|
24
24
|
class: "flex flex-col space-y-4 flex-1 overflow-y-auto px-3.5! scrollbar-thin scrollbar-stable",
|
|
25
25
|
style: { "will-change": "transform", contain: "layout style" }
|
|
26
|
-
},
|
|
26
|
+
}, te = {
|
|
27
27
|
key: 2,
|
|
28
28
|
class: "mt-auto pt-2 border-t border-border px-3! py-2!"
|
|
29
|
-
},
|
|
29
|
+
}, ve = /* @__PURE__ */ B({
|
|
30
30
|
__name: "AppShellLayoutClassic",
|
|
31
|
-
setup(
|
|
32
|
-
const T = E(
|
|
31
|
+
setup(ae) {
|
|
32
|
+
const T = E(G), {
|
|
33
33
|
props: o,
|
|
34
34
|
sidebarHidden: S,
|
|
35
35
|
isMobileMenuOpen: r,
|
|
36
|
-
isSidebarVisible:
|
|
37
|
-
toggleSidebar:
|
|
38
|
-
pageTitle:
|
|
36
|
+
isSidebarVisible: z,
|
|
37
|
+
toggleSidebar: V,
|
|
38
|
+
pageTitle: R,
|
|
39
39
|
breadcrumbData: c,
|
|
40
40
|
breakpointClasses: f,
|
|
41
|
-
containerClasses:
|
|
41
|
+
containerClasses: x,
|
|
42
42
|
centerClasses: M,
|
|
43
43
|
nestedTabsItems: h,
|
|
44
44
|
activeNestedTab: p,
|
|
45
45
|
handleNestedTabClick: O,
|
|
46
46
|
mainScrollRef: N,
|
|
47
47
|
layoutMainRef: P
|
|
48
|
-
} = T, k =
|
|
49
|
-
return
|
|
48
|
+
} = T, k = $(null), v = $(null);
|
|
49
|
+
return j(
|
|
50
50
|
k,
|
|
51
51
|
() => {
|
|
52
52
|
r.value = !1;
|
|
53
53
|
},
|
|
54
54
|
{ ignore: [v] }
|
|
55
|
-
), (s, t) => (a(), n("div",
|
|
56
|
-
s.$slots.header ? (a(), n("header",
|
|
55
|
+
), (s, t) => (a(), n("div", J, [
|
|
56
|
+
s.$slots.header ? (a(), n("header", Q, [
|
|
57
57
|
l(s.$slots, "header", {
|
|
58
58
|
isOpen: e(r),
|
|
59
59
|
toggle: () => r.value = !e(r),
|
|
60
|
-
sidebarVisible: e(
|
|
61
|
-
toggleSidebar: e(
|
|
60
|
+
sidebarVisible: e(z),
|
|
61
|
+
toggleSidebar: e(V),
|
|
62
62
|
breadcrumbItems: e(c).items.value,
|
|
63
|
-
pageTitle: e(
|
|
63
|
+
pageTitle: e(R)
|
|
64
64
|
})
|
|
65
65
|
])) : b("", !0),
|
|
66
|
-
i("div",
|
|
67
|
-
|
|
66
|
+
i("div", W, [
|
|
67
|
+
u(L, {
|
|
68
68
|
"enter-active-class": "transition-all duration-300 ease-in-out overflow-hidden",
|
|
69
69
|
"leave-active-class": "transition-all duration-300 ease-in-out overflow-hidden",
|
|
70
70
|
"enter-from-class": "opacity-0",
|
|
@@ -74,14 +74,12 @@ const G = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflo
|
|
|
74
74
|
}, {
|
|
75
75
|
default: g(() => [
|
|
76
76
|
A(i("nav", {
|
|
77
|
-
class: d(e(
|
|
77
|
+
class: d(e(x)),
|
|
78
78
|
role: "navigation",
|
|
79
|
-
style: H(
|
|
80
|
-
e(o).sidebarToggle ? "transition: width 0.3s ease, opacity 0.3s ease;" : ""
|
|
81
|
-
)
|
|
79
|
+
style: H(e(o).sidebarToggle ? "transition: width 0.3s ease, opacity 0.3s ease;" : "")
|
|
82
80
|
}, [
|
|
83
81
|
e(o).variant === "header" ? (a(), n(y, { key: 0 }, [
|
|
84
|
-
i("div",
|
|
82
|
+
i("div", X, [
|
|
85
83
|
l(s.$slots, "mobile-trigger", {
|
|
86
84
|
isOpen: e(r),
|
|
87
85
|
toggle: () => r.value = !e(r)
|
|
@@ -91,9 +89,9 @@ const G = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflo
|
|
|
91
89
|
ref_key: "mobileTriggerRef",
|
|
92
90
|
ref: v,
|
|
93
91
|
class: d(["p-2 -ml-2 text-muted-foreground hover:bg-accent rounded-md shrink-0", [e(f).mobileTrigger, e(o).mobileTriggerClass]]),
|
|
94
|
-
onClick: t[0] || (t[0] = (
|
|
92
|
+
onClick: t[0] || (t[0] = (m) => r.value = !e(r))
|
|
95
93
|
}, [
|
|
96
|
-
|
|
94
|
+
u(C, {
|
|
97
95
|
icon: "lucide:menu",
|
|
98
96
|
class: "w-5 h-5"
|
|
99
97
|
}),
|
|
@@ -137,9 +135,9 @@ const G = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflo
|
|
|
137
135
|
ref_key: "mobileTriggerRef",
|
|
138
136
|
ref: v,
|
|
139
137
|
class: d(["p-2 -mr-2 text-muted-foreground hover:bg-accent rounded-md", e(o).mobileTriggerClass]),
|
|
140
|
-
onClick: t[1] || (t[1] = (
|
|
138
|
+
onClick: t[1] || (t[1] = (m) => r.value = !e(r))
|
|
141
139
|
}, [
|
|
142
|
-
|
|
140
|
+
u(C, {
|
|
143
141
|
icon: "lucide:menu",
|
|
144
142
|
class: "w-5 h-5"
|
|
145
143
|
}),
|
|
@@ -178,10 +176,10 @@ const G = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflo
|
|
|
178
176
|
ref: P,
|
|
179
177
|
class: "flex-1 overflow-y-auto w-full relative h-full flex flex-col scrollbar-thin scrollbar-stable"
|
|
180
178
|
}, [
|
|
181
|
-
e(o).renderNestedTabs && e(h).length > 0 ? (a(), n("div",
|
|
182
|
-
|
|
179
|
+
e(o).renderNestedTabs && e(h).length > 0 ? (a(), n("div", Z, [
|
|
180
|
+
u(K, {
|
|
183
181
|
modelValue: e(p),
|
|
184
|
-
"onUpdate:modelValue": t[2] || (t[2] = (
|
|
182
|
+
"onUpdate:modelValue": t[2] || (t[2] = (m) => w(p) ? p.value = m : null),
|
|
185
183
|
onChange: e(O),
|
|
186
184
|
items: e(h)
|
|
187
185
|
}, null, 8, ["modelValue", "onChange", "items"])
|
|
@@ -190,7 +188,7 @@ const G = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflo
|
|
|
190
188
|
key: 1,
|
|
191
189
|
class: d(["shrink-0 w-full border-b border-border px-6 py-2", e(o).breadcrumbClass])
|
|
192
190
|
}, [
|
|
193
|
-
|
|
191
|
+
u(e(q), {
|
|
194
192
|
items: e(c).items.value,
|
|
195
193
|
variant: e(o).breadcrumbVariant,
|
|
196
194
|
separator: e(o).breadcrumbSeparator,
|
|
@@ -211,66 +209,71 @@ const G = { class: "vlite-app-layout flex flex-col w-full h-full bg-body overflo
|
|
|
211
209
|
key: 0,
|
|
212
210
|
ref_key: "mobileMenuRef",
|
|
213
211
|
ref: k,
|
|
214
|
-
class: d(["absolute top-[calc(100%_+_1px)] left-0 w-full bg-body border border-border
|
|
212
|
+
class: d(["absolute top-[calc(100%_+_1px)] left-0 w-full bg-body border border-border shadow-xl z-50 flex flex-col transition-all duration-300 origin-top overflow-hidden will-change-transform", e(o).menuClass])
|
|
215
213
|
}, [
|
|
216
|
-
i("div",
|
|
214
|
+
i("div", _, [
|
|
217
215
|
l(s.$slots, "mobile-menu", {}, () => [
|
|
218
|
-
i("div",
|
|
216
|
+
i("div", ee, [
|
|
219
217
|
l(s.$slots, "left")
|
|
220
218
|
]),
|
|
221
|
-
t[6] || (t[6] = i("div", { class: "h-px bg-border
|
|
222
|
-
i("div",
|
|
219
|
+
t[6] || (t[6] = i("div", { class: "h-px bg-border my-1 mx-2" }, null, -1)),
|
|
220
|
+
i("div", se, [
|
|
223
221
|
l(s.$slots, "center")
|
|
224
222
|
])
|
|
225
223
|
])
|
|
226
224
|
])
|
|
227
225
|
], 2)) : b("", !0)
|
|
228
|
-
], 64)) : (a(), D(
|
|
226
|
+
], 64)) : (a(), D(F, {
|
|
229
227
|
key: 2,
|
|
230
228
|
show: e(r),
|
|
231
|
-
"onUpdate:show": t[3] || (t[3] = (
|
|
229
|
+
"onUpdate:show": t[3] || (t[3] = (m) => w(r) ? r.value = m : null),
|
|
232
230
|
position: "left",
|
|
233
231
|
size: "sm",
|
|
234
232
|
triggerClass: e(f).mobileTrigger,
|
|
235
233
|
class: d(["z-60", e(f).mobileTrigger]),
|
|
236
234
|
headerClass: "pl-3! pr-4.5! py-3!",
|
|
237
235
|
bodyClass: "p-0!"
|
|
238
|
-
}, {
|
|
239
|
-
header: g(() => [
|
|
240
|
-
l(s.$slots, "mobile-sidebar-header", {}, () => [
|
|
241
|
-
l(s.$slots, "sidebar-header", {}, () => [
|
|
242
|
-
t[7] || (t[7] = I("Brand", -1))
|
|
243
|
-
])
|
|
244
|
-
])
|
|
245
|
-
]),
|
|
236
|
+
}, I({
|
|
246
237
|
default: g(() => [
|
|
247
|
-
i("div",
|
|
248
|
-
e(o).variant === "header" ? (a(), n("div",
|
|
238
|
+
i("div", le, [
|
|
239
|
+
e(o).variant === "header" ? (a(), n("div", oe, [
|
|
249
240
|
l(s.$slots, "mobile-menu", {}, () => [
|
|
250
241
|
l(s.$slots, "left"),
|
|
251
242
|
t[8] || (t[8] = i("div", { class: "h-px bg-border my-2" }, null, -1)),
|
|
252
243
|
l(s.$slots, "center")
|
|
253
244
|
])
|
|
254
|
-
])) : (a(), n("div",
|
|
245
|
+
])) : (a(), n("div", re, [
|
|
255
246
|
l(s.$slots, "left"),
|
|
256
247
|
l(s.$slots, "mobile-sidebar", {}, () => [
|
|
257
248
|
l(s.$slots, "sidebar")
|
|
258
249
|
]),
|
|
259
250
|
l(s.$slots, "center")
|
|
260
251
|
])),
|
|
261
|
-
s.$slots?.["mobile-sidebar-footer"] || s.$slots?.["sidebar-footer"] ? (a(), n("div",
|
|
252
|
+
s.$slots?.["mobile-sidebar-footer"] || s.$slots?.["sidebar-footer"] ? (a(), n("div", te, [
|
|
262
253
|
l(s.$slots, "mobile-sidebar-footer", {}, () => [
|
|
263
254
|
l(s.$slots, "sidebar-footer")
|
|
264
255
|
])
|
|
265
256
|
])) : b("", !0)
|
|
266
257
|
])
|
|
267
258
|
]),
|
|
268
|
-
_:
|
|
269
|
-
},
|
|
259
|
+
_: 2
|
|
260
|
+
}, [
|
|
261
|
+
s.$slots["mobile-sidebar-header"] || s.$slots["sidebar-header"] ? {
|
|
262
|
+
name: "header",
|
|
263
|
+
fn: g(() => [
|
|
264
|
+
l(s.$slots, "mobile-sidebar-header", {}, () => [
|
|
265
|
+
l(s.$slots, "sidebar-header", {}, () => [
|
|
266
|
+
t[7] || (t[7] = Y("Brand", -1))
|
|
267
|
+
])
|
|
268
|
+
])
|
|
269
|
+
]),
|
|
270
|
+
key: "0"
|
|
271
|
+
} : void 0
|
|
272
|
+
]), 1032, ["show", "triggerClass", "class"]))
|
|
270
273
|
])
|
|
271
274
|
]));
|
|
272
275
|
}
|
|
273
276
|
});
|
|
274
277
|
export {
|
|
275
|
-
|
|
278
|
+
ve as default
|
|
276
279
|
};
|
|
@@ -1,36 +1,36 @@
|
|
|
1
|
-
import { defineComponent as V, inject as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import { defineComponent as V, inject as z, openBlock as a, createElementBlock as o, createVNode as m, Transition as N, withCtx as p, withDirectives as _, createElementVNode as n, normalizeClass as b, unref as e, renderSlot as l, createCommentVNode as t, vShow as R, isRef as g, createSlots as B, createTextVNode as E } from "vue";
|
|
2
|
+
import L from "../SidePanel.vue.js";
|
|
3
|
+
import M from "../Navbar/NavbarTabs.vue.js";
|
|
4
4
|
/* empty css */
|
|
5
|
-
import
|
|
5
|
+
import P from "../Breadcrumb/Breadcrumb.vue.js";
|
|
6
6
|
import "@iconify/vue";
|
|
7
7
|
/* empty css */
|
|
8
|
-
import { APPSHELL_LAYOUT_KEY as
|
|
9
|
-
const
|
|
8
|
+
import { APPSHELL_LAYOUT_KEY as A } from "./useAppShell.js";
|
|
9
|
+
const D = { class: "vlite-app-layout flex flex-row w-full h-full bg-muted/20 p-0 sm:p-2.5 gap-0 sm:gap-2.5 overflow-hidden" }, O = {
|
|
10
10
|
key: 0,
|
|
11
|
-
class: "flex items-center
|
|
12
|
-
},
|
|
11
|
+
class: "flex items-center"
|
|
12
|
+
}, U = { class: "flex flex-col flex-1 min-w-0 h-full overflow-hidden bg-background rounded-xl max-sm:rounded-none border border-border max-sm:border-0 shadow-sm" }, H = {
|
|
13
13
|
key: 0,
|
|
14
|
-
class: "w-full shrink-0 z-20 bg-background border-b border-border
|
|
15
|
-
},
|
|
14
|
+
class: "w-full shrink-0 z-20 bg-background border-b border-border"
|
|
15
|
+
}, I = {
|
|
16
16
|
key: 0,
|
|
17
|
-
class: "shrink-0 w-full
|
|
18
|
-
},
|
|
17
|
+
class: "shrink-0 w-full"
|
|
18
|
+
}, Y = { class: "flex flex-col h-full" }, j = {
|
|
19
19
|
class: "flex-1 overflow-y-auto px-3.5 pt-4 scrollbar-thin scrollbar-stable",
|
|
20
20
|
style: { "will-change": "transform", contain: "layout style" }
|
|
21
|
-
},
|
|
21
|
+
}, K = {
|
|
22
22
|
key: 0,
|
|
23
|
-
class: "mt-auto
|
|
24
|
-
},
|
|
23
|
+
class: "mt-auto"
|
|
24
|
+
}, se = /* @__PURE__ */ V({
|
|
25
25
|
__name: "AppShellLayoutDashboard",
|
|
26
|
-
setup(
|
|
27
|
-
const y =
|
|
28
|
-
props:
|
|
26
|
+
setup(q) {
|
|
27
|
+
const y = z(A), {
|
|
28
|
+
props: r,
|
|
29
29
|
sidebarHidden: w,
|
|
30
30
|
isMobileMenuOpen: i,
|
|
31
31
|
isSidebarVisible: k,
|
|
32
|
-
toggleSidebar:
|
|
33
|
-
pageTitle:
|
|
32
|
+
toggleSidebar: $,
|
|
33
|
+
pageTitle: x,
|
|
34
34
|
breadcrumbData: u,
|
|
35
35
|
breakpointClasses: f,
|
|
36
36
|
nestedTabsItems: v,
|
|
@@ -39,8 +39,8 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-muted/20 p-0
|
|
|
39
39
|
mainScrollRef: S,
|
|
40
40
|
layoutMainRef: T
|
|
41
41
|
} = y;
|
|
42
|
-
return (
|
|
43
|
-
m(
|
|
42
|
+
return (s, d) => (a(), o("div", D, [
|
|
43
|
+
m(N, {
|
|
44
44
|
"enter-active-class": "transition-all duration-300 ease-in-out",
|
|
45
45
|
"leave-active-class": "transition-all duration-300 ease-in-out",
|
|
46
46
|
"enter-from-class": "opacity-0 -translate-x-2",
|
|
@@ -48,30 +48,30 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-muted/20 p-0
|
|
|
48
48
|
"leave-from-class": "opacity-100 translate-x-0",
|
|
49
49
|
"leave-to-class": "opacity-0 -translate-x-2"
|
|
50
50
|
}, {
|
|
51
|
-
default:
|
|
52
|
-
|
|
51
|
+
default: p(() => [
|
|
52
|
+
_(n("nav", {
|
|
53
53
|
class: b([
|
|
54
|
-
"shrink-0 h-full flex flex-col bg-background rounded-xl max-sm:rounded-none border border-border
|
|
54
|
+
"shrink-0 h-full flex flex-col bg-background rounded-xl max-sm:rounded-none border border-border max-sm:border-0 shadow-sm overflow-hidden z-30",
|
|
55
55
|
e(f).mobileTrigger === "md:hidden" ? "max-md:hidden" : "",
|
|
56
|
-
e(
|
|
56
|
+
e(r).class
|
|
57
57
|
]),
|
|
58
58
|
role: "navigation",
|
|
59
59
|
"aria-label": "Sidebar"
|
|
60
60
|
}, [
|
|
61
|
-
|
|
62
|
-
s
|
|
61
|
+
s.$slots["sidebar-header"] ? (a(), o("div", O, [
|
|
62
|
+
l(s.$slots, "sidebar-header")
|
|
63
63
|
])) : t("", !0),
|
|
64
64
|
n("div", {
|
|
65
|
-
class: b(["flex-1 overflow-y-auto overflow-x-hidden scrollbar-thin scrollbar-stable", e(
|
|
65
|
+
class: b(["flex-1 overflow-y-auto overflow-x-hidden scrollbar-thin scrollbar-stable", e(r).contentClass]),
|
|
66
66
|
style: { "will-change": "transform", contain: "layout style" }
|
|
67
67
|
}, [
|
|
68
|
-
s
|
|
68
|
+
l(s.$slots, "sidebar")
|
|
69
69
|
], 2),
|
|
70
|
-
|
|
70
|
+
s.$slots["sidebar-footer"] ? (a(), o("div", {
|
|
71
71
|
key: 1,
|
|
72
|
-
class: b(["shrink-0 bg-transparent
|
|
72
|
+
class: b(["shrink-0 bg-transparent", e(r).rightClass])
|
|
73
73
|
}, [
|
|
74
|
-
s
|
|
74
|
+
l(s.$slots, "sidebar-footer")
|
|
75
75
|
], 2)) : t("", !0)
|
|
76
76
|
], 2), [
|
|
77
77
|
[R, !e(w)]
|
|
@@ -79,40 +79,40 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-muted/20 p-0
|
|
|
79
79
|
]),
|
|
80
80
|
_: 3
|
|
81
81
|
}),
|
|
82
|
-
n("div",
|
|
83
|
-
|
|
84
|
-
s
|
|
82
|
+
n("div", U, [
|
|
83
|
+
s.$slots.header ? (a(), o("header", H, [
|
|
84
|
+
l(s.$slots, "header", {
|
|
85
85
|
isOpen: e(i),
|
|
86
86
|
toggle: () => i.value = !e(i),
|
|
87
87
|
sidebarVisible: e(k),
|
|
88
|
-
toggleSidebar: e(
|
|
88
|
+
toggleSidebar: e($),
|
|
89
89
|
breadcrumbItems: e(u).items.value,
|
|
90
|
-
pageTitle: e(
|
|
90
|
+
pageTitle: e(x)
|
|
91
91
|
})
|
|
92
92
|
])) : t("", !0),
|
|
93
|
-
|
|
93
|
+
s.$slots.main ? (a(), o("main", {
|
|
94
94
|
key: 1,
|
|
95
95
|
ref_key: "layoutMainRef",
|
|
96
96
|
ref: T,
|
|
97
97
|
class: "flex-1 overflow-y-auto w-full relative h-full flex flex-col min-h-0 scrollbar-thin scrollbar-stable"
|
|
98
98
|
}, [
|
|
99
|
-
e(
|
|
100
|
-
m(
|
|
99
|
+
e(r).renderNestedTabs && e(v).length > 0 ? (a(), o("div", I, [
|
|
100
|
+
m(M, {
|
|
101
101
|
modelValue: e(c),
|
|
102
|
-
"onUpdate:modelValue": d[0] || (d[0] = (
|
|
102
|
+
"onUpdate:modelValue": d[0] || (d[0] = (h) => g(c) ? c.value = h : null),
|
|
103
103
|
onChange: e(C),
|
|
104
104
|
items: e(v)
|
|
105
105
|
}, null, 8, ["modelValue", "onChange", "items"])
|
|
106
106
|
])) : t("", !0),
|
|
107
|
-
e(
|
|
107
|
+
e(r).breadcrumb && e(r).breadcrumbPosition === "main" && e(u).items.value.length > 1 ? (a(), o("div", {
|
|
108
108
|
key: 1,
|
|
109
|
-
class: b(["shrink-0 w-full px-6 py-2 border-b border-border
|
|
109
|
+
class: b(["shrink-0 w-full px-6 py-2 border-b border-border", e(r).breadcrumbClass])
|
|
110
110
|
}, [
|
|
111
|
-
m(e(
|
|
111
|
+
m(e(P), {
|
|
112
112
|
items: e(u).items.value,
|
|
113
|
-
variant: e(
|
|
114
|
-
separator: e(
|
|
115
|
-
size: e(
|
|
113
|
+
variant: e(r).breadcrumbVariant,
|
|
114
|
+
separator: e(r).breadcrumbSeparator,
|
|
115
|
+
size: e(r).breadcrumbSize
|
|
116
116
|
}, null, 8, ["items", "variant", "separator", "size"])
|
|
117
117
|
], 2)) : t("", !0),
|
|
118
118
|
n("div", {
|
|
@@ -121,46 +121,51 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-muted/20 p-0
|
|
|
121
121
|
style: { "will-change": "transform", contain: "layout style" },
|
|
122
122
|
class: "flex-1 overflow-y-auto pt-2 w-full relative h-full scrollbar-thin scrollbar-stable"
|
|
123
123
|
}, [
|
|
124
|
-
s
|
|
124
|
+
l(s.$slots, "main")
|
|
125
125
|
], 512)
|
|
126
126
|
], 512)) : t("", !0)
|
|
127
127
|
]),
|
|
128
|
-
m(
|
|
128
|
+
m(L, {
|
|
129
129
|
show: e(i),
|
|
130
|
-
"onUpdate:show": d[1] || (d[1] = (
|
|
130
|
+
"onUpdate:show": d[1] || (d[1] = (h) => g(i) ? i.value = h : null),
|
|
131
131
|
position: "left",
|
|
132
132
|
size: "sm",
|
|
133
133
|
triggerClass: e(f).mobileTrigger,
|
|
134
134
|
class: b(["z-60", e(f).mobileTrigger]),
|
|
135
135
|
headerClass: "pl-3! pr-4.5! py-3!",
|
|
136
136
|
bodyClass: "p-0!"
|
|
137
|
-
}, {
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
])
|
|
144
|
-
]),
|
|
145
|
-
default: h(() => [
|
|
146
|
-
n("div", I, [
|
|
147
|
-
n("div", Y, [
|
|
148
|
-
s(r.$slots, "mobile-sidebar", {}, () => [
|
|
149
|
-
s(r.$slots, "sidebar")
|
|
137
|
+
}, B({
|
|
138
|
+
default: p(() => [
|
|
139
|
+
n("div", Y, [
|
|
140
|
+
n("div", j, [
|
|
141
|
+
l(s.$slots, "mobile-sidebar", {}, () => [
|
|
142
|
+
l(s.$slots, "sidebar")
|
|
150
143
|
])
|
|
151
144
|
]),
|
|
152
|
-
|
|
153
|
-
s
|
|
154
|
-
s
|
|
145
|
+
s.$slots["mobile-sidebar-footer"] || s.$slots["sidebar-footer"] ? (a(), o("div", K, [
|
|
146
|
+
l(s.$slots, "mobile-sidebar-footer", {}, () => [
|
|
147
|
+
l(s.$slots, "sidebar-footer")
|
|
155
148
|
])
|
|
156
149
|
])) : t("", !0)
|
|
157
150
|
])
|
|
158
151
|
]),
|
|
159
|
-
_:
|
|
160
|
-
},
|
|
152
|
+
_: 2
|
|
153
|
+
}, [
|
|
154
|
+
s.$slots["mobile-sidebar-header"] || s.$slots["sidebar-header"] ? {
|
|
155
|
+
name: "header",
|
|
156
|
+
fn: p(() => [
|
|
157
|
+
l(s.$slots, "mobile-sidebar-header", {}, () => [
|
|
158
|
+
l(s.$slots, "sidebar-header", {}, () => [
|
|
159
|
+
d[2] || (d[2] = E("Brand", -1))
|
|
160
|
+
])
|
|
161
|
+
])
|
|
162
|
+
]),
|
|
163
|
+
key: "0"
|
|
164
|
+
} : void 0
|
|
165
|
+
]), 1032, ["show", "triggerClass", "class"])
|
|
161
166
|
]));
|
|
162
167
|
}
|
|
163
168
|
});
|
|
164
169
|
export {
|
|
165
|
-
|
|
170
|
+
se as default
|
|
166
171
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as V, inject as _, openBlock as
|
|
1
|
+
import { defineComponent as V, inject as _, openBlock as a, createElementBlock as o, createVNode as m, Transition as z, withCtx as h, withDirectives as N, createElementVNode as n, normalizeClass as b, unref as e, renderSlot as r, createCommentVNode as t, vShow as R, isRef as v, createTextVNode as B } from "vue";
|
|
2
2
|
import E from "../SidePanel.vue.js";
|
|
3
3
|
import L from "../Navbar/NavbarTabs.vue.js";
|
|
4
4
|
/* empty css */
|
|
@@ -8,13 +8,13 @@ import "@iconify/vue";
|
|
|
8
8
|
import { APPSHELL_LAYOUT_KEY as P } from "./useAppShell.js";
|
|
9
9
|
const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p-0 sm:p-2 gap-0 sm:gap-2 overflow-hidden items-stretch" }, D = {
|
|
10
10
|
key: 0,
|
|
11
|
-
class: "flex items-center justify-center
|
|
12
|
-
}, O = { class: "flex flex-col flex-1 min-w-0 h-full overflow-hidden bg-background rounded-xl max-sm:rounded-none border border-border
|
|
11
|
+
class: "flex items-center justify-center w-full"
|
|
12
|
+
}, O = { class: "flex flex-col flex-1 min-w-0 h-full overflow-hidden bg-background rounded-xl max-sm:rounded-none border border-border max-sm:border-0 shadow-sm" }, U = {
|
|
13
13
|
key: 0,
|
|
14
|
-
class: "w-full shrink-0 z-20 bg-background border-b border-border
|
|
14
|
+
class: "w-full shrink-0 z-20 bg-background border-b border-border"
|
|
15
15
|
}, j = {
|
|
16
16
|
key: 0,
|
|
17
|
-
class: "shrink-0 w-full border-b border-border
|
|
17
|
+
class: "shrink-0 w-full border-b border-border"
|
|
18
18
|
}, H = { class: "flex flex-col h-full" }, I = {
|
|
19
19
|
class: "flex-1 overflow-y-auto px-3.5 pt-4 scrollbar-thin scrollbar-stable",
|
|
20
20
|
style: { "will-change": "transform", contain: "layout style" }
|
|
@@ -39,7 +39,7 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
39
39
|
mainScrollRef: S,
|
|
40
40
|
layoutMainRef: T
|
|
41
41
|
} = y;
|
|
42
|
-
return (
|
|
42
|
+
return (s, d) => (a(), o("div", A, [
|
|
43
43
|
m(z, {
|
|
44
44
|
"enter-active-class": "transition-all duration-300 ease-in-out",
|
|
45
45
|
"leave-active-class": "transition-all duration-300 ease-in-out",
|
|
@@ -51,26 +51,26 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
51
51
|
default: h(() => [
|
|
52
52
|
N(n("nav", {
|
|
53
53
|
class: b([
|
|
54
|
-
"shrink-0 self-center flex flex-col items-center bg-background rounded-2xl max-sm:rounded-none border border-border
|
|
54
|
+
"shrink-0 self-center flex flex-col items-center bg-background rounded-2xl max-sm:rounded-none border border-border max-sm:border-0 shadow-sm overflow-hidden z-30 py-3 px-2 gap-0.5",
|
|
55
55
|
e(c).mobileTrigger === "md:hidden" ? "max-md:hidden" : "",
|
|
56
56
|
e(l).class
|
|
57
57
|
]),
|
|
58
58
|
role: "navigation",
|
|
59
59
|
"aria-label": "Sidebar dock"
|
|
60
60
|
}, [
|
|
61
|
-
|
|
62
|
-
s
|
|
61
|
+
s.$slots["sidebar-header"] ? (a(), o("div", D, [
|
|
62
|
+
r(s.$slots, "sidebar-header")
|
|
63
63
|
])) : t("", !0),
|
|
64
64
|
n("div", {
|
|
65
65
|
class: b(["flex flex-col items-center gap-0.5 w-full", e(l).contentClass])
|
|
66
66
|
}, [
|
|
67
|
-
s
|
|
67
|
+
r(s.$slots, "sidebar")
|
|
68
68
|
], 2),
|
|
69
|
-
|
|
69
|
+
s.$slots["sidebar-footer"] ? (a(), o("div", {
|
|
70
70
|
key: 1,
|
|
71
|
-
class: b(["flex flex-col items-center
|
|
71
|
+
class: b(["flex flex-col items-center w-full", e(l).rightClass])
|
|
72
72
|
}, [
|
|
73
|
-
s
|
|
73
|
+
r(s.$slots, "sidebar-footer")
|
|
74
74
|
], 2)) : t("", !0)
|
|
75
75
|
], 2), [
|
|
76
76
|
[R, !e(w)]
|
|
@@ -79,8 +79,8 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
79
79
|
_: 3
|
|
80
80
|
}),
|
|
81
81
|
n("div", O, [
|
|
82
|
-
|
|
83
|
-
s
|
|
82
|
+
s.$slots.header ? (a(), o("header", U, [
|
|
83
|
+
r(s.$slots, "header", {
|
|
84
84
|
isOpen: e(i),
|
|
85
85
|
toggle: () => i.value = !e(i),
|
|
86
86
|
sidebarVisible: e(k),
|
|
@@ -89,13 +89,13 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
89
89
|
pageTitle: e($)
|
|
90
90
|
})
|
|
91
91
|
])) : t("", !0),
|
|
92
|
-
|
|
92
|
+
s.$slots.main ? (a(), o("main", {
|
|
93
93
|
key: 1,
|
|
94
94
|
ref_key: "layoutMainRef",
|
|
95
95
|
ref: T,
|
|
96
96
|
class: "flex-1 overflow-y-auto w-full relative h-full flex flex-col min-h-0 scrollbar-thin scrollbar-stable"
|
|
97
97
|
}, [
|
|
98
|
-
e(l).renderNestedTabs && e(g).length > 0 ? (
|
|
98
|
+
e(l).renderNestedTabs && e(g).length > 0 ? (a(), o("div", j, [
|
|
99
99
|
m(L, {
|
|
100
100
|
modelValue: e(f),
|
|
101
101
|
"onUpdate:modelValue": d[0] || (d[0] = (p) => v(f) ? f.value = p : null),
|
|
@@ -103,9 +103,9 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
103
103
|
items: e(g)
|
|
104
104
|
}, null, 8, ["modelValue", "onChange", "items"])
|
|
105
105
|
])) : t("", !0),
|
|
106
|
-
e(l).breadcrumb && e(l).breadcrumbPosition === "main" && e(u).items.value.length > 1 ? (
|
|
106
|
+
e(l).breadcrumb && e(l).breadcrumbPosition === "main" && e(u).items.value.length > 1 ? (a(), o("div", {
|
|
107
107
|
key: 1,
|
|
108
|
-
class: b(["shrink-0 w-full px-6 py-2 border-b border-border
|
|
108
|
+
class: b(["shrink-0 w-full px-6 py-2 border-b border-border", e(l).breadcrumbClass])
|
|
109
109
|
}, [
|
|
110
110
|
m(e(M), {
|
|
111
111
|
items: e(u).items.value,
|
|
@@ -120,7 +120,7 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
120
120
|
style: { "will-change": "transform", contain: "layout style" },
|
|
121
121
|
class: "flex-1 overflow-y-auto w-full relative h-full scrollbar-thin scrollbar-stable"
|
|
122
122
|
}, [
|
|
123
|
-
s
|
|
123
|
+
r(s.$slots, "main")
|
|
124
124
|
], 512)
|
|
125
125
|
], 512)) : t("", !0)
|
|
126
126
|
]),
|
|
@@ -135,8 +135,8 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
135
135
|
bodyClass: "p-0!"
|
|
136
136
|
}, {
|
|
137
137
|
header: h(() => [
|
|
138
|
-
s
|
|
139
|
-
s
|
|
138
|
+
r(s.$slots, "mobile-sidebar-header", {}, () => [
|
|
139
|
+
r(s.$slots, "sidebar-header", {}, () => [
|
|
140
140
|
d[2] || (d[2] = B("Brand", -1))
|
|
141
141
|
])
|
|
142
142
|
])
|
|
@@ -144,13 +144,13 @@ const A = { class: "vlite-app-layout flex flex-row w-full h-full bg-background p
|
|
|
144
144
|
default: h(() => [
|
|
145
145
|
n("div", H, [
|
|
146
146
|
n("div", I, [
|
|
147
|
-
s
|
|
148
|
-
s
|
|
147
|
+
r(s.$slots, "mobile-sidebar", {}, () => [
|
|
148
|
+
r(s.$slots, "sidebar")
|
|
149
149
|
])
|
|
150
150
|
]),
|
|
151
|
-
|
|
152
|
-
s
|
|
153
|
-
s
|
|
151
|
+
s.$slots["mobile-sidebar-footer"] || s.$slots["sidebar-footer"] ? (a(), o("div", Y, [
|
|
152
|
+
r(s.$slots, "mobile-sidebar-footer", {}, () => [
|
|
153
|
+
r(s.$slots, "sidebar-footer")
|
|
154
154
|
])
|
|
155
155
|
])) : t("", !0)
|
|
156
156
|
])
|