@flux-ui/dashboard 3.0.0-next.0 → 3.0.0-next.10

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.
Files changed (30) hide show
  1. package/README.md +11 -40
  2. package/dist/component/FluxDashboard.vue.d.ts +13 -6
  3. package/dist/component/FluxDashboard.vue.d.ts.map +1 -1
  4. package/dist/component/FluxDashboardContent.vue.d.ts.map +1 -1
  5. package/dist/component/FluxDashboardHeader.vue.d.ts.map +1 -1
  6. package/dist/component/FluxDashboardMenu.vue.d.ts.map +1 -1
  7. package/dist/component/FluxDashboardNavigation.vue.d.ts.map +1 -1
  8. package/dist/component/FluxDashboardTopBar.vue.d.ts.map +1 -1
  9. package/dist/data/index.d.ts +1 -0
  10. package/dist/data/index.d.ts.map +1 -1
  11. package/dist/index.css +1 -0
  12. package/dist/index.js +221 -0
  13. package/dist/index.js.map +1 -0
  14. package/package.json +15 -16
  15. package/src/component/FluxDashboard.vue +28 -4
  16. package/src/component/FluxDashboardContent.vue +5 -2
  17. package/src/component/FluxDashboardHeader.vue +5 -1
  18. package/src/component/FluxDashboardMenu.vue +5 -2
  19. package/src/component/FluxDashboardNavigation.vue +33 -17
  20. package/src/component/FluxDashboardSide.vue +1 -1
  21. package/src/component/FluxDashboardTopBar.vue +5 -2
  22. package/src/css/component/Dashboard.module.scss +39 -294
  23. package/src/css/component/DashboardContent.module.scss +48 -0
  24. package/src/css/component/DashboardNavigation.module.scss +259 -0
  25. package/src/css/component/DashboardPane.module.scss +84 -0
  26. package/src/css/component/DashboardTopBar.module.scss +55 -0
  27. package/src/data/index.ts +1 -0
  28. package/dist/flux-dashboard.css +0 -1
  29. package/dist/flux-dashboard.js +0 -179
  30. package/dist/flux-dashboard.js.map +0 -1
