@bridge-ui/vue 0.4.0 → 0.5.0
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/ai/skills/bridge-ui-components/SKILL.md +3 -1
- package/dist/Components/Accordion/accordionInjectionKey.d.ts +1 -0
- package/dist/Components/Accordion/composables/useAccordion.js +3 -2
- package/dist/Components/AccordionItem/composables/useAccordionItem.js +1 -0
- package/dist/Components/DataTable/DataTable.vue.d.ts +1 -1
- package/dist/Components/DataTable/DataTable.vue_vue_type_script_setup_true_lang.js +96 -92
- package/dist/Components/DataTable/composables/useDataTable.d.ts +1 -1
- package/dist/Components/DataTable/composables/useDataTable.js +1 -1
- package/dist/Components/EmptyState/EmptyState.js +5 -0
- package/dist/Components/EmptyState/EmptyState.vue.d.ts +16 -0
- package/dist/Components/EmptyState/EmptyState.vue_vue_type_script_setup_true_lang.js +42 -0
- package/dist/Components/EmptyState/composables/useEmptyState.d.ts +24 -0
- package/dist/Components/EmptyState/composables/useEmptyState.js +76 -0
- package/dist/Components/EmptyState/emptyState.types.d.ts +140 -0
- package/dist/Components/EmptyState/index.d.ts +3 -0
- package/dist/Components/EmptyState/index.js +3 -0
- package/dist/Components/List/composables/useList.d.ts +3 -1
- package/dist/Components/List/composables/useList.js +2 -2
- package/dist/Components/ListItem/ListItem.vue_vue_type_script_setup_true_lang.js +4 -4
- package/dist/Components/ListSection/ListSection.vue_vue_type_script_setup_true_lang.js +4 -4
- package/dist/Components/ListSection/composables/useListSection.d.ts +1 -0
- package/dist/Components/ListSection/composables/useListSection.js +30 -28
- package/dist/Components/ListSection/listSectionInjectionKey.d.ts +5 -0
- package/dist/Components/ListSection/listSectionInjectionKey.js +4 -0
- package/dist/Components/Sidebar/Sidebar.js +5 -0
- package/dist/Components/Sidebar/Sidebar.vue.d.ts +16 -0
- package/dist/Components/Sidebar/Sidebar.vue_vue_type_script_setup_true_lang.js +59 -0
- package/dist/Components/Sidebar/SidebarInset.js +5 -0
- package/dist/Components/Sidebar/SidebarInset.vue.d.ts +11 -0
- package/dist/Components/Sidebar/SidebarInset.vue_vue_type_script_setup_true_lang.js +18 -0
- package/dist/Components/Sidebar/SidebarList.js +5 -0
- package/dist/Components/Sidebar/SidebarList.vue.d.ts +16 -0
- package/dist/Components/Sidebar/SidebarList.vue_vue_type_script_setup_true_lang.js +40 -0
- package/dist/Components/Sidebar/SidebarListItem.js +5 -0
- package/dist/Components/Sidebar/SidebarListItem.vue.d.ts +13 -0
- package/dist/Components/Sidebar/SidebarListItem.vue_vue_type_script_setup_true_lang.js +120 -0
- package/dist/Components/Sidebar/SidebarProvider.js +5 -0
- package/dist/Components/Sidebar/SidebarProvider.vue.d.ts +24 -0
- package/dist/Components/Sidebar/SidebarProvider.vue_vue_type_script_setup_true_lang.js +29 -0
- package/dist/Components/Sidebar/SidebarTrigger.js +5 -0
- package/dist/Components/Sidebar/SidebarTrigger.vue.d.ts +11 -0
- package/dist/Components/Sidebar/SidebarTrigger.vue_vue_type_script_setup_true_lang.js +35 -0
- package/dist/Components/Sidebar/composables/useSidebar.d.ts +6 -0
- package/dist/Components/Sidebar/composables/useSidebar.js +10 -0
- package/dist/Components/Sidebar/composables/useSidebarInset.d.ts +7 -0
- package/dist/Components/Sidebar/composables/useSidebarInset.js +32 -0
- package/dist/Components/Sidebar/composables/useSidebarList.d.ts +8 -0
- package/dist/Components/Sidebar/composables/useSidebarList.js +27 -0
- package/dist/Components/Sidebar/composables/useSidebarListItem.d.ts +15 -0
- package/dist/Components/Sidebar/composables/useSidebarListItem.js +44 -0
- package/dist/Components/Sidebar/composables/useSidebarProvider.d.ts +18 -0
- package/dist/Components/Sidebar/composables/useSidebarProvider.js +88 -0
- package/dist/Components/Sidebar/composables/useSidebarShell.d.ts +41 -0
- package/dist/Components/Sidebar/composables/useSidebarShell.js +116 -0
- package/dist/Components/Sidebar/composables/useSidebarTrigger.d.ts +10 -0
- package/dist/Components/Sidebar/composables/useSidebarTrigger.js +25 -0
- package/dist/Components/Sidebar/index.d.ts +15 -0
- package/dist/Components/Sidebar/index.js +15 -0
- package/dist/Components/Sidebar/sidebar.types.d.ts +244 -0
- package/dist/Components/Sidebar/sidebarInjectionKey.d.ts +80 -0
- package/dist/Components/Sidebar/sidebarInjectionKey.js +4 -0
- package/dist/Components/Sidebar/sidebarListInjectionKey.d.ts +5 -0
- package/dist/Components/Sidebar/sidebarListInjectionKey.js +4 -0
- package/dist/Components/Slider/Slider.vue_vue_type_script_setup_true_lang.js +5 -5
- package/dist/augments.d.ts +10 -0
- package/dist/index.d.ts +4 -0
- package/dist/index.js +79 -64
- package/docs/README.md +2 -0
- package/docs/ScrollUtilities.md +1 -1
- package/docs/components/DataTable.md +1 -1
- package/docs/components/Drawer.md +1 -1
- package/docs/components/EmptyState.md +125 -0
- package/docs/components/List.md +1 -1
- package/docs/components/Sidebar.md +281 -0
- package/docs/examples/icon-fontawesome.ts +1 -0
- package/docs/examples/icon-heroicons.ts +2 -0
- package/docs/examples/icon-lucide.ts +2 -0
- package/docs/examples/icon-phosphor.ts +2 -0
- package/docs/examples/icon-tabler.ts +2 -0
- package/package.json +2 -2
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
import { HTMLAttributes, Slot } from 'vue';
|
|
2
|
+
import { EmptyStateAlign, EmptyStateSize } from '@bridge-ui/core/Tokens';
|
|
3
|
+
import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
|
|
4
|
+
import { IconSource } from '../../Adapters/Icon';
|
|
5
|
+
import { IconProps } from '../Icon';
|
|
6
|
+
export interface EmptyStateSizeOverrides {}
|
|
7
|
+
export interface EmptyStateAlignOverrides {}
|
|
8
|
+
export interface EmptyStateClasses {
|
|
9
|
+
/**
|
|
10
|
+
* The classes to apply to the actions row.
|
|
11
|
+
*/
|
|
12
|
+
actions?: string;
|
|
13
|
+
/**
|
|
14
|
+
* The classes to apply to the description.
|
|
15
|
+
*/
|
|
16
|
+
description?: string;
|
|
17
|
+
/**
|
|
18
|
+
* The classes to apply to the default `Icon`.
|
|
19
|
+
*/
|
|
20
|
+
icon?: string;
|
|
21
|
+
/**
|
|
22
|
+
* The classes to apply to the media wrapper.
|
|
23
|
+
*/
|
|
24
|
+
media?: string;
|
|
25
|
+
/**
|
|
26
|
+
* The classes to apply to the root.
|
|
27
|
+
*/
|
|
28
|
+
root?: string;
|
|
29
|
+
/**
|
|
30
|
+
* The classes to apply to the title.
|
|
31
|
+
*/
|
|
32
|
+
title?: string;
|
|
33
|
+
}
|
|
34
|
+
export interface EmptyStateCustomProps {
|
|
35
|
+
/**
|
|
36
|
+
* Props forwarded to the actions row.
|
|
37
|
+
*/
|
|
38
|
+
actions?: HTMLAttributes;
|
|
39
|
+
/**
|
|
40
|
+
* Props forwarded to the description container.
|
|
41
|
+
*/
|
|
42
|
+
description?: HTMLAttributes;
|
|
43
|
+
/**
|
|
44
|
+
* Props forwarded to the default `Icon` (`icon` is set by the empty state).
|
|
45
|
+
*/
|
|
46
|
+
icon?: Partial<Omit<IconProps, "icon">>;
|
|
47
|
+
/**
|
|
48
|
+
* Props forwarded to the media wrapper.
|
|
49
|
+
*/
|
|
50
|
+
media?: HTMLAttributes;
|
|
51
|
+
/**
|
|
52
|
+
* Props forwarded to the root container.
|
|
53
|
+
*/
|
|
54
|
+
root?: HTMLAttributes;
|
|
55
|
+
/**
|
|
56
|
+
* Props forwarded to the title element.
|
|
57
|
+
*/
|
|
58
|
+
title?: HTMLAttributes;
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Placeholder when a list, table, or view has no data.
|
|
62
|
+
* Does not set `role` by default — pass `role="status"` when the empty
|
|
63
|
+
* state is a live update.
|
|
64
|
+
*/
|
|
65
|
+
export interface EmptyStateOwnProps {
|
|
66
|
+
/**
|
|
67
|
+
* Horizontal alignment of the stack.
|
|
68
|
+
*
|
|
69
|
+
* @default "center"
|
|
70
|
+
*/
|
|
71
|
+
align?: MergeProps<EmptyStateAlign, EmptyStateAlignOverrides>;
|
|
72
|
+
/**
|
|
73
|
+
* The classes to apply to the empty state.
|
|
74
|
+
*
|
|
75
|
+
* @default undefined
|
|
76
|
+
*/
|
|
77
|
+
classes?: EmptyStateClasses;
|
|
78
|
+
/**
|
|
79
|
+
* Extra props for internal parts (`media`, `title`, `description`, etc.).
|
|
80
|
+
* Root HTML attributes stay on the component top level.
|
|
81
|
+
*
|
|
82
|
+
* @default undefined
|
|
83
|
+
*/
|
|
84
|
+
customProps?: EmptyStateCustomProps;
|
|
85
|
+
/**
|
|
86
|
+
* Supporting copy below the title.
|
|
87
|
+
*
|
|
88
|
+
* @default undefined
|
|
89
|
+
*/
|
|
90
|
+
description?: string;
|
|
91
|
+
/**
|
|
92
|
+
* Default media icon. Use the `media` slot to replace it with custom markup.
|
|
93
|
+
*
|
|
94
|
+
* @default undefined
|
|
95
|
+
*/
|
|
96
|
+
icon?: IconSource;
|
|
97
|
+
/**
|
|
98
|
+
* When true, the media wrapper is hidden from assistive tech (`aria-hidden`).
|
|
99
|
+
*
|
|
100
|
+
* @default true
|
|
101
|
+
*/
|
|
102
|
+
mediaDecorative?: boolean;
|
|
103
|
+
/**
|
|
104
|
+
* Spacing and typography scale.
|
|
105
|
+
*
|
|
106
|
+
* @default "md"
|
|
107
|
+
*/
|
|
108
|
+
size?: MergeProps<EmptyStateSize, EmptyStateSizeOverrides>;
|
|
109
|
+
/**
|
|
110
|
+
* Primary heading copy.
|
|
111
|
+
*
|
|
112
|
+
* @default undefined
|
|
113
|
+
*/
|
|
114
|
+
title?: string;
|
|
115
|
+
/**
|
|
116
|
+
* Element used to render `title`. Use a heading when the page outline needs it.
|
|
117
|
+
*
|
|
118
|
+
* @default "p"
|
|
119
|
+
*/
|
|
120
|
+
titleAs?: "p" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div";
|
|
121
|
+
}
|
|
122
|
+
export interface EmptyStateSlots {
|
|
123
|
+
/**
|
|
124
|
+
* Action row (e.g. one or more `Button`s).
|
|
125
|
+
*/
|
|
126
|
+
action?: Slot<undefined>;
|
|
127
|
+
/**
|
|
128
|
+
* Replaces the default description copy.
|
|
129
|
+
*/
|
|
130
|
+
description?: Slot<undefined>;
|
|
131
|
+
/**
|
|
132
|
+
* Illustration or icon above the title. Replaces the `icon` prop.
|
|
133
|
+
*/
|
|
134
|
+
media?: Slot<undefined>;
|
|
135
|
+
/**
|
|
136
|
+
* Replaces the default title copy.
|
|
137
|
+
*/
|
|
138
|
+
title?: Slot<undefined>;
|
|
139
|
+
}
|
|
140
|
+
export type EmptyStateProps = MergeHtmlProps<EmptyStateOwnProps, HTMLAttributes>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { useEmptyState } from './composables/useEmptyState';
|
|
2
|
+
export type { EmptyStateAlignOverrides, EmptyStateClasses, EmptyStateCustomProps, EmptyStateOwnProps, EmptyStateProps, EmptyStateSizeOverrides, EmptyStateSlots, } from './emptyState.types';
|
|
3
|
+
export { default as EmptyState } from './EmptyState.vue';
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { ListOwnProps, ListProps } from '../list.types';
|
|
2
2
|
export declare function useList(props: ListOwnProps): {
|
|
3
3
|
merged: import('vue').ComputedRef<ListOwnProps>;
|
|
4
|
-
rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<
|
|
4
|
+
rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
|
|
5
|
+
class: string;
|
|
6
|
+
}, "class", import('vue').HTMLAttributes | undefined, Omit<Omit<ListProps, "classes" | "customProps" | "as" | "dense" | "nested">, never>>>;
|
|
5
7
|
};
|
|
@@ -29,11 +29,11 @@ function f(f) {
|
|
|
29
29
|
let b = i(() => c(m.value.inheritedAttrs, []));
|
|
30
30
|
return {
|
|
31
31
|
merged: h,
|
|
32
|
-
rootBind: i(() => e(_.value?.root, b.value, l({
|
|
32
|
+
rootBind: i(() => e(_.value?.root, b.value, { class: l({
|
|
33
33
|
"m-0 list-none py-2 text-dark-900 dark:text-dark-100": !0,
|
|
34
34
|
"pl-4": h.value.nested,
|
|
35
35
|
[s(v.value, "root") ?? ""]: !0
|
|
36
|
-
})))
|
|
36
|
+
}) }))
|
|
37
37
|
};
|
|
38
38
|
}
|
|
39
39
|
//#endregion
|
|
@@ -38,15 +38,15 @@ var C = /*@__PURE__*/ d({
|
|
|
38
38
|
return (r, a) => (g(), o(v(R.value), h(f(b(D))), {
|
|
39
39
|
default: S(() => [b(F) ? (g(), c("div", h(p({ key: 0 }, b(F))), [l("div", { class: m(b(O)) }, [
|
|
40
40
|
b(e)(b(C), "start") ? (g(), c("div", h(p({ key: 0 }, b(k))), [_(r.$slots, "start")], 16)) : s("", !0),
|
|
41
|
-
|
|
42
|
-
b(T) ? (g(), c("div", h(p({ key:
|
|
41
|
+
b(A) || b(N) ? (g(), c("div", h(p({ key: 1 }, b(j))), [b(A) ? (g(), c("span", h(p({ key: 0 }, b(M))), [b(e)(b(C), "primary") ? _(r.$slots, "primary", {}, void 0, void 0, 0) : b(e)(b(C), "default") ? _(r.$slots, "default", {}, void 0, void 0, 1) : b(t)(b(w).primary) ? (g(), c(i, { key: 2 }, [u(y(b(w).primary), 1)], 64)) : s("", !0)], 16)) : s("", !0), b(N) ? (g(), c("span", h(p({ key: 1 }, b(P))), [b(e)(b(C), "secondary") ? _(r.$slots, "secondary", {}, void 0, void 0, 0) : b(t)(b(w).secondary) ? (g(), c(i, { key: 1 }, [u(y(b(w).secondary), 1)], 64)) : s("", !0)], 16)) : s("", !0)], 16)) : s("", !0),
|
|
42
|
+
b(T) ? (g(), c("div", h(p({ key: 2 }, b(E))), [b(e)(b(C), "end") ? _(r.$slots, "end", {}, void 0, void 0, 0) : b(L) ? (g(), o(n, p({ key: 1 }, b(I), { icon: b(L) }), null, 16, ["icon"])) : s("", !0)], 16)) : s("", !0)
|
|
43
43
|
], 2)], 16)) : (g(), c("div", {
|
|
44
44
|
key: 1,
|
|
45
45
|
class: m(b(O))
|
|
46
46
|
}, [
|
|
47
47
|
b(e)(b(C), "start") ? (g(), c("div", h(p({ key: 0 }, b(k))), [_(r.$slots, "start")], 16)) : s("", !0),
|
|
48
|
-
|
|
49
|
-
b(T) ? (g(), c("div", h(p({ key:
|
|
48
|
+
b(A) || b(N) ? (g(), c("div", h(p({ key: 1 }, b(j))), [b(A) ? (g(), c("span", h(p({ key: 0 }, b(M))), [b(e)(b(C), "primary") ? _(r.$slots, "primary", {}, void 0, void 0, 0) : b(e)(b(C), "default") ? _(r.$slots, "default", {}, void 0, void 0, 1) : b(t)(b(w).primary) ? (g(), c(i, { key: 2 }, [u(y(b(w).primary), 1)], 64)) : s("", !0)], 16)) : s("", !0), b(N) ? (g(), c("span", h(p({ key: 1 }, b(P))), [b(e)(b(C), "secondary") ? _(r.$slots, "secondary", {}, void 0, void 0, 0) : b(t)(b(w).secondary) ? (g(), c(i, { key: 1 }, [u(y(b(w).secondary), 1)], 64)) : s("", !0)], 16)) : s("", !0)], 16)) : s("", !0),
|
|
49
|
+
b(T) ? (g(), c("div", h(p({ key: 2 }, b(E))), [b(e)(b(C), "end") ? _(r.$slots, "end", {}, void 0, void 0, 0) : b(L) ? (g(), o(n, p({ key: 1 }, b(I), { icon: b(L) }), null, 16, ["icon"])) : s("", !0)], 16)) : s("", !0)
|
|
50
50
|
], 2))]),
|
|
51
51
|
_: 3
|
|
52
52
|
}, 16));
|
|
@@ -20,11 +20,11 @@ var x = /*@__PURE__*/ u({
|
|
|
20
20
|
title: {}
|
|
21
21
|
},
|
|
22
22
|
setup(u) {
|
|
23
|
-
let x = y(), { merged: S, rootBind: C,
|
|
24
|
-
return (n, i) =>
|
|
25
|
-
default: b(() => [c("div", p(d(v(
|
|
23
|
+
let x = y(), { merged: S, rootBind: C, isHidden: w, titleBind: T } = n(u), E = i(() => S.value.as ?? "li");
|
|
24
|
+
return (n, i) => v(w) ? o("", !0) : (m(), s(r, { key: 0 }, [E.value === "div" ? (m(), s("div", p(f({ key: 0 }, v(T))), [v(e)(v(x), "default") ? h(n.$slots, "default", {}, void 0, void 0, 0) : v(t)(v(S).title) ? (m(), s(r, { key: 1 }, [l(_(v(S).title), 1)], 64)) : o("", !0)], 16)) : (m(), a(g(E.value), p(f({ key: 1 }, v(C))), {
|
|
25
|
+
default: b(() => [c("div", p(d(v(T))), [v(e)(v(x), "default") ? h(n.$slots, "default", {}, void 0, void 0, 0) : v(t)(v(S).title) ? (m(), s(r, { key: 1 }, [l(_(v(S).title), 1)], 64)) : o("", !0)], 16)]),
|
|
26
26
|
_: 3
|
|
27
|
-
}, 16));
|
|
27
|
+
}, 16))], 64));
|
|
28
28
|
}
|
|
29
29
|
});
|
|
30
30
|
//#endregion
|
|
@@ -2,6 +2,7 @@ import { ListSectionOwnProps, ListSectionProps } from '../listSection.types';
|
|
|
2
2
|
export declare function useListSection(props: ListSectionOwnProps): {
|
|
3
3
|
merged: import('vue').ComputedRef<ListSectionOwnProps>;
|
|
4
4
|
rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Omit<Omit<ListSectionProps, "classes" | "customProps" | "title" | "as" | "inset" | "sticky">, never>>>;
|
|
5
|
+
isHidden: import('vue').ComputedRef<boolean>;
|
|
5
6
|
titleBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
|
|
6
7
|
role: string;
|
|
7
8
|
class: string;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
|
|
2
2
|
import { LIST_INJECTION_KEY as r } from "../../List/listInjectionKey.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
3
|
+
import { LIST_SECTION_INJECTION_KEY as i } from "../listSectionInjectionKey.js";
|
|
4
|
+
import { computed as a, inject as o, toValue as s, useAttrs as c } from "vue";
|
|
5
|
+
import { get as l, omit as u } from "es-toolkit/compat";
|
|
6
|
+
import { cn as d, splitComponentProps as f } from "@bridge-ui/core/Utils";
|
|
6
7
|
//#region src/Components/ListSection/composables/useListSection.ts
|
|
7
|
-
var
|
|
8
|
+
var p = [
|
|
8
9
|
"as",
|
|
9
10
|
"inset",
|
|
10
11
|
"title",
|
|
@@ -12,39 +13,40 @@ var f = [
|
|
|
12
13
|
"classes",
|
|
13
14
|
"customProps"
|
|
14
15
|
];
|
|
15
|
-
function
|
|
16
|
-
let
|
|
16
|
+
function m(m) {
|
|
17
|
+
let h = c(), g = o(r, null), _ = o(i, null), v = a(() => f({
|
|
17
18
|
props: {
|
|
18
|
-
...
|
|
19
|
-
...
|
|
19
|
+
...h,
|
|
20
|
+
...m
|
|
20
21
|
},
|
|
21
|
-
bridgeKeys:
|
|
22
|
-
})), { merged:
|
|
22
|
+
bridgeKeys: p
|
|
23
|
+
})), { merged: y, entry: b } = t({
|
|
23
24
|
componentName: "ListSection",
|
|
24
|
-
props: () =>
|
|
25
|
-
}),
|
|
26
|
-
entry:
|
|
27
|
-
props: () =>
|
|
28
|
-
}),
|
|
25
|
+
props: () => v.value.componentProps
|
|
26
|
+
}), x = a(() => y.value.customProps), S = n({
|
|
27
|
+
entry: b,
|
|
28
|
+
props: () => v.value.componentProps
|
|
29
|
+
}), C = a(() => g ? s(g).dense : !1), w = a(() => _ ? s(_).hidden : !1), T = a(() => u(v.value.inheritedAttrs, [])), E = a(() => y.value.as === "div");
|
|
29
30
|
return {
|
|
30
|
-
merged:
|
|
31
|
-
rootBind:
|
|
31
|
+
merged: y,
|
|
32
|
+
rootBind: a(() => e(x.value?.root, T.value, d({
|
|
32
33
|
"list-none": !0,
|
|
33
|
-
"sticky top-0 z-10 bg-white dark:bg-dark-800":
|
|
34
|
-
[
|
|
34
|
+
"sticky top-0 z-10 bg-white dark:bg-dark-800": y.value.sticky && !E.value,
|
|
35
|
+
[l(S.value, "root") ?? ""]: !0
|
|
35
36
|
}))),
|
|
36
|
-
|
|
37
|
+
isHidden: w,
|
|
38
|
+
titleBind: a(() => e(x.value?.title, {}, {
|
|
37
39
|
role: "presentation",
|
|
38
|
-
class:
|
|
39
|
-
"bg-white px-
|
|
40
|
-
"sticky top-0 z-10":
|
|
41
|
-
"py-2": !
|
|
42
|
-
"py-1.5":
|
|
43
|
-
"pl-14":
|
|
44
|
-
[
|
|
40
|
+
class: d({
|
|
41
|
+
"bg-white px-2 text-xs font-semibold tracking-wide text-dark-500 uppercase dark:bg-dark-800 dark:text-dark-300": !0,
|
|
42
|
+
"sticky top-0 z-10": y.value.sticky && E.value,
|
|
43
|
+
"py-2": !C.value,
|
|
44
|
+
"py-1.5": C.value,
|
|
45
|
+
"pl-14": y.value.inset,
|
|
46
|
+
[l(S.value, "title") ?? ""]: !0
|
|
45
47
|
})
|
|
46
48
|
}))
|
|
47
49
|
};
|
|
48
50
|
}
|
|
49
51
|
//#endregion
|
|
50
|
-
export {
|
|
52
|
+
export { m as useListSection };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { SidebarOwnProps, SidebarSlots } from './sidebar.types';
|
|
2
|
+
type __VLS_Slots = SidebarSlots;
|
|
3
|
+
declare const __VLS_base: import('vue').DefineComponent<SidebarOwnProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SidebarOwnProps> & Readonly<{}>, {
|
|
4
|
+
variant: import('@bridge-ui/core/Utils').MergeProps<import('@bridge-ui/core/Tokens').SidebarVariant, import('./sidebar.types').SidebarVariantOverrides>;
|
|
5
|
+
ariaLabel: string;
|
|
6
|
+
collapsible: import('@bridge-ui/core/Utils').MergeProps<import('@bridge-ui/core/Tokens').SidebarCollapsible, import('./sidebar.types').SidebarCollapsibleOverrides>;
|
|
7
|
+
side: import('@bridge-ui/core/Utils').MergeProps<import('@bridge-ui/core/Tokens').SidebarSide, import('./sidebar.types').SidebarSideOverrides>;
|
|
8
|
+
}, {}, {}, {}, 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,59 @@
|
|
|
1
|
+
import { hasNamedSlot as e } from "../../Utils/slotOrProp.js";
|
|
2
|
+
import t from "../Drawer/Drawer.js";
|
|
3
|
+
import { useSidebarShell as n } from "./composables/useSidebarShell.js";
|
|
4
|
+
import { Fragment as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, defineComponent as c, guardReactiveProps as l, mergeProps as u, normalizeProps as d, openBlock as f, renderSlot as p, unref as m, withCtx as h } from "vue";
|
|
5
|
+
//#region src/Components/Sidebar/Sidebar.vue?vue&type=script&setup=true&lang.ts
|
|
6
|
+
var g = /*@__PURE__*/ c({
|
|
7
|
+
name: "Sidebar",
|
|
8
|
+
inheritAttrs: !1,
|
|
9
|
+
__name: "Sidebar",
|
|
10
|
+
props: {
|
|
11
|
+
ariaLabel: { default: "Sidebar" },
|
|
12
|
+
classes: {},
|
|
13
|
+
collapsible: { default: "offcanvas" },
|
|
14
|
+
customProps: {},
|
|
15
|
+
side: { default: "left" },
|
|
16
|
+
variant: { default: "sidebar" }
|
|
17
|
+
},
|
|
18
|
+
setup(c) {
|
|
19
|
+
let { slots: g, merged: _, panelId: v, gapBind: y, rootBind: b, isMobile: x, asideBind: S, panelBind: C, headerBind: w, footerBind: T, openMobile: E, contentBind: D, showAsDrawer: O, setOpenMobile: k, drawerPanelStyle: A } = n(c, {
|
|
20
|
+
side: "left",
|
|
21
|
+
variant: "sidebar",
|
|
22
|
+
ariaLabel: "Sidebar",
|
|
23
|
+
collapsible: "offcanvas"
|
|
24
|
+
});
|
|
25
|
+
return (n, c) => (f(), o(r, null, [s("div", d(l(m(b))), [s("div", d(l(m(y))), null, 16), s("aside", d(l(m(S))), [s("div", d(l(m(C))), [m(O) ? a("", !0) : (f(), o(r, { key: 0 }, [
|
|
26
|
+
m(e)(m(g), "header") ? (f(), o("div", d(u({ key: 0 }, m(w))), [p(n.$slots, "header")], 16)) : a("", !0),
|
|
27
|
+
s("div", d(l(m(D))), [p(n.$slots, "default")], 16),
|
|
28
|
+
m(e)(m(g), "footer") ? (f(), o("div", d(u({ key: 1 }, m(T))), [p(n.$slots, "footer")], 16)) : a("", !0)
|
|
29
|
+
], 64))], 16)], 16)], 16), m(x) ? (f(), i(m(t), {
|
|
30
|
+
key: 0,
|
|
31
|
+
placement: m(_).side,
|
|
32
|
+
"model-value": m(E),
|
|
33
|
+
onShowChange: m(k),
|
|
34
|
+
"aria-label": m(_).ariaLabel,
|
|
35
|
+
"onUpdate:modelValue": m(k),
|
|
36
|
+
"custom-props": { panel: {
|
|
37
|
+
class: "p-0",
|
|
38
|
+
style: m(A),
|
|
39
|
+
id: m(O) ? m(v) : void 0
|
|
40
|
+
} }
|
|
41
|
+
}, {
|
|
42
|
+
default: h(() => [m(O) ? (f(), o("div", d(u({ key: 0 }, m(C))), [
|
|
43
|
+
m(e)(m(g), "header") ? (f(), o("div", d(u({ key: 0 }, m(w))), [p(n.$slots, "header")], 16)) : a("", !0),
|
|
44
|
+
s("div", d(l(m(D))), [p(n.$slots, "default")], 16),
|
|
45
|
+
m(e)(m(g), "footer") ? (f(), o("div", d(u({ key: 1 }, m(T))), [p(n.$slots, "footer")], 16)) : a("", !0)
|
|
46
|
+
], 16)) : a("", !0)]),
|
|
47
|
+
_: 3
|
|
48
|
+
}, 8, [
|
|
49
|
+
"placement",
|
|
50
|
+
"model-value",
|
|
51
|
+
"onShowChange",
|
|
52
|
+
"aria-label",
|
|
53
|
+
"onUpdate:modelValue",
|
|
54
|
+
"custom-props"
|
|
55
|
+
])) : a("", !0)], 64));
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
//#endregion
|
|
59
|
+
export { g as default };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { SidebarInsetOwnProps, SidebarInsetSlots } from './sidebar.types';
|
|
2
|
+
type __VLS_Slots = SidebarInsetSlots;
|
|
3
|
+
declare const __VLS_base: import('vue').DefineComponent<SidebarInsetOwnProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SidebarInsetOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
4
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
5
|
+
declare const _default: typeof __VLS_export;
|
|
6
|
+
export default _default;
|
|
7
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
8
|
+
new (): {
|
|
9
|
+
$slots: S;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { useSidebarInset as e } from "./composables/useSidebarInset.js";
|
|
2
|
+
import { createElementBlock as t, defineComponent as n, guardReactiveProps as r, normalizeProps as i, openBlock as a, renderSlot as o, unref as s } from "vue";
|
|
3
|
+
//#region src/Components/Sidebar/SidebarInset.vue?vue&type=script&setup=true&lang.ts
|
|
4
|
+
var c = /*@__PURE__*/ n({
|
|
5
|
+
inheritAttrs: !1,
|
|
6
|
+
name: "SidebarInset",
|
|
7
|
+
__name: "SidebarInset",
|
|
8
|
+
props: {
|
|
9
|
+
classes: {},
|
|
10
|
+
customProps: {}
|
|
11
|
+
},
|
|
12
|
+
setup(n) {
|
|
13
|
+
let { rootBind: c } = e(n);
|
|
14
|
+
return (e, n) => (a(), t("main", i(r(s(c))), [o(e.$slots, "default")], 16));
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
//#endregion
|
|
18
|
+
export { c as default };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ListOwnProps } from '../List/list.types';
|
|
2
|
+
import { SidebarListOwnProps } from './sidebar.types';
|
|
3
|
+
type __VLS_Props = ListOwnProps & SidebarListOwnProps;
|
|
4
|
+
declare var __VLS_8: {};
|
|
5
|
+
type __VLS_Slots = {} & {
|
|
6
|
+
default?: (props: typeof __VLS_8) => 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,40 @@
|
|
|
1
|
+
import e from "../List/List.js";
|
|
2
|
+
import { LIST_SECTION_INJECTION_KEY as t } from "../ListSection/listSectionInjectionKey.js";
|
|
3
|
+
import { useSidebarList as n } from "./composables/useSidebarList.js";
|
|
4
|
+
import { computed as r, createBlock as i, defineComponent as a, guardReactiveProps as o, normalizeProps as s, openBlock as c, provide as l, renderSlot as u, useAttrs as d, withCtx as f } from "vue";
|
|
5
|
+
import { cn as p } from "@bridge-ui/core/Utils";
|
|
6
|
+
//#region src/Components/Sidebar/SidebarList.vue?vue&type=script&setup=true&lang.ts
|
|
7
|
+
var m = /*@__PURE__*/ a({
|
|
8
|
+
inheritAttrs: !1,
|
|
9
|
+
__name: "SidebarList",
|
|
10
|
+
props: {
|
|
11
|
+
as: {},
|
|
12
|
+
classes: {},
|
|
13
|
+
customProps: {},
|
|
14
|
+
dense: { type: Boolean },
|
|
15
|
+
nested: { type: Boolean },
|
|
16
|
+
iconOnly: { type: Boolean }
|
|
17
|
+
},
|
|
18
|
+
setup(a) {
|
|
19
|
+
let m = a, h = d(), { rootClassName: g, iconOnly: _ } = n(m);
|
|
20
|
+
l(t, r(() => ({ hidden: _.value })));
|
|
21
|
+
let v = r(() => {
|
|
22
|
+
let { classes: e, iconOnly: t, ...n } = m;
|
|
23
|
+
return {
|
|
24
|
+
...h,
|
|
25
|
+
...n,
|
|
26
|
+
...m.nested === !0 && _.value ? { hidden: !0 } : {},
|
|
27
|
+
classes: {
|
|
28
|
+
...e,
|
|
29
|
+
root: p(g.value, e?.root)
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
});
|
|
33
|
+
return (t, n) => (c(), i(e, s(o(v.value)), {
|
|
34
|
+
default: f(() => [u(t.$slots, "default")]),
|
|
35
|
+
_: 3
|
|
36
|
+
}, 16));
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
//#endregion
|
|
40
|
+
export { m as default };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ListItemOwnProps, ListItemSlots } from '../ListItem/listItem.types';
|
|
2
|
+
import { SidebarListItemOwnProps } from './sidebar.types';
|
|
3
|
+
type __VLS_Slots = ListItemSlots;
|
|
4
|
+
type __VLS_Props = ListItemOwnProps & SidebarListItemOwnProps;
|
|
5
|
+
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>;
|
|
6
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
7
|
+
declare const _default: typeof __VLS_export;
|
|
8
|
+
export default _default;
|
|
9
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
10
|
+
new (): {
|
|
11
|
+
$slots: S;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
import { hasNamedSlot as e } from "../../Utils/slotOrProp.js";
|
|
2
|
+
import t from "../ListItem/ListItem.js";
|
|
3
|
+
import { useSidebarListItem as n } from "./composables/useSidebarListItem.js";
|
|
4
|
+
import r from "../Tooltip/Tooltip.js";
|
|
5
|
+
import { computed as i, createBlock as a, createElementBlock as o, createSlots as s, createVNode as c, defineComponent as l, guardReactiveProps as u, mergeProps as d, normalizeProps as f, openBlock as p, renderSlot as m, unref as h, useAttrs as g, useSlots as _, withCtx as v } from "vue";
|
|
6
|
+
import { cn as y } from "@bridge-ui/core/Utils";
|
|
7
|
+
//#region src/Components/Sidebar/SidebarListItem.vue?vue&type=script&setup=true&lang.ts
|
|
8
|
+
var b = {
|
|
9
|
+
key: 0,
|
|
10
|
+
class: "list-none"
|
|
11
|
+
}, x = /*@__PURE__*/ l({
|
|
12
|
+
inheritAttrs: !1,
|
|
13
|
+
__name: "SidebarListItem",
|
|
14
|
+
props: {
|
|
15
|
+
as: {},
|
|
16
|
+
classes: {},
|
|
17
|
+
customProps: {},
|
|
18
|
+
dense: { type: Boolean },
|
|
19
|
+
disabled: { type: Boolean },
|
|
20
|
+
divider: { type: Boolean },
|
|
21
|
+
interactive: { type: Boolean },
|
|
22
|
+
primary: {},
|
|
23
|
+
role: {},
|
|
24
|
+
secondary: {},
|
|
25
|
+
selected: { type: Boolean },
|
|
26
|
+
selectedIcon: {},
|
|
27
|
+
value: {},
|
|
28
|
+
tooltip: {},
|
|
29
|
+
tooltipPlacement: {}
|
|
30
|
+
},
|
|
31
|
+
setup(l) {
|
|
32
|
+
let x = l, S = g(), C = _(), { itemClasses: w, accessibleName: T, tooltip: E, tooltipPlacement: D } = n(x), O = i(() => {
|
|
33
|
+
let { classes: e, customProps: t, tooltip: n, tooltipPlacement: r, ...i } = x;
|
|
34
|
+
return {
|
|
35
|
+
...S,
|
|
36
|
+
...i,
|
|
37
|
+
...E.value ? { as: "div" } : {},
|
|
38
|
+
customProps: {
|
|
39
|
+
...t,
|
|
40
|
+
interactive: {
|
|
41
|
+
...T.value ? { "aria-label": T.value } : {},
|
|
42
|
+
...t?.interactive
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
classes: {
|
|
46
|
+
...e,
|
|
47
|
+
end: y(w.value.end, e?.end),
|
|
48
|
+
start: y(w.value.start, e?.start),
|
|
49
|
+
content: y(w.value.content, e?.content),
|
|
50
|
+
interactive: y(w.value.interactive, e?.interactive)
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
});
|
|
54
|
+
return (n, i) => h(E) ? (p(), o("li", b, [c(r, {
|
|
55
|
+
content: h(E),
|
|
56
|
+
placement: h(D),
|
|
57
|
+
classes: {
|
|
58
|
+
root: "flex w-full min-w-0",
|
|
59
|
+
trigger: "flex w-full min-w-0"
|
|
60
|
+
}
|
|
61
|
+
}, {
|
|
62
|
+
trigger: v(() => [c(t, f(u(O.value)), s({ _: 2 }, [
|
|
63
|
+
h(e)(h(C), "default") ? {
|
|
64
|
+
name: "default",
|
|
65
|
+
fn: v(() => [m(n.$slots, "default")]),
|
|
66
|
+
key: "0"
|
|
67
|
+
} : void 0,
|
|
68
|
+
h(e)(h(C), "start") ? {
|
|
69
|
+
name: "start",
|
|
70
|
+
fn: v(() => [m(n.$slots, "start")]),
|
|
71
|
+
key: "1"
|
|
72
|
+
} : void 0,
|
|
73
|
+
h(e)(h(C), "end") ? {
|
|
74
|
+
name: "end",
|
|
75
|
+
fn: v(() => [m(n.$slots, "end")]),
|
|
76
|
+
key: "2"
|
|
77
|
+
} : void 0,
|
|
78
|
+
h(e)(h(C), "primary") ? {
|
|
79
|
+
name: "primary",
|
|
80
|
+
fn: v(() => [m(n.$slots, "primary")]),
|
|
81
|
+
key: "3"
|
|
82
|
+
} : void 0,
|
|
83
|
+
h(e)(h(C), "secondary") ? {
|
|
84
|
+
name: "secondary",
|
|
85
|
+
fn: v(() => [m(n.$slots, "secondary")]),
|
|
86
|
+
key: "4"
|
|
87
|
+
} : void 0
|
|
88
|
+
]), 1040)]),
|
|
89
|
+
_: 3
|
|
90
|
+
}, 8, ["content", "placement"])])) : (p(), a(t, f(d({ key: 1 }, O.value)), s({ _: 2 }, [
|
|
91
|
+
h(e)(h(C), "default") ? {
|
|
92
|
+
name: "default",
|
|
93
|
+
fn: v(() => [m(n.$slots, "default")]),
|
|
94
|
+
key: "0"
|
|
95
|
+
} : void 0,
|
|
96
|
+
h(e)(h(C), "start") ? {
|
|
97
|
+
name: "start",
|
|
98
|
+
fn: v(() => [m(n.$slots, "start")]),
|
|
99
|
+
key: "1"
|
|
100
|
+
} : void 0,
|
|
101
|
+
h(e)(h(C), "end") ? {
|
|
102
|
+
name: "end",
|
|
103
|
+
fn: v(() => [m(n.$slots, "end")]),
|
|
104
|
+
key: "2"
|
|
105
|
+
} : void 0,
|
|
106
|
+
h(e)(h(C), "primary") ? {
|
|
107
|
+
name: "primary",
|
|
108
|
+
fn: v(() => [m(n.$slots, "primary")]),
|
|
109
|
+
key: "3"
|
|
110
|
+
} : void 0,
|
|
111
|
+
h(e)(h(C), "secondary") ? {
|
|
112
|
+
name: "secondary",
|
|
113
|
+
fn: v(() => [m(n.$slots, "secondary")]),
|
|
114
|
+
key: "4"
|
|
115
|
+
} : void 0
|
|
116
|
+
]), 1040));
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
//#endregion
|
|
120
|
+
export { x as default };
|