paket-ui 0.1.0 → 0.1.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/dist/module.json +1 -1
- package/dist/module.mjs +7 -0
- package/dist/runtime/assets/main.css +1 -1
- package/dist/runtime/components/app.d.vue.ts +13 -0
- package/dist/runtime/components/app.vue +10 -0
- package/dist/runtime/components/app.vue.d.ts +13 -0
- package/dist/runtime/components/badge/index.js +1 -1
- package/dist/runtime/components/breadcrumb/Breadcrumb.d.vue.ts +11 -0
- package/dist/runtime/components/breadcrumb/Breadcrumb.vue +35 -0
- package/dist/runtime/components/breadcrumb/Breadcrumb.vue.d.ts +11 -0
- package/dist/runtime/components/button/Button.d.vue.ts +5 -3
- package/dist/runtime/components/button/Button.vue +3 -1
- package/dist/runtime/components/button/Button.vue.d.ts +5 -3
- package/dist/runtime/components/button/variant.d.ts +7 -1
- package/dist/runtime/components/button/variant.js +8 -2
- package/dist/runtime/components/chat/Reply.d.vue.ts +1 -1
- package/dist/runtime/components/chat/Reply.vue +2 -2
- package/dist/runtime/components/chat/Reply.vue.d.ts +1 -1
- package/dist/runtime/components/chip/Chip.vue +1 -1
- package/dist/runtime/components/combobox/Combobox.d.vue.ts +1 -1
- package/dist/runtime/components/combobox/Combobox.vue.d.ts +1 -1
- package/dist/runtime/components/dialog/DialogConfirmationSingle.d.vue.ts +2 -2
- package/dist/runtime/components/dialog/DialogConfirmationSingle.vue.d.ts +2 -2
- package/dist/runtime/components/divider/Divider.vue +3 -3
- package/dist/runtime/components/editor/Editor.vue +1 -1
- package/dist/runtime/components/editor/EditorBar.vue +2 -2
- package/dist/runtime/components/file/AddFile.vue +1 -1
- package/dist/runtime/components/file/InputMultiple.vue +1 -1
- package/dist/runtime/components/file/ViewFile.vue +1 -1
- package/dist/runtime/components/input/InputField.d.vue.ts +2 -2
- package/dist/runtime/components/input/InputField.vue.d.ts +2 -2
- package/dist/runtime/components/input/InputFieldPassword.d.vue.ts +3 -3
- package/dist/runtime/components/input/InputFieldPassword.vue.d.ts +3 -3
- package/dist/runtime/components/input/InputFileDropable.vue +1 -1
- package/dist/runtime/components/input/InputOtp.vue +1 -1
- package/dist/runtime/components/loading/LoadingIndicator.vue +1 -1
- package/dist/runtime/components/navbar/Navbar.d.vue.ts +13 -0
- package/dist/runtime/components/navbar/Navbar.vue +56 -0
- package/dist/runtime/components/navbar/Navbar.vue.d.ts +13 -0
- package/dist/runtime/components/navbar/NavbarMenus.d.vue.ts +19 -0
- package/dist/runtime/components/navbar/NavbarMenus.vue +34 -0
- package/dist/runtime/components/navbar/NavbarMenus.vue.d.ts +19 -0
- package/dist/runtime/components/navbar/NavbarSearch.d.vue.ts +18 -0
- package/dist/runtime/components/navbar/NavbarSearch.vue +78 -0
- package/dist/runtime/components/navbar/NavbarSearch.vue.d.ts +18 -0
- package/dist/runtime/components/navbar/NavbarSearchInput.d.vue.ts +133 -0
- package/dist/runtime/components/navbar/NavbarSearchInput.vue +54 -0
- package/dist/runtime/components/navbar/NavbarSearchInput.vue.d.ts +133 -0
- package/dist/runtime/components/navbar/NavbarSearchResults.d.vue.ts +11 -0
- package/dist/runtime/components/navbar/NavbarSearchResults.vue +34 -0
- package/dist/runtime/components/navbar/NavbarSearchResults.vue.d.ts +11 -0
- package/dist/runtime/components/page/Dashboard.d.vue.ts +18 -0
- package/dist/runtime/components/page/Dashboard.vue +31 -0
- package/dist/runtime/components/page/Dashboard.vue.d.ts +18 -0
- package/dist/runtime/components/page/PageHeader.d.vue.ts +26 -0
- package/dist/runtime/components/page/PageHeader.vue +60 -0
- package/dist/runtime/components/page/PageHeader.vue.d.ts +26 -0
- package/dist/runtime/components/player/Video.vue +5 -1
- package/dist/runtime/components/radio/Courier.vue +2 -2
- package/dist/runtime/components/radio/RadioCourierBadge.vue +1 -1
- package/dist/runtime/components/range-picker/RangePicker.vue +1 -1
- package/dist/runtime/components/select/Select.vue +1 -1
- package/dist/runtime/components/select/SelectWithInput.vue +1 -1
- package/dist/runtime/components/sidebar/Sidebar.d.vue.ts +26 -0
- package/dist/runtime/components/sidebar/Sidebar.vue +68 -0
- package/dist/runtime/components/sidebar/Sidebar.vue.d.ts +26 -0
- package/dist/runtime/components/sidebar/SidebarChild.d.vue.ts +8 -0
- package/dist/runtime/components/sidebar/SidebarChild.vue +64 -0
- package/dist/runtime/components/sidebar/SidebarChild.vue.d.ts +8 -0
- package/dist/runtime/components/sidebar/SidebarCollapse.d.vue.ts +6 -0
- package/dist/runtime/components/sidebar/SidebarCollapse.vue +31 -0
- package/dist/runtime/components/sidebar/SidebarCollapse.vue.d.ts +6 -0
- package/dist/runtime/components/sidebar/SidebarMenu.d.vue.ts +16 -0
- package/dist/runtime/components/sidebar/SidebarMenu.vue +20 -0
- package/dist/runtime/components/sidebar/SidebarMenu.vue.d.ts +16 -0
- package/dist/runtime/components/sidebar/SidebarParent.d.vue.ts +7 -0
- package/dist/runtime/components/sidebar/SidebarParent.vue +182 -0
- package/dist/runtime/components/sidebar/SidebarParent.vue.d.ts +7 -0
- package/dist/runtime/components/toast/ToastCard.vue +1 -1
- package/dist/runtime/components/toast/ToastContainer.vue +1 -1
- package/dist/runtime/composables/useDevice.d.ts +4 -0
- package/dist/runtime/composables/useDevice.js +10 -0
- package/dist/runtime/composables/useSidebar.d.ts +8 -0
- package/dist/runtime/composables/useSidebar.js +30 -0
- package/dist/runtime/lib/utils.d.ts +3 -5
- package/dist/runtime/lib/utils.js +5 -15
- package/dist/runtime/plugin.d.ts +15 -0
- package/dist/runtime/plugin.js +84 -2
- package/dist/runtime/types/navigation.d.ts +20 -0
- package/dist/runtime/types/navigation.js +0 -0
- package/package.json +2 -2
- package/dist/runtime/components/icon/KAFavicon.d.vue.ts +0 -3
- package/dist/runtime/components/icon/KAFavicon.vue +0 -45
- package/dist/runtime/components/icon/KAFavicon.vue.d.ts +0 -3
- package/dist/runtime/components/icon/KALogo.d.vue.ts +0 -3
- package/dist/runtime/components/icon/KALogo.vue +0 -102
- package/dist/runtime/components/icon/KALogo.vue.d.ts +0 -3
- package/dist/runtime/components/icon/KALogoMono.d.vue.ts +0 -3
- package/dist/runtime/components/icon/KALogoMono.vue +0 -70
- package/dist/runtime/components/icon/KALogoMono.vue.d.ts +0 -3
- package/dist/runtime/plugins/toast.client.d.ts +0 -17
- package/dist/runtime/plugins/toast.client.js +0 -85
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
autoExpand?: boolean;
|
|
3
|
+
};
|
|
4
|
+
declare var __VLS_1: {}, __VLS_3: {};
|
|
5
|
+
type __VLS_Slots = {} & {
|
|
6
|
+
layout?: (props: typeof __VLS_1) => any;
|
|
7
|
+
} & {
|
|
8
|
+
default?: (props: typeof __VLS_3) => any;
|
|
9
|
+
};
|
|
10
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
11
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
12
|
+
declare const _default: typeof __VLS_export;
|
|
13
|
+
export default _default;
|
|
14
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
15
|
+
new (): {
|
|
16
|
+
$slots: S;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import useSidebar from "../../composables/useSidebar";
|
|
3
|
+
import { cn } from "../../lib/utils";
|
|
4
|
+
const props = defineProps({
|
|
5
|
+
autoExpand: { type: Boolean, required: false, default: false }
|
|
6
|
+
});
|
|
7
|
+
const { collapsed, collapsedMobile } = useSidebar();
|
|
8
|
+
</script>
|
|
9
|
+
|
|
10
|
+
<template>
|
|
11
|
+
<div class="min-h-navbar-screen">
|
|
12
|
+
<slot name="layout" />
|
|
13
|
+
<main
|
|
14
|
+
:class="
|
|
15
|
+
cn(
|
|
16
|
+
'min-h-navbar-screen mt-navbar relative lg:flex lg:flex-col lg:ml-64',
|
|
17
|
+
'border-l bg-layer-inner border-surface-container-high',
|
|
18
|
+
{
|
|
19
|
+
'lg:ml-14': collapsed && !collapsedMobile,
|
|
20
|
+
'px-2 lg:px-4': !props.autoExpand
|
|
21
|
+
}
|
|
22
|
+
)
|
|
23
|
+
"
|
|
24
|
+
>
|
|
25
|
+
<span
|
|
26
|
+
class="absolute top-0 left-0 h-10 right-0 bg-layer-inner -translate-y-full"
|
|
27
|
+
/>
|
|
28
|
+
<slot />
|
|
29
|
+
</main>
|
|
30
|
+
</div>
|
|
31
|
+
</template>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
autoExpand?: boolean;
|
|
3
|
+
};
|
|
4
|
+
declare var __VLS_1: {}, __VLS_3: {};
|
|
5
|
+
type __VLS_Slots = {} & {
|
|
6
|
+
layout?: (props: typeof __VLS_1) => any;
|
|
7
|
+
} & {
|
|
8
|
+
default?: (props: typeof __VLS_3) => any;
|
|
9
|
+
};
|
|
10
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
11
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
12
|
+
declare const _default: typeof __VLS_export;
|
|
13
|
+
export default _default;
|
|
14
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
15
|
+
new (): {
|
|
16
|
+
$slots: S;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { HTMLAttributes } from 'vue';
|
|
2
|
+
import type { BreadcrumbItem } from '../breadcrumb/Breadcrumb.vue.js';
|
|
3
|
+
interface IPageHeaderType {
|
|
4
|
+
title?: string;
|
|
5
|
+
/** For seo purpose only */
|
|
6
|
+
description?: string;
|
|
7
|
+
class?: HTMLAttributes['class'];
|
|
8
|
+
breadcrumbs?: BreadcrumbItem[];
|
|
9
|
+
}
|
|
10
|
+
declare var __VLS_1: {}, __VLS_8: {}, __VLS_10: {};
|
|
11
|
+
type __VLS_Slots = {} & {
|
|
12
|
+
breadcrumb?: (props: typeof __VLS_1) => any;
|
|
13
|
+
} & {
|
|
14
|
+
title?: (props: typeof __VLS_8) => any;
|
|
15
|
+
} & {
|
|
16
|
+
default?: (props: typeof __VLS_10) => any;
|
|
17
|
+
};
|
|
18
|
+
declare const __VLS_base: import("vue").DefineComponent<IPageHeaderType, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IPageHeaderType> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
19
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
20
|
+
declare const _default: typeof __VLS_export;
|
|
21
|
+
export default _default;
|
|
22
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
23
|
+
new (): {
|
|
24
|
+
$slots: S;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div :class="cn('pt-4 mb-3', props.class)">
|
|
3
|
+
<div
|
|
4
|
+
class="grid gap-0 md:gap-7 gap-y-2 md:flex md:justify-between md:items-center"
|
|
5
|
+
>
|
|
6
|
+
<div>
|
|
7
|
+
<slot name="breadcrumb">
|
|
8
|
+
<Breadcrumb
|
|
9
|
+
v-if="dynamicBreadcrumbs"
|
|
10
|
+
:breadcrumbs="dynamicBreadcrumbs"
|
|
11
|
+
/>
|
|
12
|
+
</slot>
|
|
13
|
+
<slot name="title">
|
|
14
|
+
<h1 class="text-on-surface font-bold text-xl">
|
|
15
|
+
{{ title }}
|
|
16
|
+
</h1>
|
|
17
|
+
</slot>
|
|
18
|
+
</div>
|
|
19
|
+
<div
|
|
20
|
+
v-if="slots.default || slots['right-comp']"
|
|
21
|
+
class="md:ml-auto flex gap-3 flex-wrap items-center"
|
|
22
|
+
>
|
|
23
|
+
<slot />
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
</div>
|
|
27
|
+
</template>
|
|
28
|
+
|
|
29
|
+
<script setup>
|
|
30
|
+
import { computed, useSlots } from "vue";
|
|
31
|
+
import { useRoute, useSeoMeta } from "#imports";
|
|
32
|
+
import { cn } from "../../lib/utils";
|
|
33
|
+
import Breadcrumb from "../breadcrumb/Breadcrumb.vue";
|
|
34
|
+
const props = defineProps({
|
|
35
|
+
title: { type: String, required: false, default: void 0 },
|
|
36
|
+
description: { type: String, required: false, default: void 0 },
|
|
37
|
+
class: { type: null, required: false, default: void 0 },
|
|
38
|
+
breadcrumbs: { type: Array, required: false, default: void 0 }
|
|
39
|
+
});
|
|
40
|
+
const route = useRoute();
|
|
41
|
+
const dynamicBreadcrumbs = computed(() => {
|
|
42
|
+
if (props.breadcrumbs) return props.breadcrumbs;
|
|
43
|
+
const link = [
|
|
44
|
+
{
|
|
45
|
+
label: "Beranda",
|
|
46
|
+
link: "/"
|
|
47
|
+
}
|
|
48
|
+
];
|
|
49
|
+
link.push({
|
|
50
|
+
label: props.title ?? "Unknown",
|
|
51
|
+
link: route.path
|
|
52
|
+
});
|
|
53
|
+
return link;
|
|
54
|
+
});
|
|
55
|
+
const slots = useSlots();
|
|
56
|
+
useSeoMeta({
|
|
57
|
+
title: props.title,
|
|
58
|
+
description: props.description ?? props.title
|
|
59
|
+
});
|
|
60
|
+
</script>
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { HTMLAttributes } from 'vue';
|
|
2
|
+
import type { BreadcrumbItem } from '../breadcrumb/Breadcrumb.vue.js';
|
|
3
|
+
interface IPageHeaderType {
|
|
4
|
+
title?: string;
|
|
5
|
+
/** For seo purpose only */
|
|
6
|
+
description?: string;
|
|
7
|
+
class?: HTMLAttributes['class'];
|
|
8
|
+
breadcrumbs?: BreadcrumbItem[];
|
|
9
|
+
}
|
|
10
|
+
declare var __VLS_1: {}, __VLS_8: {}, __VLS_10: {};
|
|
11
|
+
type __VLS_Slots = {} & {
|
|
12
|
+
breadcrumb?: (props: typeof __VLS_1) => any;
|
|
13
|
+
} & {
|
|
14
|
+
title?: (props: typeof __VLS_8) => any;
|
|
15
|
+
} & {
|
|
16
|
+
default?: (props: typeof __VLS_10) => any;
|
|
17
|
+
};
|
|
18
|
+
declare const __VLS_base: import("vue").DefineComponent<IPageHeaderType, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IPageHeaderType> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
19
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
20
|
+
declare const _default: typeof __VLS_export;
|
|
21
|
+
export default _default;
|
|
22
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
23
|
+
new (): {
|
|
24
|
+
$slots: S;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -142,7 +142,11 @@ const formatDuration = (seconds) => {
|
|
|
142
142
|
v-if="options.includes('download')"
|
|
143
143
|
label="Download"
|
|
144
144
|
icon="material-symbols:download"
|
|
145
|
-
@click="
|
|
145
|
+
@click="
|
|
146
|
+
() => createDownloadLink({
|
|
147
|
+
href: props.src
|
|
148
|
+
})
|
|
149
|
+
"
|
|
146
150
|
/>
|
|
147
151
|
<DropdownItem
|
|
148
152
|
v-if="
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
'border grid gap-1.5 w-full relative items-start rounded-xl transition-all overflow-hidden',
|
|
14
14
|
{
|
|
15
15
|
'hover:border-primary hover:ring-1 hover:ring-primary': !disabled && !selected && !promoted && selectable,
|
|
16
|
-
'bg-surfaceContainer border-
|
|
16
|
+
'bg-surfaceContainer border-outline-variant': !promoted,
|
|
17
17
|
'bg-warning-yellowContainer border-warning-yellow hover:ring-1 hover:ring-warning-yellow': promoted,
|
|
18
18
|
'bg-secondary-container border-primary ring-1 ring-primary': selected,
|
|
19
19
|
'p-2.5': size === 'medium',
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
]"
|
|
35
35
|
>
|
|
36
36
|
<NuxtImg
|
|
37
|
-
class="w-16 aspect-video shrink-0 border bg-white border-
|
|
37
|
+
class="w-16 aspect-video shrink-0 border bg-white border-outline-variant rounded-md object-contain"
|
|
38
38
|
:class="[promoted ? 'self-start' : 'self-center']"
|
|
39
39
|
:src="
|
|
40
40
|
image ?? courier.image_link ?? `/assets/courier-logo/${courier.service}.png`
|
|
@@ -104,7 +104,7 @@ const selectedType = computed(
|
|
|
104
104
|
<select
|
|
105
105
|
id="date-type-picker"
|
|
106
106
|
v-model="rangeType"
|
|
107
|
-
class="font-semibold px-2 py-1 text-xs bg-transparent rounded-lg border border-
|
|
107
|
+
class="font-semibold px-2 py-1 text-xs bg-transparent rounded-lg border border-outline-variant appearance-none focus:ring-1 focus:ring-primary focus:border-primary focus:outline-none w-auto"
|
|
108
108
|
name="type"
|
|
109
109
|
>
|
|
110
110
|
<option
|
|
@@ -63,7 +63,7 @@ watch(
|
|
|
63
63
|
<SelectTrigger
|
|
64
64
|
:class="
|
|
65
65
|
cn(
|
|
66
|
-
'flex justify-between items-center pl-2.5 py-2 pr-10 relative text-sm rounded-lg border border-
|
|
66
|
+
'flex justify-between items-center pl-2.5 py-2 pr-10 relative text-sm rounded-lg border border-outline-variant focus-visible:outline-none ring-0 focus-visible:ring-offset-1 focus-visible:ring-offset-primary disabled:cursor-not-allowed disabled:opacity-50 peer focus-visible:text-onSurface focus-visible:bg-surfaceContainerLowest data-[placeholder]:text-outline disabled:bg-surface-container-low',
|
|
67
67
|
[
|
|
68
68
|
props.invalid ? `text-error data-[state=\'open\']:ring-error focus:ring-1 focus:ring-error focus:border-error bg-surfaceContainerLow` : `text-onSurface data-[state=\'open\']:ring-primary focus:ring-1 focus:ring-primary focus:border-primary bg-background dark:bg-surface-container-high`
|
|
69
69
|
],
|
|
@@ -26,7 +26,7 @@ const { width } = useElementSize(elementWrapper);
|
|
|
26
26
|
ref="elementWrapper"
|
|
27
27
|
:class="
|
|
28
28
|
cn(
|
|
29
|
-
'w-full flex items-center gap-1 rounded-lg border divide-x divide-outline border-
|
|
29
|
+
'w-full flex items-center gap-1 rounded-lg border divide-x divide-outline border-outline-variant ring-0',
|
|
30
30
|
[
|
|
31
31
|
props.invalid ? 'ring-offset-1 ring-offset-error bg-surfaceContainerLow' : 'ring-offset-0 ring-offset-primary bg-background dark:bg-surface-container-high'
|
|
32
32
|
],
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { HTMLAttributes } from 'vue';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
class?: HTMLAttributes['class'];
|
|
4
|
+
buttonClass?: HTMLAttributes['class'];
|
|
5
|
+
};
|
|
6
|
+
declare var __VLS_6: {
|
|
7
|
+
collapsed: boolean;
|
|
8
|
+
}, __VLS_8: {}, __VLS_17: {}, __VLS_24: {};
|
|
9
|
+
type __VLS_Slots = {} & {
|
|
10
|
+
logo?: (props: typeof __VLS_6) => any;
|
|
11
|
+
} & {
|
|
12
|
+
'collapse-button'?: (props: typeof __VLS_8) => any;
|
|
13
|
+
} & {
|
|
14
|
+
top?: (props: typeof __VLS_17) => any;
|
|
15
|
+
} & {
|
|
16
|
+
default?: (props: typeof __VLS_24) => any;
|
|
17
|
+
};
|
|
18
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
19
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
20
|
+
declare const _default: typeof __VLS_export;
|
|
21
|
+
export default _default;
|
|
22
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
23
|
+
new (): {
|
|
24
|
+
$slots: S;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<button
|
|
3
|
+
v-if="collapsedMobile"
|
|
4
|
+
class="bg-black/20 z-40 lg:hidden fixed inset-0 w-screen h-screen"
|
|
5
|
+
@click="toggleMobile(false)"
|
|
6
|
+
></button>
|
|
7
|
+
<aside
|
|
8
|
+
:class="
|
|
9
|
+
cn([
|
|
10
|
+
'left-0 flex flex-col z-60 transform fixed! top-0 bg-layer duration-300',
|
|
11
|
+
'h-screen',
|
|
12
|
+
collapsed && !collapsedMobile ? 'w-14' : 'w-64',
|
|
13
|
+
collapsedMobile ? '' : '-translate-x-full lg:translate-x-0',
|
|
14
|
+
props.class
|
|
15
|
+
])
|
|
16
|
+
"
|
|
17
|
+
>
|
|
18
|
+
<div
|
|
19
|
+
:class="
|
|
20
|
+
cn('flex items-center p-2 lg:h-navbar lg:justify-between relative', {
|
|
21
|
+
'lg:justify-center group p-0': collapsed && !collapsedMobile
|
|
22
|
+
})
|
|
23
|
+
"
|
|
24
|
+
>
|
|
25
|
+
<Link
|
|
26
|
+
:to="'/'"
|
|
27
|
+
:class="
|
|
28
|
+
cn('hover:bg-surface-container-high p-2 rounded-lg text-left', {
|
|
29
|
+
'w-10 h-10 p-0': collapsed
|
|
30
|
+
})
|
|
31
|
+
"
|
|
32
|
+
>
|
|
33
|
+
<slot name="logo" :collapsed="collapsed && !collapsedMobile" />
|
|
34
|
+
</Link>
|
|
35
|
+
<slot name="collapse-button">
|
|
36
|
+
<SidebarCollapse
|
|
37
|
+
:collapsed="collapsed && !collapsedMobile"
|
|
38
|
+
@click="switchCollapsed"
|
|
39
|
+
/>
|
|
40
|
+
</slot>
|
|
41
|
+
</div>
|
|
42
|
+
<slot name="top" />
|
|
43
|
+
<ScrollArea id="sidebar-container" class="h-auto flex-1">
|
|
44
|
+
<nav
|
|
45
|
+
:class="
|
|
46
|
+
cn('p-2 space-y-0.5', {
|
|
47
|
+
'pt-0': collapsed
|
|
48
|
+
})
|
|
49
|
+
"
|
|
50
|
+
>
|
|
51
|
+
<slot />
|
|
52
|
+
</nav>
|
|
53
|
+
</ScrollArea>
|
|
54
|
+
</aside>
|
|
55
|
+
</template>
|
|
56
|
+
|
|
57
|
+
<script setup>
|
|
58
|
+
import { cn } from "../../lib/utils";
|
|
59
|
+
import ScrollArea from "../scroll-area/ScrollArea.vue";
|
|
60
|
+
import SidebarCollapse from "./SidebarCollapse.vue";
|
|
61
|
+
import useSidebar from "../../composables/useSidebar";
|
|
62
|
+
import Link from "../link/Link.vue";
|
|
63
|
+
const { collapsed, collapsedMobile, switchCollapsed, toggleMobile } = useSidebar();
|
|
64
|
+
const props = defineProps({
|
|
65
|
+
class: { type: null, required: false },
|
|
66
|
+
buttonClass: { type: null, required: false }
|
|
67
|
+
});
|
|
68
|
+
</script>
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { HTMLAttributes } from 'vue';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
class?: HTMLAttributes['class'];
|
|
4
|
+
buttonClass?: HTMLAttributes['class'];
|
|
5
|
+
};
|
|
6
|
+
declare var __VLS_6: {
|
|
7
|
+
collapsed: boolean;
|
|
8
|
+
}, __VLS_8: {}, __VLS_17: {}, __VLS_24: {};
|
|
9
|
+
type __VLS_Slots = {} & {
|
|
10
|
+
logo?: (props: typeof __VLS_6) => any;
|
|
11
|
+
} & {
|
|
12
|
+
'collapse-button'?: (props: typeof __VLS_8) => any;
|
|
13
|
+
} & {
|
|
14
|
+
top?: (props: typeof __VLS_17) => any;
|
|
15
|
+
} & {
|
|
16
|
+
default?: (props: typeof __VLS_24) => any;
|
|
17
|
+
};
|
|
18
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
19
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
20
|
+
declare const _default: typeof __VLS_export;
|
|
21
|
+
export default _default;
|
|
22
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
23
|
+
new (): {
|
|
24
|
+
$slots: S;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { NavigationMenu } from '../../types/navigation.js';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
submenu: NavigationMenu;
|
|
4
|
+
fit?: boolean;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
7
|
+
declare const _default: typeof __VLS_export;
|
|
8
|
+
export default _default;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div
|
|
3
|
+
:class="
|
|
4
|
+
cn([
|
|
5
|
+
'relative py-1.5 flex items-center rounded-lg gap-2',
|
|
6
|
+
{
|
|
7
|
+
'pl-10 pr-3.5': !fit,
|
|
8
|
+
'px-3.5 rounded-lg': fit,
|
|
9
|
+
'bg-layer-inner text-primary': isActive,
|
|
10
|
+
'hover:bg-surface-container-high': !isActive,
|
|
11
|
+
'pr-10': submenu.count && submenu.count > 0
|
|
12
|
+
}
|
|
13
|
+
])
|
|
14
|
+
"
|
|
15
|
+
>
|
|
16
|
+
<span
|
|
17
|
+
:class="
|
|
18
|
+
cn([
|
|
19
|
+
'text-sm grow ease-in-out duration-300',
|
|
20
|
+
{
|
|
21
|
+
'text-primary font-medium': isActive
|
|
22
|
+
}
|
|
23
|
+
])
|
|
24
|
+
"
|
|
25
|
+
v-text="submenu.title"
|
|
26
|
+
></span>
|
|
27
|
+
<Badge
|
|
28
|
+
v-if="submenu.count && submenu.count > 0"
|
|
29
|
+
variant="error"
|
|
30
|
+
class="scale-75 translate-x-4"
|
|
31
|
+
:label="submenu.count <= 99 ? submenu.count.toString() : '99+'"
|
|
32
|
+
/>
|
|
33
|
+
|
|
34
|
+
<NuxtLink :to="submenu.path" class="absolute inset-0" />
|
|
35
|
+
</div>
|
|
36
|
+
</template>
|
|
37
|
+
|
|
38
|
+
<script setup>
|
|
39
|
+
import { useRoute } from "#imports";
|
|
40
|
+
import { computed } from "vue";
|
|
41
|
+
import { cn } from "../../lib/utils";
|
|
42
|
+
import Badge from "../badge/Badge.vue";
|
|
43
|
+
const props = defineProps({
|
|
44
|
+
submenu: { type: Object, required: true },
|
|
45
|
+
fit: { type: Boolean, required: false }
|
|
46
|
+
});
|
|
47
|
+
const route = useRoute();
|
|
48
|
+
const isActive = computed(() => {
|
|
49
|
+
const isPathActive = route.fullPath.includes(props.submenu.path);
|
|
50
|
+
if (props.submenu.includes) {
|
|
51
|
+
const isIncluded = props.submenu.includes.some(
|
|
52
|
+
(include) => route.fullPath.includes(include)
|
|
53
|
+
);
|
|
54
|
+
if (isIncluded) return isIncluded;
|
|
55
|
+
}
|
|
56
|
+
if (props.submenu.excludes) {
|
|
57
|
+
const isExcluded = props.submenu.excludes.some(
|
|
58
|
+
(exclude) => route.fullPath.includes(exclude)
|
|
59
|
+
);
|
|
60
|
+
return isPathActive && !isExcluded;
|
|
61
|
+
}
|
|
62
|
+
return isPathActive;
|
|
63
|
+
});
|
|
64
|
+
</script>
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { NavigationMenu } from '../../types/navigation.js';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
submenu: NavigationMenu;
|
|
4
|
+
fit?: boolean;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
7
|
+
declare const _default: typeof __VLS_export;
|
|
8
|
+
export default _default;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
interface IProps {
|
|
2
|
+
collapsed?: boolean;
|
|
3
|
+
}
|
|
4
|
+
declare const __VLS_export: import("vue").DefineComponent<IProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
5
|
+
declare const _default: typeof __VLS_export;
|
|
6
|
+
export default _default;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<button
|
|
3
|
+
:class="
|
|
4
|
+
cn(
|
|
5
|
+
'hidden lg:inline-flex group p-0 text-outline items-center justify-center',
|
|
6
|
+
{
|
|
7
|
+
'absolute inset-0 lg:hidden group-hover:lg:inline-flex p-2': collapsed
|
|
8
|
+
}
|
|
9
|
+
)
|
|
10
|
+
"
|
|
11
|
+
type="button"
|
|
12
|
+
>
|
|
13
|
+
<span
|
|
14
|
+
class="group-hover:bg-surface-container-highest box-center rounded-lg p-1 w-10 h-10"
|
|
15
|
+
>
|
|
16
|
+
<Icon
|
|
17
|
+
:name="
|
|
18
|
+
collapsed ? 'material-symbols:left-panel-open-outline' : 'material-symbols:left-panel-close-outline'
|
|
19
|
+
"
|
|
20
|
+
:size="collapsed ? '24px' : '20px'"
|
|
21
|
+
/>
|
|
22
|
+
</span>
|
|
23
|
+
</button>
|
|
24
|
+
</template>
|
|
25
|
+
|
|
26
|
+
<script setup>
|
|
27
|
+
import { cn } from "../../lib/utils";
|
|
28
|
+
defineProps({
|
|
29
|
+
collapsed: { type: Boolean, required: false }
|
|
30
|
+
});
|
|
31
|
+
</script>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
interface IProps {
|
|
2
|
+
collapsed?: boolean;
|
|
3
|
+
}
|
|
4
|
+
declare const __VLS_export: import("vue").DefineComponent<IProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
5
|
+
declare const _default: typeof __VLS_export;
|
|
6
|
+
export default _default;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
};
|
|
4
|
+
declare var __VLS_1: {};
|
|
5
|
+
type __VLS_Slots = {} & {
|
|
6
|
+
default?: (props: typeof __VLS_1) => any;
|
|
7
|
+
};
|
|
8
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
10
|
+
declare const _default: typeof __VLS_export;
|
|
11
|
+
export default _default;
|
|
12
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
13
|
+
new (): {
|
|
14
|
+
$slots: S;
|
|
15
|
+
};
|
|
16
|
+
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div
|
|
3
|
+
v-if="label && !collapsed"
|
|
4
|
+
class="px-3.5 text-xs py-2 font-semibold flex justify-between"
|
|
5
|
+
>
|
|
6
|
+
{{ label }}
|
|
7
|
+
</div>
|
|
8
|
+
<slot />
|
|
9
|
+
</template>
|
|
10
|
+
|
|
11
|
+
<script setup>
|
|
12
|
+
import useSidebar from "../../composables/useSidebar";
|
|
13
|
+
const { collapsed } = useSidebar();
|
|
14
|
+
defineOptions({
|
|
15
|
+
inheritAttrs: false
|
|
16
|
+
});
|
|
17
|
+
defineProps({
|
|
18
|
+
label: { type: String, required: false }
|
|
19
|
+
});
|
|
20
|
+
</script>
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
};
|
|
4
|
+
declare var __VLS_1: {};
|
|
5
|
+
type __VLS_Slots = {} & {
|
|
6
|
+
default?: (props: typeof __VLS_1) => any;
|
|
7
|
+
};
|
|
8
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
10
|
+
declare const _default: typeof __VLS_export;
|
|
11
|
+
export default _default;
|
|
12
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
13
|
+
new (): {
|
|
14
|
+
$slots: S;
|
|
15
|
+
};
|
|
16
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { NavigationMenu } from '../../types/navigation.js';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
menu: NavigationMenu;
|
|
4
|
+
};
|
|
5
|
+
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
|
+
declare const _default: typeof __VLS_export;
|
|
7
|
+
export default _default;
|