package/src/css/component/DashboardNavigation.module.scss ADDED
@@ -0,0 +1,259 @@
1
+ @use '../../../../components/src/css/mixin';
2
+
3
+ .dashboardNavigation {
4
+ position: fixed;
5
+ display: flex;
6
+ top: 0;
7
+ left: 0;
8
+ background: var(--dashboard-navigation-background);
9
+ color: var(--dashboard-navigation-foreground);
10
+ z-index: 750;
11
+
12
+ .divider {
13
+ margin: 3px 15px;
14
+ }
15
+
16
+ .dividerLine {
17
+ background: rgb(var(--primary-10));
18
+ }
19
+
20
+ .menu {
21
+ flex-grow: 1;
22
+ }
23
+
24
+ .menuItem {
25
+ height: 54px;
26
+ min-width: 54px;
27
+ padding: 15px;
28
+ gap: 21px;
29
+ color: var(--dashboard-navigation-foreground);
30
+ overflow: hidden;
31
+
32
+ @media (hover: hover) {
33
+ &:hover {
34
+ background: rgb(var(--primary-10));
35
+ }
36
+ }
37
+
38
+ &:active {
39
+ background: rgb(var(--primary-9));
40
+ }
41
+ }
42
+
43
+ .menuItemHighlighted {
44
+ background: rgb(var(--primary-10) / .5);
45
+ }
46
+
47
+ .menuItemIcon {
48
+ color: var(--dashboard-navigation-foreground);
49
+ font-size: 24px;
50
+ }
51
+
52
+ .menuItemLabel {
53
+ transition: var(--dashboard-duration) var(--swift-out);
54
+ transition-property: filter, opacity, translate;
55
+ white-space: nowrap;
56
+ }
57
+ }
58
+
59
+ .dashboardNavigationCollapsed {
60
+ composes: dashboardNavigation;
61
+ }
62
+
63
+ [dark] .dashboardNavigation {
64
+ .dividerLine {
65
+ background: rgb(var(--gray-2));
66
+ }
67
+
68
+ .menuItem {
69
+ @media (hover: hover) {
70
+ &:hover {
71
+ background: rgb(var(--gray-2));
72
+ }
73
+ }
74
+
75
+ &:active {
76
+ background: rgb(var(--gray-3));
77
+ }
78
+ }
79
+
80
+ .menuItemHighlighted {
81
+ background: rgb(var(--gray-1));
82
+ }
83
+ }
84
+
85
+ .dashboardNavigationLogo {
86
+ display: flex;
87
+ height: 54px;
88
+ width: 54px;
89
+ align-items: center;
90
+ justify-content: center;
91
+
92
+ :is(svg) {
93
+ max-height: 48px;
94
+ max-width: 48px;
95
+ width: 100%;
96
+ }
97
+ }
98
+
99
+ .dashboardNavigationRoundingFix {
100
+ position: absolute;
101
+ display: block;
102
+ height: var(--radius);
103
+ width: var(--radius);
104
+ content: '';
105
+ background: var(--dashboard-navigation-background);
106
+ transition: left var(--dashboard-duration) var(--swift-out);
107
+
108
+ &::before {
109
+ position: absolute;
110
+ display: block;
111
+ inset: 0;
112
+ content: '';
113
+ background: rgb(var(--gray-1));
114
+ }
115
+ }
116
+
117
+ .dashboard:not(:has(.dashboardMenu)) .dashboardNavigationRoundingFix::before {
118
+ background: rgb(var(--gray-0));
119
+ }
120
+
121
+ @include mixin.breakpoint-up(lg) {
122
+ .dashboardNavigation {
123
+ height: 100dvh;
124
+ width: 300px;
125
+ padding: 15px;
126
+ flex-flow: column;
127
+ gap: 15px;
128
+ transition: width var(--dashboard-duration) var(--swift-out);
129
+ }
130
+
131
+ .dashboardNavigationCollapsed {
132
+ width: 84px;
133
+
134
+ .menuItemLabel {
135
+ filter: blur(6px);
136
+ opacity: 0;
137
+ translate: -12px 0;
138
+ }
139
+ }
140
+
141
+ .dashboardNavigationHeader {
142
+ display: flex;
143
+
144
+ .menuItem {
145
+ display: none;
146
+ }
147
+ }
148
+
149
+ .dashboardNavigationNav {
150
+ display: flex;
151
+ flex-flow: column;
152
+ flex-grow: 1;
153
+ }
154
+
155
+ .dashboardNavigationRoundingFix {
156
+ left: 100%;
157
+
158
+ &:first-of-type {
159
+ top: 0;
160
+
161
+ &::before {
162
+ border-top-left-radius: var(--radius);
163
+ }
164
+ }
165
+
166
+ &:not(:first-of-type) {
167
+ bottom: 0;
168
+
169
+ &::before {
170
+ border-bottom-left-radius: var(--radius);
171
+ }
172
+ }
173
+ }
174
+ }
175
+
176
+ @include mixin.breakpoint-down(md) {
177
+ .dashboardNavigation {
178
+ width: 100dvw;
179
+ height: 84px;
180
+
181
+ &::after {
182
+ position: fixed;
183
+ display: block;
184
+ inset: 0;
185
+ width: 100dvw;
186
+ height: 100dvh;
187
+ content: '';
188
+ background: rgb(var(--gray-3) / .5);
189
+ backdrop-filter: blur(3px) saturate(180%);
190
+ transition: var(--dashboard-duration) var(--swift-out);
191
+ transition-property: background, backdrop-filter;
192
+ z-index: 1900;
193
+ }
194
+ }
195
+
196
+ .dashboardNavigationHeader {
197
+ display: flex;
198
+ width: inherit;
199
+ height: inherit;
200
+ padding: 0 15px;
201
+ align-items: center;
202
+ flex-flow: row;
203
+ justify-content: space-between;
204
+
205
+ .menuItem {
206
+ align-self: center;
207
+ justify-content: center;
208
+ }
209
+ }
210
+
211
+ .dashboardNavigationNav {
212
+ position: fixed;
213
+ display: flex;
214
+ top: 0;
215
+ left: 0;
216
+ width: min(300px, calc(100dvw - 42px));
217
+ height: 100dvh;
218
+ padding: 15px;
219
+ flex-flow: column;
220
+ background: var(--dashboard-navigation-background);
221
+ transition: translate var(--dashboard-duration) var(--swift-out);
222
+ z-index: 2000;
223
+ }
224
+
225
+ .dashboardNavigationRoundingFix {
226
+ position: fixed;
227
+ top: 84px;
228
+ z-index: 750;
229
+
230
+ &:first-of-type {
231
+ left: 0;
232
+
233
+ &::before {
234
+ border-top-left-radius: var(--radius);
235
+ }
236
+ }
237
+
238
+ &:not(:first-of-type) {
239
+ right: 0;
240
+
241
+ &::before {
242
+ border-top-right-radius: var(--radius);
243
+ }
244
+ }
245
+ }
246
+
247
+ .dashboardNavigationCollapsed {
248
+ &::after {
249
+ background: transparent;
250
+ backdrop-filter: none;
251
+ pointer-events: none;
252
+ }
253
+
254
+ .dashboardNavigationNav {
255
+ pointer-events: none;
256
+ translate: -100% 0;
257
+ }
258
+ }
259
+ }
package/src/css/component/DashboardPane.module.scss ADDED
@@ -0,0 +1,84 @@
1
+ @use '../../../../components/src/css/mixin';
2
+
3
+ .dashboardPane {
4
+ background: rgb(var(--gray-1));
5
+ overflow: auto;
6
+ z-index: 200;
7
+
8
+ .menuSubHeader {
9
+ background: linear-gradient(to bottom, rgb(var(--gray-1)) 75%, transparent);
10
+ }
11
+
12
+ .dashboardTopBar {
13
+ background: rgb(var(--gray-1) / .9);
14
+ }
15
+
16
+ .filter {
17
+ --background: rgb(var(--gray-1));
18
+
19
+ max-height: calc(100dvh - 84px);
20
+ margin-top: -9px;
21
+ padding: 9px 18px 18px;
22
+ width: 100%;
23
+
24
+ .filterHeader {
25
+ margin-left: -18px;
26
+ margin-right: -18px;
27
+ padding-left: 18px;
28
+ padding-right: 18px;
29
+ }
30
+
31
+ .menu {
32
+ font-size: 14px;
33
+ }
34
+
35
+ .menuItemCommand {
36
+ font-size: 12px;
37
+ }
38
+
39
+ .menuItemIcon {
40
+ font-size: 16px;
41
+ }
42
+
43
+ .menu > :where(.divider, .separator) {
44
+ margin-left: -18px;
45
+ margin-right: -18px;
46
+ }
47
+ }
48
+ }
49
+
50
+ .dashboardMenu {
51
+ composes: dashboardPane;
52
+
53
+ border-right: 1px solid rgb(var(--gray-2));
54
+ }
55
+
56
+ .dashboardMenuBody {
57
+ padding: 0 18px 30px;
58
+ }
59
+
60
+ .dashboardSide {
61
+ composes: dashboardPane;
62
+
63
+ border-left: 1px solid rgb(var(--gray-2));
64
+ }
65
+
66
+ @include mixin.breakpoint-up(lg) {
67
+ .dashboardPane {
68
+ position: sticky;
69
+ top: 0;
70
+ height: 100dvh;
71
+ width: 300px;
72
+ grid-row: 1 / span 2;
73
+ }
74
+ }
75
+
76
+ @include mixin.breakpoint-down(md) {
77
+ .dashboardMenu {
78
+ height: calc(100dvh - 84px);
79
+ }
80
+
81
+ .dashboardMenuCollapsed {
82
+ display: none;
83
+ }
84
+ }
package/src/css/component/DashboardTopBar.module.scss ADDED
@@ -0,0 +1,55 @@
1
+ @use '../../../../components/src/css/mixin';
2
+
3
+ .dashboardTopBar {
4
+ position: sticky;
5
+ display: flex;
6
+ top: 0;
7
+ height: 84px;
8
+ padding-left: 30px;
9
+ padding-right: 30px;
10
+ align-items: center;
11
+ flex-flow: row;
12
+ gap: 15px;
13
+ background: rgb(var(--gray-0) / .9);
14
+ backdrop-filter: blur(10px) saturate(180%);
15
+ z-index: 100;
16
+
17
+ > h1 {
18
+ font-size: 18px;
19
+ overflow: hidden;
20
+ text-overflow: ellipsis;
21
+ white-space: nowrap;
22
+ }
23
+
24
+ > .icon {
25
+ color: var(--foreground-prominent);
26
+ }
27
+
28
+ > .separator {
29
+ height: 24px;
30
+ }
31
+ }
32
+
33
+ .dashboardHeader:not(.routeTransitionEnterActive):not(.routeTransitionLeaveActive) {
34
+ transition: box-shadow var(--dashboard-duration) var(--swift-out);
35
+ }
36
+
37
+ .dashboardHeaderScrolled {
38
+ composes: dashboardHeader;
39
+
40
+ box-shadow: var(--shadow-md);
41
+ }
42
+
43
+ [dark] .dashboardHeaderScrolled {
44
+ box-shadow: 0 1px 0 rgb(var(--gray-1)), var(--shadow-md);
45
+ }
46
+
47
+ @include mixin.breakpoint-down(md) {
48
+ .dashboard > .dashboardTopBar {
49
+ top: 84px;
50
+ }
51
+
52
+ .dashboard > .dashboardTopBarCollapsed {
53
+ display: none;
54
+ }
55
+ }
package/src/data/index.ts CHANGED
@@ -3,5 +3,6 @@ import type { InjectionKey, Ref } from 'vue';
3
3
  export const FluxDashboardInjectionKey: InjectionKey<FluxDashboardInjection> = Symbol();
4
4
 
5
5
  export type FluxDashboardInjection = {
6
+ readonly isMenuCollapsed: Ref<boolean>;
6
7
  readonly isNavigationCollapsed: Ref<boolean>;
7
8
  };
package/dist/flux-dashboard.css DELETED
@@ -1 +0,0 @@
1
- .dashboard{--dashboard-navigation-background: rgb(var(--primary-11));display:grid;min-height:100vh;grid-template-columns:auto minmax(0,1fr);background:rgb(var(--gray-0))}.dashboard:has(>.dashboard-menu){grid-template-columns:auto 300px minmax(0,1fr)}.dashboard:has(>.dashboard-side){grid-template-columns:auto minmax(0,1fr) 330px}.dashboard:has(>.dashboard-menu):has(>.dashboard-side){grid-template-columns:auto 300px minmax(0,1fr) 330px}.dashboard .notice.is-fluid+.dashboard-content:not(:has(>.table:first-child)){padding-top:30px}.dashboard .notice.is-fluid+.dashboard-content>.table:first-child{border-top:0}[dark] .dashboard{--dashboard-navigation-background: color-mix(in srgb, rgb(var(--gray-0)), black 50%)}.dashboard-body{position:relative;display:flex;flex-flow:column;flex-grow:1}.dashboard-content{display:flex;padding:0 30px;flex-flow:column;flex-grow:1}.dashboard-content>:is(.calendar,.table){margin-left:-30px;margin-right:-30px;height:calc(100dvh - 84px);flex-grow:1}.dashboard-content>.calendar{border-left:0;border-right:0;border-radius:0}.dashboard-content>.calendar .calendar-actions{padding-left:30px;padding-right:30px}.dashboard-content>.table{border-top:1px solid rgb(var(--gray-3))}.dashboard-content>.table .table-cell:first-child .table-cell-content{padding-left:30px}.dashboard-content>.table .table-cell:last-child .table-cell-content{padding-right:30px}.dashboard-pane{position:sticky;top:0;height:100dvh;flex-shrink:0;background:rgb(var(--gray-1));overflow:auto}.dashboard-pane .menu-sub-header{background:linear-gradient(to bottom,rgb(var(--gray-1)) 75%,transparent)}.dashboard-pane .dashboard-top-bar{background:rgb(var(--gray-1)/.9)}.dashboard-pane .filter{--background: rgb(var(--gray-1));max-height:calc(100dvh - 84px);margin-top:-9px;padding:9px 18px 18px;width:100%}.dashboard-pane .filter .filter-header{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}.dashboard-pane .filter .menu{font-size:14px}.dashboard-pane .filter .menu-item-command{font-size:12px}.dashboard-pane .filter .menu-item-icon{font-size:16px}.dashboard-pane .filter .menu>:where(.divider,.separator){margin-left:-18px;margin-right:-18px}.dashboard-menu{border-right:1px solid rgb(var(--gray-2))}.dashboard-menu-body{padding:0 18px 30px}.dashboard-side{border-left:1px solid rgb(var(--gray-2))}.dashboard-navigation{position:sticky;display:flex;top:0;height:100dvh;width:300px;padding:15px;flex-flow:column;gap:15px;background:var(--dashboard-navigation-background);transition:width .21s var(--swift-out)}.dashboard-navigation .divider{margin:3px 15px}.dashboard-navigation .divider-line{background:rgb(var(--primary-10))}.dashboard-navigation .menu{flex-grow:1}.dashboard-navigation .menu-item{padding:15px;color:rgb(var(--primary-0));overflow:hidden}@media (hover: hover){.dashboard-navigation .menu-item:hover{background:rgb(var(--primary-10))}}.dashboard-navigation .menu-item:active{background:rgb(var(--primary-9))}.dashboard-navigation .menu-item-highlighted{background:rgb(var(--primary-10)/.5)}.dashboard-navigation .menu-item-icon{color:rgb(var(--primary-0));font-size:24px}.dashboard-navigation .menu-item-label{transition:opacity .21s var(--swift-out);white-space:nowrap}[dark] .dashboard-navigation .divider-line{background:rgb(var(--gray-2))}@media (hover: hover){[dark] .dashboard-navigation .menu-item:hover{background:rgb(var(--gray-2))}}[dark] .dashboard-navigation .menu-item:active{background:rgb(var(--gray-3))}[dark] .dashboard-navigation .menu-item-highlighted{background:rgb(var(--gray-1))}.dashboard-navigation-collapsed{width:84px}.dashboard-navigation-collapsed .menu-item{width:54px}.dashboard-navigation-collapsed .menu-item-label{opacity:0}.dashboard-navigation-logo{display:flex;height:54px;width:54px;align-items:center;justify-content:center}.dashboard-navigation-logo :is(svg){max-height:48px;max-width:48px;width:100%}.dashboard-navigation-rounding-fix{position:fixed;display:block;left:300px;height:var(--radius);width:var(--radius);content:"";background:var(--dashboard-navigation-background);transition:left .21s var(--swift-out);z-index:750}.dashboard-navigation-rounding-fix:before{position:absolute;display:block;top:0;right:0;bottom:0;left:0;content:"";background:rgb(var(--gray-1))}.dashboard-navigation-rounding-fix:first-of-type{top:0}.dashboard-navigation-rounding-fix:first-of-type:before{border-top-left-radius:var(--radius)}.dashboard-navigation-rounding-fix:not(:first-of-type){bottom:0}.dashboard-navigation-rounding-fix:not(:first-of-type):before{border-bottom-left-radius:var(--radius)}.dashboard-navigation-rounding-fix-collapsed{left:84px}.dashboard:not(:has(.dashboard-menu)) .dashboard-navigation-rounding-fix:before{background:rgb(var(--gray-0))}.dashboard-top-bar{position:sticky;display:flex;top:0;height:84px;padding-left:30px;padding-right:30px;align-items:center;flex-flow:row;gap:15px;background:rgb(var(--gray-0)/.9);-webkit-backdrop-filter:blur(10px) saturate(180%);backdrop-filter:blur(10px) saturate(180%);z-index:100}.dashboard-top-bar>h1{font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-top-bar>.icon{color:var(--foreground-prominent)}.dashboard-top-bar>.separator{height:24px}
package/dist/flux-dashboard.js DELETED
@@ -1,179 +0,0 @@
1
- import { ref as S, watch as I, defineComponent as c, provide as k, createElementBlock as u, openBlock as t, normalizeClass as i, unref as o, renderSlot as n, createElementVNode as h, createBlock as p, withCtx as f, createCommentVNode as g, createVNode as b, toDisplayString as _, inject as B, useSlots as x, resolveComponent as L, Fragment as D, renderList as T, mergeProps as M, normalizeProps as j, guardReactiveProps as w } from "vue";
2
- import { DateTime as C } from "luxon";
3
- import { FluxIcon as N, FluxSpacer as v } from "@flux-ui/components";
4
- function H(r, a) {
5
- let e = `flux/${r}`, l = S(F() ?? a);
6
- function F() {
7
- if (e in localStorage) {
8
- let d = JSON.parse(localStorage.getItem(e));
9
- return Array.isArray(d) && d[0] === "DateTime" && (d = C.fromISO(d[1])), d;
10
- }
11
- return null;
12
- }
13
- return I(l, (d) => {
14
- let m = d;
15
- C.isDateTime(d) && (m = ["DateTime", d.toISO({ includeOffset: !0, extendedZone: !0 })]), localStorage.setItem(e, JSON.stringify(m));
16
- }), l;
17
- }
18
- const y = Symbol(), O = "dashboard", R = "notice", A = "is-fluid", P = "dashboard-content", E = "table", V = "dashboard-body", z = "calendar", J = "calendar-actions", K = "table-cell", Z = "table-cell-content", q = "dashboard-pane", G = "menu-sub-header", Q = "dashboard-top-bar", U = "filter", W = "filter-header", X = "menu", Y = "menu-item-command", aa = "menu-item-icon", oa = "divider", ea = "separator", na = "dashboard-menu-body", sa = "dashboard-navigation", ta = "divider-line", ra = "menu-item", da = "menu-item-highlighted", ia = "menu-item-label", la = "dashboard-navigation-logo", ua = "dashboard-navigation-rounding-fix", ca = "icon", ha = "dashboard-menu dashboard-pane", ba = "dashboard-side dashboard-pane", ma = "dashboard-navigation-collapsed dashboard-navigation", pa = "dashboard-navigation-rounding-fix-collapsed dashboard-navigation-rounding-fix", s = { dashboard: O, notice: R, isFluid: A, dashboardContent: P, table: E, dashboardBody: V, calendar: z, calendarActions: J, tableCell: K, tableCellContent: Z, dashboardPane: q, menuSubHeader: G, dashboardTopBar: Q, filter: U, filterHeader: W, menu: X, menuItemCommand: Y, menuItemIcon: aa, divider: oa, separator: ea, dashboardMenuBody: na, dashboardNavigation: sa, dividerLine: ta, menuItem: ra, menuItemHighlighted: da, menuItemLabel: ia, dashboardNavigationLogo: la, dashboardNavigationRoundingFix: ua, icon: ca, dashboardMenu: ha, dashboardSide: ba, dashboardNavigationCollapsed: ma, dashboardNavigationRoundingFixCollapsed: pa }, Fa = /* @__PURE__ */ c({
19
- __name: "FluxDashboard",
20
- setup(r) {
21
- const a = H("dashboard-navigation-collapsed", !0);
22
- return k(y, {
23
- isNavigationCollapsed: a
24
- }), (e, l) => (t(), u("div", {
25
- class: i(o(s).dashboard)
26
- }, [
27
- n(e.$slots, "navigation"),
28
- n(e.$slots, "menu"),
29
- h("div", {
30
- class: i(o(s).dashboardBody)
31
- }, [
32
- n(e.$slots, "header"),
33
- n(e.$slots, "default")
34
- ], 2),
35
- n(e.$slots, "side")
36
- ], 2));
37
- }
38
- }), Da = /* @__PURE__ */ c({
39
- __name: "FluxDashboardContent",
40
- setup(r) {
41
- return (a, e) => (t(), u("main", {
42
- class: i(o(s).dashboardContent)
43
- }, [
44
- n(a.$slots, "default")
45
- ], 2));
46
- }
47
- }), $ = /* @__PURE__ */ c({
48
- __name: "FluxDashboardTopBar",
49
- setup(r) {
50
- return (a, e) => (t(), u("header", {
51
- class: i(o(s).dashboardTopBar)
52
- }, [
53
- n(a.$slots, "default")
54
- ], 2));
55
- }
56
- }), ga = { key: 1 }, Ca = /* @__PURE__ */ c({
57
- __name: "FluxDashboardHeader",
58
- props: {
59
- icon: {},
60
- title: {}
61
- },
62
- setup(r) {
63
- return (a, e) => (t(), p($, null, {
64
- default: f(() => [
65
- n(a.$slots, "start"),
66
- a.icon ? (t(), p(o(N), {
67
- key: 0,
68
- name: a.icon
69
- }, null, 8, ["name"])) : g("", !0),
70
- a.title ? (t(), u("h1", ga, _(a.title), 1)) : g("", !0),
71
- b(o(v)),
72
- n(a.$slots, "end")
73
- ]),
74
- _: 3
75
- }));
76
- }
77
- }), Na = /* @__PURE__ */ c({
78
- __name: "FluxDashboardMenu",
79
- props: {
80
- icon: {},
81
- title: {}
82
- },
83
- setup(r) {
84
- return (a, e) => (t(), u("aside", {
85
- class: i(o(s).dashboardMenu)
86
- }, [
87
- b($, null, {
88
- default: f(() => [
89
- n(a.$slots, "top-bar-start"),
90
- a.icon ? (t(), p(o(N), {
91
- key: 0,
92
- name: a.icon
93
- }, null, 8, ["name"])) : g("", !0),
94
- h("h1", null, _(a.title), 1),
95
- b(o(v)),
96
- n(a.$slots, "top-bar-end")
97
- ]),
98
- _: 3
99
- }),
100
- h("div", {
101
- class: i(o(s).dashboardMenuBody)
102
- }, [
103
- n(a.$slots, "default")
104
- ], 2)
105
- ], 2));
106
- }
107
- });
108
- function fa() {
109
- const r = B(y);
110
- if (!r)
111
- throw new Error("[Flux] useDashboardInjection() was used outside a FluxDashboard component.");
112
- return r;
113
- }
114
- const ya = /* @__PURE__ */ c({
115
- inheritAttrs: !1,
116
- __name: "FluxDashboardNavigation",
117
- props: {
118
- logoLocation: {}
119
- },
120
- setup(r) {
121
- const a = x(), { isNavigationCollapsed: e } = fa();
122
- return (l, F) => {
123
- const d = L("router-link");
124
- return t(), u(D, null, [
125
- (t(), u(D, null, T(2, (m) => h("div", {
126
- key: m,
127
- class: i(o(e) ? o(s).dashboardNavigationRoundingFixCollapsed : o(s).dashboardNavigationRoundingFix)
128
- }, null, 2)), 64)),
129
- h("nav", M(l.$attrs, {
130
- class: o(e) ? o(s).dashboardNavigationCollapsed : o(s).dashboardNavigation
131
- }), [
132
- a.logo ? (t(), p(d, {
133
- key: 0,
134
- class: i(o(s).dashboardNavigationLogo),
135
- to: l.logoLocation || "/"
136
- }, {
137
- default: f(() => [
138
- n(l.$slots, "logo", j(w({ isNavigationCollapsed: o(e) })))
139
- ]),
140
- _: 3
141
- }, 8, ["class", "to"])) : g("", !0),
142
- n(l.$slots, "default")
143
- ], 16)
144
- ], 64);
145
- };
146
- }
147
- }), Sa = /* @__PURE__ */ c({
148
- __name: "FluxDashboardSide",
149
- props: {
150
- title: {}
151
- },
152
- setup(r) {
153
- return (a, e) => (t(), u("aside", {
154
- class: i(o(s).dashboardSide)
155
- }, [
156
- b($, null, {
157
- default: f(() => [
158
- n(a.$slots, "top-bar-start"),
159
- h("h1", null, _(a.title), 1),
160
- b(o(v)),
161
- n(a.$slots, "top-bar-end")
162
- ]),
163
- _: 3
164
- }),
165
- n(a.$slots, "default")
166
- ], 2));
167
- }
168
- });
169
- export {
170
- Fa as FluxDashboard,
171
- Da as FluxDashboardContent,
172
- Ca as FluxDashboardHeader,
173
- y as FluxDashboardInjectionKey,
174
- Na as FluxDashboardMenu,
175
- ya as FluxDashboardNavigation,
176
- Sa as FluxDashboardSide,
177
- fa as useDashboardInjection
178
- };
179
- //# sourceMappingURL=flux-dashboard.js.map
package/dist/flux-dashboard.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"flux-dashboard.js","sources":["../../internals/dist/flux-internals.js","../src/data/index.ts","../src/component/FluxDashboard.vue","../src/composable/useDashboardInjection.ts","../src/component/FluxDashboardNavigation.vue"],"sourcesContent":["import{computed as E,ref as O,unref as b}from\"vue\";function C(e,t){let o=O(!1),r=O(e),s=E(()=>{let c=[],m=b(r).month,h=b(r).startOf(\"month\");do c.push(h),h=h.plus({day:1});while(h.month===m);let y=c[0],T=c[c.length-1];for(let x=1;x<y.weekday;++x)c.unshift(y.minus({day:x}));for(let x=T.weekday+1;x<=7;++x)c.push(T.plus({day:x-T.weekday}));while(c.length/7<6){let x=c[c.length-1];for(let A=1;A<=7;++A)c.push(x.plus({day:A}))}return c}),n=E(()=>b(s).slice(0,7).map((c)=>c.toLocaleString({weekday:t?.weekDayLength??\"short\"}))),i=E(()=>b(r).plus({month:1})),a=E(()=>b(r).minus({month:1})),f=E(()=>b(r).toLocaleString({month:t?.monthLength??\"long\"})),l=E(()=>b(r).year.toString());function u(c){o.value=r.value>c,r.value=c}function v(){u(b(r).plus({month:1}))}function L(){u(b(r).minus({month:1}))}return{isTransitioningToPast:o,viewDate:r,viewDateNext:i,viewDatePrevious:a,viewMonth:f,viewYear:l,dates:s,days:n,setViewDate:u,nextMonth:v,previousMonth:L}}import{computed as ue,unref as de}from\"vue\";function _(e,t){return{months:ue(()=>{let r=[],s=de(e),n=s.startOf(\"year\");while(n.month<=12&&n.year===s.year)r.push({date:n,label:n.toLocaleString({month:t})}),n=n.plus({months:1});return r})}}import{computed as me,ref as xe,unref as N,watch as be}from\"vue\";function U(e,t=10){let o=xe(0),r=me(()=>{let i=N(e).year,a=[],f=i-i%t+N(o)*t;for(let l=0;l<t;++l)a.push(f+l);return a});function s(){++o.value}function n(){--o.value}return be(e,()=>o.value=0),{years:r,next:s,previous:n}}import{onMounted as ke,onUnmounted as He,ref as De,unref as G,watchEffect as Ae}from\"vue\";import{Fragment as he}from\"vue\";function P(e){let t=[];for(let o of e){if(o.type===he&&Array.isArray(o.children)){t.push(...o.children);continue}t.push(o)}return t}import{isHtmlElement as ye}from\"@basmilius/utils\";var Te=[\"a:not([disabled])\",\"button:not([disabled])\",\"input[type=checkbox]:not([disabled])\",\"input[type=radio]:not([disabled])\",\"input[type=text]:not([disabled])\",'[tabindex]:not([disabled]):not([tabindex=\"-1\"])'].join(\",\");function d(e){return Array.from(e.querySelectorAll(Te)).filter(ye).filter((t)=>t.offsetWidth>0||t.offsetHeight>0||t===document.activeElement)}function M(e,t,o){let r=d(e),s=r.indexOf(t);if(s===-1)return null;let n=ge(r);ve(n,s,o);let i=Ee(s,o,n,r);if(!i){if(o===\"up\"||o===\"left\")i=r[s-1];if(o===\"down\"||o===\"right\")i=r[s+1]}return i}function ve(e,t,o){let r=e[t];e.forEach((s)=>{let n=s.center;switch(o){case\"up\":n={x:n.x,y:s.top+s.height};break;case\"down\":n={x:n.x,y:s.top};break;case\"left\":n={x:s.left+s.width,y:n.y};break;case\"right\":n={x:s.left,y:n.y};break}s.distance=Math.sqrt(Math.pow(r.center.x-n.x,2)+Math.pow(r.center.y-n.y,2))})}function Ee(e,t,o,r){let s=o[e],n=[];switch(t){case\"up\":n=o.map((a,f)=>f===e||a.top+a.height>s.top?Number.MAX_SAFE_INTEGER:a.distance);break;case\"down\":n=o.map((a,f)=>f===e||a.top<s.top+s.height?Number.MAX_SAFE_INTEGER:a.distance);break;case\"left\":n=o.map((a,f)=>f===e||a.left+a.width>s.left?Number.MAX_SAFE_INTEGER:a.distance);break;case\"right\":n=o.map((a,f)=>f===e||a.left<s.left+s.width?Number.MAX_SAFE_INTEGER:a.distance);break}let i=n.indexOf(Math.min(...n));if(n[i]!==Number.MAX_SAFE_INTEGER)return r[i];return null}function ge(e){return e.map((t)=>t.getBoundingClientRect()).map((t)=>({height:t.height,width:t.width,top:t.top,left:t.left,right:t.right,bottom:t.bottom,center:{x:t.left+t.width/2,y:t.top+t.height/2},distance:0}))}function K(e){let t=\"UnknownComponent\";if(e.type&&e.type.__name)t=e.type.__name;return t}import{camelCase as we}from\"lodash-es\";function z(e){return Object.fromEntries(Object.entries(e.props??{}).map(([t,o])=>[we(t),o]))}function B(e,t){if(!e.exposed||!(t in e.exposed))throw new Error(`'${t}' was not exposed by the component.`);return e.exposed[t]}import{isHtmlElement as Le}from\"@basmilius/utils\";function R(e,t,o=void 0){let r=d(e),s=o||document.activeElement;if(!s||!Le(s))return r[0]||void 0;let n=r.indexOf(s);return r[n+t]||void 0}function F(e){return Array.from(e.querySelectorAll('a[href], button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])')).filter((t)=>!t.hasAttribute(\"disabled\")||t.getAttribute(\"disabled\")!==\"true\").filter((t)=>!t.hasAttribute(\"aria-disabled\")||t.getAttribute(\"aria-disabled\")!==\"true\")}import{isHtmlElement as Me}from\"@basmilius/utils\";import{unref as Re}from\"vue\";function p(e){let t=Re(e);if(Me(t))return t;return t?.$el}function V(...e){console.warn(\"[Flux]\",...e)}function g(e,t,o=!1){let r=Fe(e),s=t.compareDocumentPosition(e),n;if(s&&Node.DOCUMENT_POSITION_PRECEDING||o)n=r.firstChild();else n=r.lastChild();(n!==null?n:e).focus()}function Fe(e){return document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:(t)=>t.tabIndex>=0&&!t.disabled?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP})}class q{get active(){return this.current?.isEnabled??!1}get current(){return this.#e[this.#e.length-1]??null}#t=[];#e=[];add(e,t,o=!0){let r={id:e,setEnabled:t,isEnabled:!0};if(this.current&&this.toggle(this.current,!1),this.#e.push(r),o)this.toggle(r,!0),this.emit()}remove(e){let t=this.#e.find((s)=>s.id===e);t&&this.toggle(t,!1);let r=this.current?.id===e;this.#e=this.#e.filter((s)=>s.id!==e),r&&this.current&&this.toggle(this.current,!0),this.emit()}emit(){this.#t.forEach((e)=>e(this.active,this.#e))}subscribe(e){return this.#t.push(e),e(this.active,this.#e),()=>this.#t=this.#t.filter((t)=>t!==e)}toggle(e,t){e.setEnabled(t),e.isEnabled=t}}var w=new q;var W=!globalThis.document;function X(e,t,o){let r=De([]);ke(()=>{document.addEventListener(\"pointerdown\",s)}),He(()=>{document.removeEventListener(\"pointerdown\",s)});function s(n){if(!G(t))return;!G(r).some((a)=>a.contains(n.target))&&o(n)}Ae(()=>{let n=[];(Array.isArray(e)?e:[e]).forEach((i)=>{let a=p(i);a&&n.push(a)}),r.value=n})}import{computed as Ie,getCurrentInstance as Se}from\"vue\";function Y(){let e=Se();return Ie(()=>e?.uid??(e?.proxy)._uid??0)}import{customRef as Oe,isRef as j,ref as Ce,watch as _e}from\"vue\";function Z(e,t,o=!1){let r=Ce(j(e)?e.value:e),s=Oe((n,i)=>({get(){return n(),r.value},set:Ne((a)=>{r.value=a,i()},t,o)}));if(j(e))_e(e,(n)=>s.value=n);return s}function Ne(e,t,o=!1){let r;return(...s)=>{if(o&&!r)e(...s);clearTimeout(r),r=setTimeout(()=>requestAnimationFrame(()=>e(...s)),t)}}import{onScopeDispose as Ue,watch as Pe}from\"vue\";function $(e,t,o,r={passive:!0}){let s,n=Pe(()=>p(e),(a)=>{if(s?.(),!a)return;a.addEventListener(t,o,r),s=()=>a.removeEventListener(t,o)});function i(){s?.(),n()}Ue(i)}import{onMounted as Ke,onUnmounted as ze,ref as Be,unref as Ve}from\"vue\";function J(e,t){let o=Be();Ke(()=>{s()}),ze(()=>{clearTimeout(o.value)});function r(){o.value=setTimeout(()=>requestAnimationFrame(s),Ve(e))}function s(){r(),t()}}import{ref as qe,watch as We}from\"vue\";function Q(e,t={}){let o=qe(t.initial??!1);return We(e,(r,s,n)=>{let i=p(e);if(!i)return;let a=new IntersectionObserver((f)=>o.value=f[0]?.isIntersecting??!1,t);a.observe(i),n(()=>a.disconnect())},{immediate:!0}),o}import{onScopeDispose as Ge,watch as Xe}from\"vue\";function k(e,t,o){o??={attributes:!0};let r,s=Xe(()=>p(e),(a)=>{if(n(),!a)return;r=new MutationObserver(t),r.observe(a,o)},{immediate:!0});function n(){if(!r)return;r.disconnect(),r=void 0}function i(){n(),s()}Ge(i)}import{DateTime as ee}from\"luxon\";import{ref as Ye,watch as je}from\"vue\";function te(e,t){let o=`flux/${e}`,r=Ye(s()??t);function s(){if(o in localStorage){let n=JSON.parse(localStorage.getItem(o));if(Array.isArray(n)&&n[0]===\"DateTime\")n=ee.fromISO(n[1]);return n}return null}return je(r,(n)=>{let i=n;if(ee.isDateTime(n))i=[\"DateTime\",n.toISO({includeOffset:!0,extendedZone:!0})];localStorage.setItem(o,JSON.stringify(i))}),r}import{ref as se,watch as ae}from\"vue\";import{onMounted as Ze,onUnmounted as $e,ref as oe,unref as ne}from\"vue\";var Je=0;function H(e=!1){let t=oe(`focus-trap-${++Je}`),o=oe(!1);return Ze(()=>w.add(ne(t),(r)=>o.value=r,e)),$e(()=>w.remove(ne(t))),o}import{onUnmounted as Qe,ref as et,unref as re}from\"vue\";function D(e){let t=et(document.activeElement);Qe(()=>{if(re(e))return;requestAnimationFrame(()=>re(t)?.focus())})}function ie(e,t={}){if(W)return;let{disable:o=se(!1),disableReturn:r=se(!1),attachTo:s=null}=t,n=H(!o);D(r),ae(e,(i,a,f)=>{let l=p(e),u=s||document;if(n.value&&l&&document.activeElement&&!l.contains(document.activeElement)&&!l.querySelector(\"[autofocus]\"))g(l,document.activeElement,!0);function v(c){if(!n.value||!l)return;let m=c.target||document.body;if(l.contains(m))return;c.preventDefault(),c.stopImmediatePropagation(),g(l,m)}function L(c){if(!n.value||!l)return;if(!c.relatedTarget||c.relatedTarget===document.body)c.preventDefault(),l.focus();let m=c.target||document.body;if(l.contains(m))return;g(l,m)}if(u.addEventListener(\"focusin\",v,{capture:!0}),u.addEventListener(\"focusout\",L,{capture:!0}),l){let c=d(l),m=c.findIndex((T)=>T.classList.contains(\"is-active\")),h=c.findIndex((T)=>!T.hasAttribute(\"aria-disabled\")),y=c[0];if(m>-1)y=c[m];if(h>-1)y=c[h];if(y)y.focus()}f(()=>{u.removeEventListener(\"focusin\",v),u.removeEventListener(\"focusout\",L)})},{immediate:!0}),ae(()=>o,()=>{let i=p(e);if(n.value=!o,o||!i)return;let a=d(i);if(a.includes(document.activeElement))return;a[0]?.focus()},{immediate:!0})}import{onMounted as tt,onUnmounted as ot,ref as nt}from\"vue\";function ce(e){let t=nt(null);tt(()=>t.value=w.subscribe(e)),ot(()=>t.value?.())}import{watch as rt}from\"vue\";function le(e,{cycle:t=!0,direction:o=\"bidirectional\"}={}){k(e,()=>s(r(),!1));function r(){let i=p(e),a=d(i),f=a.findIndex((u)=>u.classList.contains(\"is-active\")),l=a.findIndex((u)=>!u.hasAttribute(\"aria-disabled\"));if(f>-1)return f;if(l>-1)return l;return 0}function s(i,a=!0){let f=p(e),l=d(f);l.forEach((u,v)=>u.tabIndex=v===i?0:-1),a&&l[i]?.focus()}function n(i){let a=p(e),f=d(a);if([\"Enter\",\" \"].includes(i.key))return;switch(o){case\"bidirectional\":st(i,a,f,s);break;case\"horizontal\":case\"vertical\":at(i,a,t,o,f,s);break}}rt(e,(i,a,f)=>{let l=p(e);if(!l)return;l.addEventListener(\"keydown\",n),s(r(),!1),f(()=>l.removeEventListener(\"keydown\",n))},{immediate:!0})}function st(e,t,o,r){let s;switch(e.key){case\"ArrowUp\":s=\"up\";break;case\"ArrowDown\":s=\"down\";break;case\"ArrowLeft\":s=\"left\";break;case\"ArrowRight\":s=\"right\";break;default:return}let n=M(t,document.activeElement,s);if(n)r(o.indexOf(n));e.preventDefault()}function at(e,t,o,r,s,n){let i;if(e.key===(r===\"horizontal\"?\"ArrowLeft\":\"ArrowUp\"))i=-1;else if(e.key===(r===\"horizontal\"?\"ArrowRight\":\"ArrowDown\"))i=1;else return;let a=R(t,i);if(a)n(s.indexOf(a));else if(o)n(i===1?0:s.length-1);e.preventDefault()}var Jo=\"#f8fafc\",Qo=\"#f1f5f9\",en=\"#e2e8f0\",tn=\"#cbd5e1\",on=\"#94a3b8\",nn=\"#64748b\",rn=\"#475569\",sn=\"#334155\",an=\"#1e293b\",cn=\"#0f172a\",ln=\"#020617\",fn=\"#f9fafb\",pn=\"#f3f4f6\",un=\"#e5e7eb\",dn=\"#d1d5db\",mn=\"#9ca3af\",xn=\"#6b7280\",bn=\"#4b5563\",hn=\"#374151\",yn=\"#1f2937\",Tn=\"#111827\",vn=\"#030712\",En=\"#fafafa\",gn=\"#f4f4f5\",wn=\"#e4e4e7\",Ln=\"#d4d4d8\",Mn=\"#a1a1aa\",Rn=\"#71717a\",Fn=\"#52525b\",kn=\"#3f3f46\",Hn=\"#27272a\",Dn=\"#18181b\",An=\"#09090b\",In=\"#fafafa\",Sn=\"#f5f5f5\",On=\"#e5e5e5\",Cn=\"#d4d4d4\",_n=\"#a3a3a3\",Nn=\"#737373\",Un=\"#525252\",Pn=\"#404040\",Kn=\"#262626\",zn=\"#171717\",Bn=\"#0a0a0a\",Vn=\"#fafaf9\",qn=\"#f5f5f4\",Wn=\"#e7e5e4\",Gn=\"#d6d3d1\",Xn=\"#a8a29e\",Yn=\"#78716c\",jn=\"#57534e\",Zn=\"#44403c\",$n=\"#292524\",Jn=\"#1c1917\",Qn=\"#0c0a09\",er=\"#fef2f2\",tr=\"#fee2e2\",or=\"#fecaca\",nr=\"#fca5a5\",rr=\"#f87171\",sr=\"#ef4444\",ar=\"#dc2626\",ir=\"#b91c1c\",cr=\"#991b1b\",lr=\"#7f1d1d\",fr=\"#450a0a\",pr=\"#fff7ed\",ur=\"#ffedd5\",dr=\"#fed7aa\",mr=\"#fdba74\",xr=\"#fb923c\",br=\"#f97316\",hr=\"#ea580c\",yr=\"#c2410c\",Tr=\"#9a3412\",vr=\"#7c2d12\",Er=\"#431407\",gr=\"#fffbeb\",wr=\"#fef3c7\",Lr=\"#fde68a\",Mr=\"#fcd34d\",Rr=\"#fbbf24\",Fr=\"#f59e0b\",kr=\"#d97706\",Hr=\"#b45309\",Dr=\"#92400e\",Ar=\"#78350f\",Ir=\"#451a03\",Sr=\"#fefce8\",Or=\"#fef9c3\",Cr=\"#fef08a\",_r=\"#fde047\",Nr=\"#facc15\",Ur=\"#eab308\",Pr=\"#ca8a04\",Kr=\"#a16207\",zr=\"#854d0e\",Br=\"#713f12\",Vr=\"#422006\",qr=\"#f7fee7\",Wr=\"#ecfccb\",Gr=\"#d9f99d\",Xr=\"#bef264\",Yr=\"#a3e635\",jr=\"#84cc16\",Zr=\"#65a30d\",$r=\"#4d7c0f\",Jr=\"#3f6212\",Qr=\"#365314\",es=\"#1a2e05\",ts=\"#f0fdf4\",os=\"#dcfce7\",ns=\"#bbf7d0\",rs=\"#86efac\",ss=\"#4ade80\",as=\"#22c55e\",is=\"#16a34a\",cs=\"#15803d\",ls=\"#166534\",fs=\"#14532d\",ps=\"#052e16\",us=\"#ecfdf5\",ds=\"#d1fae5\",ms=\"#a7f3d0\",xs=\"#6ee7b7\",bs=\"#34d399\",hs=\"#10b981\",ys=\"#059669\",Ts=\"#047857\",vs=\"#065f46\",Es=\"#064e3b\",gs=\"#022c22\",ws=\"#f0fdfa\",Ls=\"#ccfbf1\",Ms=\"#99f6e4\",Rs=\"#5eead4\",Fs=\"#2dd4bf\",ks=\"#14b8a6\",Hs=\"#0d9488\",Ds=\"#0f766e\",As=\"#115e59\",Is=\"#134e4a\",Ss=\"#042f2e\",Os=\"#ecfeff\",Cs=\"#cffafe\",_s=\"#a5f3fc\",Ns=\"#67e8f9\",Us=\"#22d3ee\",Ps=\"#06b6d4\",Ks=\"#0891b2\",zs=\"#0e7490\",Bs=\"#155e75\",Vs=\"#164e63\",qs=\"#083344\",Ws=\"#f0f9ff\",Gs=\"#e0f2fe\",Xs=\"#bae6fd\",Ys=\"#7dd3fc\",js=\"#38bdf8\",Zs=\"#0ea5e9\",$s=\"#0284c7\",Js=\"#0369a1\",Qs=\"#075985\",ea=\"#0c4a6e\",ta=\"#082f49\",oa=\"#eff6ff\",na=\"#dbeafe\",ra=\"#bfdbfe\",sa=\"#93c5fd\",aa=\"#60a5fa\",ia=\"#3b82f6\",ca=\"#2563eb\",la=\"#1d4ed8\",fa=\"#1e40af\",pa=\"#1e3a8a\",ua=\"#172554\",da=\"#eef2ff\",ma=\"#e0e7ff\",xa=\"#c7d2fe\",ba=\"#a5b4fc\",ha=\"#818cf8\",ya=\"#6366f1\",Ta=\"#4f46e5\",va=\"#4338ca\",Ea=\"#3730a3\",ga=\"#312e81\",wa=\"#1e1b4b\",La=\"#f5f3ff\",Ma=\"#ede9fe\",Ra=\"#ddd6fe\",Fa=\"#c4b5fd\",ka=\"#a78bfa\",Ha=\"#8b5cf6\",Da=\"#7c3aed\",Aa=\"#6d28d9\",Ia=\"#5b21b6\",Sa=\"#4c1d95\",Oa=\"#2e1065\",Ca=\"#faf5ff\",_a=\"#f3e8ff\",Na=\"#e9d5ff\",Ua=\"#d8b4fe\",Pa=\"#c084fc\",Ka=\"#a855f7\",za=\"#9333ea\",Ba=\"#7e22ce\",Va=\"#6b21a8\",qa=\"#581c87\",Wa=\"#3b0764\",Ga=\"#fdf4ff\",Xa=\"#fae8ff\",Ya=\"#f5d0fe\",ja=\"#f0abfc\",Za=\"#e879f9\",$a=\"#d946ef\",Ja=\"#c026d3\",Qa=\"#a21caf\",ei=\"#86198f\",ti=\"#701a75\",oi=\"#4a044e\",ni=\"#fdf2f8\",ri=\"#fce7f3\",si=\"#fbcfe8\",ai=\"#f9a8d4\",ii=\"#f472b6\",ci=\"#ec4899\",li=\"#db2777\",fi=\"#be185d\",pi=\"#9d174d\",ui=\"#831843\",di=\"#500724\",mi=\"#fff1f2\",xi=\"#ffe4e6\",bi=\"#fecdd3\",hi=\"#fda4af\",yi=\"#fb7185\",Ti=\"#f43f5e\",vi=\"#e11d48\",Ei=\"#be123c\",gi=\"#9f1239\",wi=\"#881337\",Li=\"#4c0519\";class fe{#t;#e;constructor(e){this.#e=[],this.#t=e,this.onKeyDown=this.onKeyDown.bind(this)}focusElement(e,t=!0){if(!this.#e[e])return;for(let o=0;o<this.#e.length;++o)this.#e[o].tabIndex=o===e?0:-1;if(t)this.#e[e]?.focus()}register(){this.#e=F(this.#t),this.#t.addEventListener(\"keydown\",this.onKeyDown),this.focusElement(0,!1)}unregister(){this.#t.removeEventListener(\"keydown\",this.onKeyDown)}onKeyDown(e){let t=this.#t.querySelector('[tabindex=\"0\"]'),o=this.#e.findIndex((r)=>r===t)??0;switch(e.key){case\"ArrowUp\":case\"ArrowLeft\":this.focusElement(o-1);break;case\"ArrowDown\":case\"ArrowRight\":this.focusElement(o+1);break;default:return}e.preventDefault(),e.stopPropagation()}}var it={beforeUnmount(e){I.get(e)?.unregister(),I.delete(e)},mounted(e){let t=new fe(e);t.register(),I.set(e,t)}},I=new WeakMap;class pe{#t;#e;constructor(e){this.#t=e,this.#e=new MutationObserver(this.onMutation.bind(this))}register(){this.#e.observe(this.#t,{childList:!0,subtree:!0}),requestAnimationFrame(this.onMutation.bind(this))}unregister(){this.#e.disconnect()}onMutation(){let{height:e}=getComputedStyle(this.#t);this.#t.style.height=\"auto\";let{height:t}=getComputedStyle(this.#t);if(this.#t.style.height=e,t===e)return;getComputedStyle(this.#t),requestAnimationFrame(()=>requestAnimationFrame(()=>this.#t.style.height=t))}}var ct={beforeUnmount(e){S.get(e)?.unregister(),S.delete(e)},mounted(e){let t=new pe(e);t.register(),S.set(e,t)}},S=new WeakMap;export{An as zinc950,Dn as zinc900,Hn as zinc800,kn as zinc700,Fn as zinc600,Rn as zinc500,En as zinc50,Mn as zinc400,Ln as zinc300,wn as zinc200,gn as zinc100,Vr as yellow950,Br as yellow900,zr as yellow800,Kr as yellow700,Pr as yellow600,Ur as yellow500,Sr as yellow50,Nr as yellow400,_r as yellow300,Cr as yellow200,Or as yellow100,g as wrapFocus,V as warn,Oa as violet950,Sa as violet900,Ia as violet800,Aa as violet700,Da as violet600,Ha as violet500,La as violet50,ka as violet400,Fa as violet300,Ra as violet200,Ma as violet100,ct as vHeightTransition,it as vFocusTrap,te as useRemembered,k as useMutationObserver,J as useInterval,Q as useInView,le as useFocusZone,ce as useFocusTrapSubscription,D as useFocusTrapReturn,H as useFocusTrapLock,ie as useFocusTrap,$ as useEventListener,Z as useDebouncedRef,Y as useComponentId,X as useClickOutside,U as useCalendarYearSwitcher,_ as useCalendarMonthSwitcher,C as useCalendar,p as unrefTemplateElement,Ss as teal950,Is as teal900,As as teal800,Ds as teal700,Hs as teal600,ks as teal500,ws as teal50,Fs as teal400,Rs as teal300,Ms as teal200,Ls as teal100,Qn as stone950,Jn as stone900,$n as stone800,Zn as stone700,jn as stone600,Yn as stone500,Vn as stone50,Xn as stone400,Gn as stone300,Wn as stone200,qn as stone100,ln as slate950,cn as slate900,an as slate800,sn as slate700,rn as slate600,nn as slate500,Jo as slate50,on as slate400,tn as slate300,en as slate200,Qo as slate100,ta as sky950,ea as sky900,Qs as sky800,Js as sky700,$s as sky600,Zs as sky500,Ws as sky50,js as sky400,Ys as sky300,Xs as sky200,Gs as sky100,Li as rose950,wi as rose900,gi as rose800,Ei as rose700,vi as rose600,Ti as rose500,mi as rose50,yi as rose400,hi as rose300,bi as rose200,xi as rose100,fr as red950,lr as red900,cr as red800,ir as red700,ar as red600,sr as red500,er as red50,rr as red400,nr as red300,or as red200,tr as red100,Wa as purple950,qa as purple900,Va as purple800,Ba as purple700,za as purple600,Ka as purple500,Ca as purple50,Pa as purple400,Ua as purple300,Na as purple200,_a as purple100,di as pink950,ui as pink900,pi as pink800,fi as pink700,li as pink600,ci as pink500,ni as pink50,ii as pink400,ai as pink300,si as pink200,ri as pink100,Er as orange950,vr as orange900,Tr as orange800,yr as orange700,hr as orange600,br as orange500,pr as orange50,xr as orange400,mr as orange300,dr as orange200,ur as orange100,Bn as neutral950,zn as neutral900,Kn as neutral800,Pn as neutral700,Un as neutral600,Nn as neutral500,In as neutral50,_n as neutral400,Cn as neutral300,On as neutral200,Sn as neutral100,es as lime950,Qr as lime900,Jr as lime800,$r as lime700,Zr as lime600,jr as lime500,qr as lime50,Yr as lime400,Xr as lime300,Gr as lime200,Wr as lime100,W as isSSR,wa as indigo950,ga as indigo900,Ea as indigo800,va as indigo700,Ta as indigo600,ya as indigo500,da as indigo50,ha as indigo400,ba as indigo300,xa as indigo200,ma as indigo100,ps as green950,fs as green900,ls as green800,cs as green700,is as green600,as as green500,ts as green50,ss as green400,rs as green300,ns as green200,os as green100,vn as gray950,Tn as gray900,yn as gray800,hn as gray700,bn as gray600,xn as gray500,fn as gray50,mn as gray400,dn as gray300,un as gray200,pn as gray100,F as getKeyboardFocusableElements,d as getFocusableElements,R as getFocusableElement,B as getExposedRef,z as getComponentProps,K as getComponentName,M as getBidirectionalFocusElement,oi as fuchsia950,ti as fuchsia900,ei as fuchsia800,Qa as fuchsia700,Ja as fuchsia600,$a as fuchsia500,Ga as fuchsia50,Za as fuchsia400,ja as fuchsia300,Ya as fuchsia200,Xa as fuchsia100,P as flattenVNodeTree,gs as emerald950,Es as emerald900,vs as emerald800,Ts as emerald700,ys as emerald600,hs as emerald500,us as emerald50,bs as emerald400,xs as emerald300,ms as emerald200,ds as emerald100,qs as cyan950,Vs as cyan900,Bs as cyan800,zs as cyan700,Ks as cyan600,Ps as cyan500,Os as cyan50,Us as cyan400,Ns as cyan300,_s as cyan200,Cs as cyan100,ua as blue950,pa as blue900,fa as blue800,la as blue700,ca as blue600,ia as blue500,oa as blue50,aa as blue400,sa as blue300,ra as blue200,na as blue100,Ir as amber950,Ar as amber900,Dr as amber800,Hr as amber700,kr as amber600,Fr as amber500,gr as amber50,Rr as amber400,Mr as amber300,Lr as amber200,wr as amber100,w as FOCUS_TRAP_LOCKS};\n\n//# debugId=B2DEA7799817199364756E2164756E21\n//# sourceMappingURL=flux-internals.js.map\n","import type { InjectionKey, Ref } from 'vue';\n\nexport const FluxDashboardInjectionKey: InjectionKey<FluxDashboardInjection> = Symbol();\n\nexport type FluxDashboardInjection = {\n readonly isNavigationCollapsed: Ref<boolean>;\n};\n","<template>\n <div :class=\"$style.dashboard\">\n <slot name=\"navigation\"/>\n\n <slot name=\"menu\"/>\n\n <div :class=\"$style.dashboardBody\">\n <slot name=\"header\"/>\n <slot/>\n </div>\n\n <slot name=\"side\"/>\n </div>\n</template>\n\n<script\n lang=\"ts\"\n setup>\n import { useRemembered } from '@flux-ui/internals';\n import { provide } from 'vue';\n import { FluxDashboardInjectionKey } from '$fluxDashboard/data';\n import $style from '$fluxDashboard/css/component/Dashboard.module.scss';\n\n const isNavigationCollapsed = useRemembered('dashboard-navigation-collapsed', true);\n\n provide(FluxDashboardInjectionKey, {\n isNavigationCollapsed\n });\n</script>\n","import { inject } from 'vue';\nimport { FluxDashboardInjection, FluxDashboardInjectionKey } from '$fluxDashboard/data';\n\nexport default function (): FluxDashboardInjection {\n const injection = inject(FluxDashboardInjectionKey);\n\n if (!injection) {\n throw new Error('[Flux] useDashboardInjection() was used outside a FluxDashboard component.');\n }\n\n return injection;\n}\n","<template>\n <div\n v-for=\"index of 2\"\n :key=\"index\"\n :class=\"isNavigationCollapsed ? $style.dashboardNavigationRoundingFixCollapsed : $style.dashboardNavigationRoundingFix\"/>\n\n <nav\n v-bind=\"$attrs\"\n :class=\"isNavigationCollapsed ? $style.dashboardNavigationCollapsed : $style.dashboardNavigation\">\n <router-link\n v-if=\"slots.logo\"\n :class=\"$style.dashboardNavigationLogo\"\n :to=\"logoLocation || '/'\">\n <slot\n name=\"logo\"\n v-bind=\"{isNavigationCollapsed}\"/>\n </router-link>\n\n <slot/>\n </nav>\n</template>\n\n<script\n lang=\"ts\"\n setup>\n import type { FluxTo } from '@flux-ui/types';\n import { useDashboardInjection } from '$fluxDashboard/composable';\n import $style from '$fluxDashboard/css/component/Dashboard.module.scss';\n\n defineOptions({\n inheritAttrs: false\n });\n\n defineProps<{\n logoLocation?: FluxTo\n }>();\n\n const slots = defineSlots<{\n default(): any;\n logo?(): any;\n }>();\n\n const {isNavigationCollapsed} = useDashboardInjection();\n</script>\n"],"names":["te","e","t","o","r","Ye","s","n","ee","je","i","FluxDashboardInjectionKey","isNavigationCollapsed","useRemembered","provide","useDashboardInjection","injection","inject","slots","_useSlots"],"mappings":";;;AAAgmO,SAASA,EAAGC,GAAEC,GAAE;AAAC,MAAIC,IAAE,QAAQF,CAAC,IAAGG,IAAEC,EAAGC,OAAKJ,CAAC;AAAE,WAASI,IAAG;AAAC,QAAGH,KAAK,cAAa;AAAC,UAAII,IAAE,KAAK,MAAM,aAAa,QAAQJ,CAAC,CAAC;AAAE,aAAG,MAAM,QAAQI,CAAC,KAAGA,EAAE,CAAC,MAAI,eAAWA,IAAEC,EAAG,QAAQD,EAAE,CAAC,CAAC,IAASA;AAAA,IAAC;AAAC,WAAO;AAAA,EAAI;AAAC,SAAOE,EAAGL,GAAE,CAACG,MAAI;AAAC,QAAIG,IAAEH;AAAE,IAAGC,EAAG,WAAWD,CAAC,MAAEG,IAAE,CAAC,YAAWH,EAAE,MAAM,EAAC,eAAc,IAAG,cAAa,GAAE,CAAC,CAAC,IAAE,aAAa,QAAQJ,GAAE,KAAK,UAAUO,CAAC,CAAC;AAAA,EAAC,CAAC,GAAEN;AAAC;ACE37O,MAAMO,IAAkE,OAAO;;;ACqB5E,UAAAC,IAAwBC,EAAc,kCAAkC,EAAI;AAElF,WAAAC,EAAQH,GAA2B;AAAA,MAC/B,uBAAAC;AAAA,IAAA,CACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxB8C,SAAAG,KAAA;AACzC,QAAAC,IAAYC,EAAON,CAAyB;AAElD,MAAI,CAACK;AACK,UAAA,IAAI,MAAM,4EAA4E;AAGzF,SAAAA;AACX;;;;;;;;AC0BI,UAAME,IAAQC,EAGV,GAEE,EAAC,uBAAAP,EAAqB,IAAIG,GAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}