@base-framework/ui 0.0.6 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{calendar-DR_svCOR.js → calendar-B5TK6tLi.js} +128 -138
- package/dist/{confirmation-D1Y_SgzE.js → confirmation-D020eNiS.js} +1 -1
- package/dist/index.es.js +5 -5
- package/dist/{mobile-nav-wrapper-BS9uUekR.js → mobile-nav-wrapper-CguousG5.js} +8 -8
- package/dist/molecules.es.js +2 -2
- package/dist/organisms.es.js +3 -3
- package/dist/pages.es.js +1 -1
- package/dist/{sidebar-menu-page-DN5qYk-Y.js → sidebar-menu-page-22AUZwFc.js} +1 -1
- package/dist/{tab-DE7bmr2y.js → tab-BGR7fWvY.js} +353 -369
- package/dist/types/components/organisms/navigation/main-link.d.ts +2 -2
- package/package.json +1 -1
|
@@ -1,25 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
import { C as J, I as X } from "./inputs-BF3C3KfF.js";
|
|
10
|
-
import { A as Z, P as ee } from "./calendar-DR_svCOR.js";
|
|
11
|
-
d((e, t) => ({
|
|
1
|
+
import { Button as w, Div as o, On as j, Span as y, Th as O, UseParent as z, I as Y, Thead as U, Tr as F, Table as E, P as g, Li as v, Time as Q, Nav as D, Ul as p, Section as B } from "@base-framework/atoms";
|
|
2
|
+
import { Atom as d, Component as u, Data as S, DateTime as H, Jot as I, router as b, NavLink as M } from "@base-framework/base";
|
|
3
|
+
import { B as R, I as T } from "./icon-B9QUT2NY.js";
|
|
4
|
+
import { Icons as k } from "./icons.es.js";
|
|
5
|
+
import { TableBody as K, List as _ } from "@base-framework/organisms";
|
|
6
|
+
import { C as G, I as V } from "./inputs-BF3C3KfF.js";
|
|
7
|
+
import { A as q, P as J } from "./calendar-B5TK6tLi.js";
|
|
8
|
+
d((t, e) => ({
|
|
12
9
|
class: "flex items-center px-4 py-2",
|
|
13
|
-
...
|
|
14
|
-
children:
|
|
10
|
+
...t,
|
|
11
|
+
children: e
|
|
15
12
|
}));
|
|
16
|
-
d(({ value:
|
|
13
|
+
d(({ value: t, label: e }) => w({
|
|
17
14
|
class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-md px-8 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
|
|
18
|
-
onState: ["performance", { active:
|
|
19
|
-
dataSet: ["performance", ["state",
|
|
20
|
-
click: (s, { state: n }) => n.performance =
|
|
21
|
-
},
|
|
22
|
-
class
|
|
15
|
+
onState: ["performance", { active: t }],
|
|
16
|
+
dataSet: ["performance", ["state", t, "active"]],
|
|
17
|
+
click: (s, { state: n }) => n.performance = t
|
|
18
|
+
}, e));
|
|
19
|
+
class Ee extends u {
|
|
23
20
|
/**
|
|
24
21
|
* This will declare the props for the compiler.
|
|
25
22
|
*
|
|
@@ -37,57 +34,57 @@ class _e extends u {
|
|
|
37
34
|
return o({ class: this.class || "" }, this.children);
|
|
38
35
|
}
|
|
39
36
|
}
|
|
40
|
-
const
|
|
41
|
-
const
|
|
42
|
-
return
|
|
37
|
+
const X = (t) => {
|
|
38
|
+
const e = new Date(t, 11, 31), s = new Date(t, 0, 1);
|
|
39
|
+
return e.getDay() === 4 || // December 31 is a Thursday
|
|
43
40
|
s.getDay() === 4;
|
|
44
|
-
},
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
const n =
|
|
41
|
+
}, Z = (t) => {
|
|
42
|
+
const e = new Date(t.valueOf()), s = (e.getDay() + 6) % 7;
|
|
43
|
+
e.setDate(e.getDate() - s + 3);
|
|
44
|
+
const n = e.getFullYear(), a = new Date(n, 0, 4);
|
|
48
45
|
a.setDate(a.getDate() - (a.getDay() + 6) % 7);
|
|
49
|
-
const i = Math.ceil((
|
|
50
|
-
return i > 52 && !
|
|
46
|
+
const i = Math.ceil((e - a) / 6048e5) + 1;
|
|
47
|
+
return i > 52 && !X(n) ? {
|
|
51
48
|
weekNumber: 1,
|
|
52
49
|
year: n + 1
|
|
53
50
|
} : {
|
|
54
51
|
weekNumber: i,
|
|
55
52
|
year: n
|
|
56
53
|
};
|
|
57
|
-
},
|
|
54
|
+
}, ee = (t, e, s) => {
|
|
58
55
|
if (s === 0) return [];
|
|
59
|
-
const n = new Date(
|
|
56
|
+
const n = new Date(t, e, 0).getDate();
|
|
60
57
|
return Array.from(
|
|
61
58
|
{ length: s },
|
|
62
|
-
(a, i) => new Date(
|
|
59
|
+
(a, i) => new Date(t, e - 1, n - s + i + 1)
|
|
63
60
|
);
|
|
64
|
-
},
|
|
65
|
-
const s = new Date(
|
|
61
|
+
}, te = (t, e, s) => Array.from({ length: s }, (n, a) => new Date(t, e + 1, a + 1)), L = (t, e) => {
|
|
62
|
+
const s = new Date(e, 0, 4), n = (s.getDay() + 6) % 7, a = new Date(s);
|
|
66
63
|
a.setDate(s.getDate() - n);
|
|
67
64
|
const i = new Date(a);
|
|
68
|
-
return i.setDate(a.getDate() + (
|
|
69
|
-
},
|
|
70
|
-
const s = new Date(
|
|
65
|
+
return i.setDate(a.getDate() + (t - 1) * 7), i;
|
|
66
|
+
}, Qe = (t, e) => {
|
|
67
|
+
const s = new Date(t, e, 1).getDay(), n = new Date(t, e + 1, 0).getDate(), a = [];
|
|
71
68
|
let i = [];
|
|
72
69
|
for (let r = 1 - s; r <= n; r++) {
|
|
73
|
-
const h = new Date(
|
|
70
|
+
const h = new Date(t, e, r);
|
|
74
71
|
i.push(r > 0 ? h : null), (i.length === 7 || r === n) && (a.push([...i]), i = []);
|
|
75
72
|
}
|
|
76
73
|
return a;
|
|
77
|
-
},
|
|
78
|
-
const s = new Date(
|
|
74
|
+
}, He = (t, e) => {
|
|
75
|
+
const s = new Date(t, e + 1, 0).getDate(), n = [];
|
|
79
76
|
let a = [];
|
|
80
77
|
for (let i = 1; i <= s; i++)
|
|
81
|
-
a.push(new Date(
|
|
78
|
+
a.push(new Date(t, e, i)), a.length === 7 && (n.push(a), a = []);
|
|
82
79
|
return a.length > 0 && n.push(a), n;
|
|
83
|
-
},
|
|
80
|
+
}, se = (t, e, s) => {
|
|
84
81
|
const n = /* @__PURE__ */ new Date();
|
|
85
|
-
return n.getDate() ===
|
|
86
|
-
},
|
|
87
|
-
const i =
|
|
88
|
-
return
|
|
89
|
-
text:
|
|
90
|
-
disabled: !
|
|
82
|
+
return n.getDate() === t && n.getMonth() === e && n.getFullYear() === s;
|
|
83
|
+
}, ne = ({ day: t, month: e, year: s, weekNumber: n, selectWeek: a }) => {
|
|
84
|
+
const i = se(t, e, s);
|
|
85
|
+
return w({
|
|
86
|
+
text: t || "",
|
|
87
|
+
disabled: !t,
|
|
91
88
|
class: `
|
|
92
89
|
px-2 py-1 text-center rounded-md
|
|
93
90
|
${i ? "bg-accent text-accent-foreground" : ""}
|
|
@@ -95,19 +92,19 @@ const te = (e) => {
|
|
|
95
92
|
`,
|
|
96
93
|
click: () => a(n, s)
|
|
97
94
|
});
|
|
98
|
-
},
|
|
99
|
-
const s = new Date(
|
|
95
|
+
}, ae = (t, e) => {
|
|
96
|
+
const s = new Date(t, e, 1).getDay(), n = new Date(t, e + 1, 0).getDate(), a = ee(t, e, s), i = Array.from({ length: n }, (l, x) => new Date(t, e, x + 1)), r = (a.length + i.length) % 7, h = r === 0 ? 0 : 7 - r, c = te(t, e, h), f = [...a, ...i, ...c], m = [];
|
|
100
97
|
for (let l = 0; l < f.length; l += 7) {
|
|
101
|
-
const x = f.slice(l, l + 7),
|
|
98
|
+
const x = f.slice(l, l + 7), W = x.find((A) => A) || new Date(t, e, 1), { weekNumber: $, year: P } = Z(W);
|
|
102
99
|
m.push({
|
|
103
|
-
weekNumber:
|
|
104
|
-
year:
|
|
100
|
+
weekNumber: $,
|
|
101
|
+
year: P,
|
|
105
102
|
days: x
|
|
106
103
|
});
|
|
107
104
|
}
|
|
108
105
|
return m;
|
|
109
|
-
},
|
|
110
|
-
const { year: a, month: i, currentDate: r } = n, h =
|
|
106
|
+
}, ie = ({ selectWeek: t }) => j("month", (e, s, { data: n }) => {
|
|
107
|
+
const { year: a, month: i, currentDate: r } = n, h = ae(a, i);
|
|
111
108
|
return o(
|
|
112
109
|
{ class: "grid grid-cols-8 gap-1 text-sm px-4 py-2" },
|
|
113
110
|
[
|
|
@@ -118,7 +115,7 @@ const te = (e) => {
|
|
|
118
115
|
class: "grid grid-cols-7 col-span-7 text-center text-muted-foreground items-center"
|
|
119
116
|
},
|
|
120
117
|
["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(
|
|
121
|
-
(c) =>
|
|
118
|
+
(c) => y({ class: "px-1 py-1", text: c })
|
|
122
119
|
)
|
|
123
120
|
),
|
|
124
121
|
// Render each "week" row
|
|
@@ -132,7 +129,7 @@ const te = (e) => {
|
|
|
132
129
|
// Left column: ISO week number
|
|
133
130
|
o({
|
|
134
131
|
class: "font-medium text-center col-span-1 rounded-sm cursor-pointer",
|
|
135
|
-
click: () =>
|
|
132
|
+
click: () => t(c, m),
|
|
136
133
|
// If you have a 'currentWeek' state, you can highlight it with 'onSet'
|
|
137
134
|
onSet: ["currentWeek", {
|
|
138
135
|
"text-primary-foreground": c,
|
|
@@ -144,14 +141,14 @@ const te = (e) => {
|
|
|
144
141
|
o(
|
|
145
142
|
{ class: "grid grid-cols-7 col-span-7 text-center" },
|
|
146
143
|
f.map(
|
|
147
|
-
(l) =>
|
|
144
|
+
(l) => ne({
|
|
148
145
|
year: (l == null ? void 0 : l.getFullYear()) || null,
|
|
149
146
|
month: (l == null ? void 0 : l.getMonth()) || null,
|
|
150
147
|
day: (l == null ? void 0 : l.getDate()) || null,
|
|
151
148
|
week: f,
|
|
152
149
|
weekNumber: c,
|
|
153
150
|
currentDate: r,
|
|
154
|
-
selectWeek:
|
|
151
|
+
selectWeek: t
|
|
155
152
|
})
|
|
156
153
|
)
|
|
157
154
|
)
|
|
@@ -159,51 +156,38 @@ const te = (e) => {
|
|
|
159
156
|
)
|
|
160
157
|
]
|
|
161
158
|
);
|
|
162
|
-
}),
|
|
159
|
+
}), C = ({ label: t, click: e }) => R(
|
|
163
160
|
{
|
|
164
161
|
class: `
|
|
165
162
|
inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
|
|
166
163
|
opacity-50 hover:opacity-100 text-muted-foreground absolute
|
|
167
|
-
${
|
|
164
|
+
${t === "Previous" ? "left-1" : "right-1"}
|
|
168
165
|
focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
|
|
169
166
|
`,
|
|
170
|
-
click:
|
|
171
|
-
"aria-label": `${
|
|
167
|
+
click: e,
|
|
168
|
+
"aria-label": `${t} month`,
|
|
172
169
|
variant: "icon",
|
|
173
|
-
icon:
|
|
170
|
+
icon: t === "Previous" ? k.chevron.single.left : k.chevron.single.right
|
|
174
171
|
}
|
|
175
|
-
),
|
|
176
|
-
|
|
177
|
-
|
|
172
|
+
), oe = ({ next: t, previous: e }) => o({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
|
|
173
|
+
y("[[monthName]] [[year]]"),
|
|
174
|
+
C({
|
|
178
175
|
label: "Previous",
|
|
179
|
-
click:
|
|
176
|
+
click: e
|
|
180
177
|
}),
|
|
181
|
-
|
|
178
|
+
C({
|
|
182
179
|
label: "Next",
|
|
183
|
-
click:
|
|
180
|
+
click: t
|
|
184
181
|
})
|
|
185
182
|
]);
|
|
186
|
-
class
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
b(this, "selectedDate", null);
|
|
195
|
-
/**
|
|
196
|
-
* The selected week.
|
|
197
|
-
* @member {number} selectedWeek
|
|
198
|
-
* @default null
|
|
199
|
-
*/
|
|
200
|
-
b(this, "selectedWeek", null);
|
|
201
|
-
/**
|
|
202
|
-
* The selected call back.
|
|
203
|
-
* @member {function} selectedCallBack
|
|
204
|
-
* @default null
|
|
205
|
-
*/
|
|
206
|
-
b(this, "selectedCallBack", null);
|
|
183
|
+
class Ke extends u {
|
|
184
|
+
/**
|
|
185
|
+
* This will declare the props for the compiler.
|
|
186
|
+
*
|
|
187
|
+
* @returns {void}
|
|
188
|
+
*/
|
|
189
|
+
declareProps() {
|
|
190
|
+
this.selectedDate = null, this.selectedWeek = null, this.selectedCallBack = null;
|
|
207
191
|
}
|
|
208
192
|
/**
|
|
209
193
|
* Initializes the calendar data.
|
|
@@ -211,13 +195,13 @@ class qe extends u {
|
|
|
211
195
|
* @returns {Data}
|
|
212
196
|
*/
|
|
213
197
|
setData() {
|
|
214
|
-
const
|
|
215
|
-
return new
|
|
216
|
-
monthName: this.getMonthName(
|
|
217
|
-
year:
|
|
218
|
-
month:
|
|
219
|
-
currentDate:
|
|
220
|
-
currentWeek:
|
|
198
|
+
const e = /* @__PURE__ */ new Date(), s = this.selectedWeek || this.calculateCurrentWeek(e), n = L(s, e.getFullYear());
|
|
199
|
+
return new S({
|
|
200
|
+
monthName: this.getMonthName(n.getMonth()),
|
|
201
|
+
year: n.getFullYear(),
|
|
202
|
+
month: n.getMonth(),
|
|
203
|
+
currentDate: n.getDate(),
|
|
204
|
+
currentWeek: s
|
|
221
205
|
});
|
|
222
206
|
}
|
|
223
207
|
/**
|
|
@@ -226,9 +210,9 @@ class qe extends u {
|
|
|
226
210
|
* @param {Date} today
|
|
227
211
|
* @returns {Date}
|
|
228
212
|
*/
|
|
229
|
-
getSelectedDate(
|
|
230
|
-
const
|
|
231
|
-
return new Date(
|
|
213
|
+
getSelectedDate(e) {
|
|
214
|
+
const s = this.selectedDate ? new Date(this.selectedDate) : e;
|
|
215
|
+
return new Date(s.getFullYear(), s.getMonth(), s.getDate());
|
|
232
216
|
}
|
|
233
217
|
/**
|
|
234
218
|
* Calculates the ISO week number for a given date.
|
|
@@ -236,11 +220,11 @@ class qe extends u {
|
|
|
236
220
|
* @param {Date} date
|
|
237
221
|
* @returns {number}
|
|
238
222
|
*/
|
|
239
|
-
calculateCurrentWeek(
|
|
240
|
-
const
|
|
241
|
-
|
|
242
|
-
const
|
|
243
|
-
return
|
|
223
|
+
calculateCurrentWeek(e) {
|
|
224
|
+
const s = new Date(e.valueOf()), n = (e.getDay() + 6) % 7;
|
|
225
|
+
s.setDate(s.getDate() - n + 3);
|
|
226
|
+
const a = s.valueOf();
|
|
227
|
+
return s.setMonth(0, 1), s.getDay() !== 4 && s.setMonth(0, 1 + (4 - s.getDay() + 7) % 7), 1 + Math.ceil((a - s) / 6048e5);
|
|
244
228
|
}
|
|
245
229
|
/**
|
|
246
230
|
* Gets the name of the month.
|
|
@@ -248,8 +232,8 @@ class qe extends u {
|
|
|
248
232
|
* @param {number} month
|
|
249
233
|
* @returns {string}
|
|
250
234
|
*/
|
|
251
|
-
getMonthName(
|
|
252
|
-
return
|
|
235
|
+
getMonthName(e) {
|
|
236
|
+
return H.monthNames[e];
|
|
253
237
|
}
|
|
254
238
|
/**
|
|
255
239
|
* Updates the calendar to show the previous month.
|
|
@@ -257,9 +241,9 @@ class qe extends u {
|
|
|
257
241
|
* @returns {void}
|
|
258
242
|
*/
|
|
259
243
|
goToPreviousMonth() {
|
|
260
|
-
const
|
|
261
|
-
let { year:
|
|
262
|
-
|
|
244
|
+
const e = this.data;
|
|
245
|
+
let { year: s, month: n } = e;
|
|
246
|
+
n === 0 ? (n = 11, s--) : n--, this.setDate(n, s);
|
|
263
247
|
}
|
|
264
248
|
/**
|
|
265
249
|
* Updates the calendar to show the next month.
|
|
@@ -267,9 +251,9 @@ class qe extends u {
|
|
|
267
251
|
* @returns {void}
|
|
268
252
|
*/
|
|
269
253
|
goToNextMonth() {
|
|
270
|
-
const
|
|
271
|
-
let { year:
|
|
272
|
-
|
|
254
|
+
const e = this.data;
|
|
255
|
+
let { year: s, month: n } = e;
|
|
256
|
+
n === 11 ? (n = 0, s++) : n++, this.setDate(n, s);
|
|
273
257
|
}
|
|
274
258
|
/**
|
|
275
259
|
* Sets the selected date.
|
|
@@ -279,12 +263,12 @@ class qe extends u {
|
|
|
279
263
|
* @param {number|null} [date=null]
|
|
280
264
|
* @returns {void}
|
|
281
265
|
*/
|
|
282
|
-
setDate(s, n
|
|
266
|
+
setDate(e, s, n) {
|
|
283
267
|
this.data.set({
|
|
284
|
-
year:
|
|
285
|
-
month:
|
|
286
|
-
monthName: this.getMonthName(
|
|
287
|
-
}),
|
|
268
|
+
year: s,
|
|
269
|
+
month: e,
|
|
270
|
+
monthName: this.getMonthName(e)
|
|
271
|
+
}), n && (this.data.currentDate = n);
|
|
288
272
|
}
|
|
289
273
|
/**
|
|
290
274
|
* Handles week selection.
|
|
@@ -292,10 +276,10 @@ class qe extends u {
|
|
|
292
276
|
* @param {number} weekNumber
|
|
293
277
|
* @returns {void}
|
|
294
278
|
*/
|
|
295
|
-
selectWeek(
|
|
296
|
-
this.data.currentWeek =
|
|
297
|
-
const
|
|
298
|
-
this.setDate(
|
|
279
|
+
selectWeek(e, s) {
|
|
280
|
+
this.data.currentWeek = e;
|
|
281
|
+
const n = L(e, s);
|
|
282
|
+
this.setDate(n.getMonth(), n.getFullYear(), n.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(e);
|
|
299
283
|
}
|
|
300
284
|
/**
|
|
301
285
|
* Renders the WeekCalendar component.
|
|
@@ -304,47 +288,47 @@ class qe extends u {
|
|
|
304
288
|
*/
|
|
305
289
|
render() {
|
|
306
290
|
return o({ class: "week-calendar-container border rounded-md bg-background p-3" }, [
|
|
307
|
-
|
|
291
|
+
oe({
|
|
308
292
|
next: () => this.goToNextMonth(),
|
|
309
293
|
previous: () => this.goToPreviousMonth()
|
|
310
294
|
}),
|
|
311
|
-
|
|
312
|
-
selectWeek: (
|
|
295
|
+
ie({
|
|
296
|
+
selectWeek: (e, s) => this.selectWeek(e, s)
|
|
313
297
|
})
|
|
314
298
|
]);
|
|
315
299
|
}
|
|
316
300
|
}
|
|
317
|
-
const
|
|
318
|
-
|
|
319
|
-
]),
|
|
320
|
-
const r =
|
|
321
|
-
return
|
|
301
|
+
const le = (t) => O({ class: `cursor-pointer py-3 px-4 text-base w-10 ${t.class || ""}` }, [
|
|
302
|
+
z((e) => new G({ class: "mr-2", onChange: () => e.toggleAllSelectedRows() }))
|
|
303
|
+
]), re = ({ align: t, sortable: e, key: s, label: n, sort: a, class: i }) => {
|
|
304
|
+
const r = t || "justify-start";
|
|
305
|
+
return O({
|
|
322
306
|
class: `cursor-pointer py-3 px-4 text-base ${i || ""}`,
|
|
323
|
-
click:
|
|
307
|
+
click: e && (() => a(s))
|
|
324
308
|
}, [
|
|
325
309
|
o({ class: `flex flex-auto w-full items-center ${r}` }, [
|
|
326
|
-
|
|
327
|
-
|
|
310
|
+
y(n),
|
|
311
|
+
e && Y({ class: "ml-2", html: k.arrows.upDown })
|
|
328
312
|
])
|
|
329
313
|
]);
|
|
330
|
-
},
|
|
331
|
-
|
|
314
|
+
}, ce = (t) => U([
|
|
315
|
+
F({
|
|
332
316
|
class: "text-muted-foreground border-b",
|
|
333
|
-
map: [
|
|
334
|
-
align:
|
|
335
|
-
sortable:
|
|
336
|
-
key:
|
|
337
|
-
label:
|
|
338
|
-
sort:
|
|
317
|
+
map: [t.headers, (e) => e.label === "checkbox" ? le({ toggle: t.toggle }) : re({
|
|
318
|
+
align: e.align,
|
|
319
|
+
sortable: e.sortable,
|
|
320
|
+
key: e.key,
|
|
321
|
+
label: e.label,
|
|
322
|
+
sort: t.sort
|
|
339
323
|
})]
|
|
340
324
|
})
|
|
341
|
-
]),
|
|
325
|
+
]), de = ({ key: t, rows: e, selectRow: s, rowItem: n }) => new K({
|
|
342
326
|
cache: "table",
|
|
343
|
-
key:
|
|
344
|
-
items:
|
|
327
|
+
key: t,
|
|
328
|
+
items: e,
|
|
345
329
|
rowItem: (a) => n(a, s),
|
|
346
330
|
class: "divide-y divide-border"
|
|
347
|
-
}),
|
|
331
|
+
}), _e = I(
|
|
348
332
|
{
|
|
349
333
|
/**
|
|
350
334
|
* Initializes component data.
|
|
@@ -352,7 +336,7 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
352
336
|
* @returns {Data}
|
|
353
337
|
*/
|
|
354
338
|
setData() {
|
|
355
|
-
return new
|
|
339
|
+
return new S({
|
|
356
340
|
selectedRows: [],
|
|
357
341
|
selected: !1
|
|
358
342
|
});
|
|
@@ -363,8 +347,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
363
347
|
* @returns {void}
|
|
364
348
|
*/
|
|
365
349
|
toggleAllSelectedRows() {
|
|
366
|
-
const
|
|
367
|
-
this.data.selectedRows = s, this.updateSelected(), this.updateTable(!
|
|
350
|
+
const t = this.table.getRows(), e = this.data.selectedRows.length === t.length, s = e ? [] : t;
|
|
351
|
+
this.data.selectedRows = s, this.updateSelected(), this.updateTable(!e);
|
|
368
352
|
},
|
|
369
353
|
/**
|
|
370
354
|
* This will update the selected state.
|
|
@@ -372,8 +356,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
372
356
|
* @returns {void}
|
|
373
357
|
*/
|
|
374
358
|
updateSelected() {
|
|
375
|
-
const
|
|
376
|
-
this.data.selected =
|
|
359
|
+
const t = this.data.get("selectedRows");
|
|
360
|
+
this.data.selected = t.length > 0;
|
|
377
361
|
},
|
|
378
362
|
/**
|
|
379
363
|
* This will get the selected rows.
|
|
@@ -390,19 +374,19 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
390
374
|
* @param {boolean} selected
|
|
391
375
|
* @returns {void}
|
|
392
376
|
*/
|
|
393
|
-
updateTable(
|
|
394
|
-
const
|
|
395
|
-
|
|
377
|
+
updateTable(t) {
|
|
378
|
+
const e = this.table.getRows();
|
|
379
|
+
e.forEach((s) => s.selected = t), this.table.setRows(e);
|
|
396
380
|
},
|
|
397
381
|
/**
|
|
398
382
|
* Handles row selection.
|
|
399
383
|
*
|
|
400
384
|
* @param {object} row
|
|
401
385
|
*/
|
|
402
|
-
selectRow(
|
|
403
|
-
const
|
|
404
|
-
|
|
405
|
-
const s = this.data.get("selectedRows"), n =
|
|
386
|
+
selectRow(t) {
|
|
387
|
+
const e = t.selected ?? !1;
|
|
388
|
+
t.selected = !e;
|
|
389
|
+
const s = this.data.get("selectedRows"), n = t.selected ? [...s, t] : s.filter((a) => a !== t);
|
|
406
390
|
this.data.selectedRows = n, this.updateSelected();
|
|
407
391
|
},
|
|
408
392
|
/**
|
|
@@ -411,18 +395,18 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
411
395
|
* @returns {object}
|
|
412
396
|
*/
|
|
413
397
|
render() {
|
|
414
|
-
const
|
|
398
|
+
const t = this.rows, e = this.border !== !1 ? "border" : "";
|
|
415
399
|
return o({ class: "w-full" }, [
|
|
416
|
-
o({ class: `w-full rounded-md ${
|
|
417
|
-
|
|
400
|
+
o({ class: `w-full rounded-md ${e} overflow-x-auto` }, [
|
|
401
|
+
E({ class: "w-full" }, [
|
|
418
402
|
// @ts-ignore
|
|
419
|
-
this.headers &&
|
|
403
|
+
this.headers && ce({ headers: this.headers, sort: (s) => this.sortRows(s) }),
|
|
420
404
|
// @ts-ignore
|
|
421
405
|
this.customHeader ?? null,
|
|
422
|
-
|
|
406
|
+
de({
|
|
423
407
|
// @ts-ignore
|
|
424
408
|
key: this.key,
|
|
425
|
-
rows:
|
|
409
|
+
rows: t,
|
|
426
410
|
// @ts-ignore
|
|
427
411
|
selectRow: this.selectRow.bind(this),
|
|
428
412
|
// @ts-ignore
|
|
@@ -439,8 +423,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
439
423
|
* @param {array} items
|
|
440
424
|
* @returns {void}
|
|
441
425
|
*/
|
|
442
|
-
remove(
|
|
443
|
-
this.table.remove(
|
|
426
|
+
remove(t) {
|
|
427
|
+
this.table.remove(t);
|
|
444
428
|
},
|
|
445
429
|
/**
|
|
446
430
|
* This will set the items in the list.
|
|
@@ -449,8 +433,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
449
433
|
* @param {array} rows
|
|
450
434
|
* @returns {void}
|
|
451
435
|
*/
|
|
452
|
-
setRows(
|
|
453
|
-
this.table.setRows(
|
|
436
|
+
setRows(t) {
|
|
437
|
+
this.table.setRows(t);
|
|
454
438
|
},
|
|
455
439
|
/**
|
|
456
440
|
* This will append items to the list.
|
|
@@ -459,8 +443,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
459
443
|
* @param {array|object} items
|
|
460
444
|
* @returns {void}
|
|
461
445
|
*/
|
|
462
|
-
append(
|
|
463
|
-
this.table.append(
|
|
446
|
+
append(t) {
|
|
447
|
+
this.table.append(t);
|
|
464
448
|
},
|
|
465
449
|
/**
|
|
466
450
|
* This will mingle the new items with the old items.
|
|
@@ -470,8 +454,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
470
454
|
* @param {boolean} withDelete
|
|
471
455
|
* @returns {void}
|
|
472
456
|
*/
|
|
473
|
-
mingle(
|
|
474
|
-
this.table.mingle(
|
|
457
|
+
mingle(t, e = !1) {
|
|
458
|
+
this.table.mingle(t, e);
|
|
475
459
|
},
|
|
476
460
|
/**
|
|
477
461
|
* This will prepend items to the list.
|
|
@@ -480,8 +464,8 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
480
464
|
* @param {array|object} items
|
|
481
465
|
* @returns {void}
|
|
482
466
|
*/
|
|
483
|
-
prepend(
|
|
484
|
-
this.table.prepend(
|
|
467
|
+
prepend(t) {
|
|
468
|
+
this.table.prepend(t);
|
|
485
469
|
},
|
|
486
470
|
/**
|
|
487
471
|
* This will remove the selected rows.
|
|
@@ -492,45 +476,45 @@ const de = (e) => B({ class: `cursor-pointer py-3 px-4 text-base w-10 ${e.class
|
|
|
492
476
|
this.data.selectedRows = [];
|
|
493
477
|
}
|
|
494
478
|
}
|
|
495
|
-
),
|
|
496
|
-
g({ class: "text-base font-semibold leading-6 m-0" },
|
|
497
|
-
g({ class: "truncate text-sm leading-5 text-muted-foreground m-0" },
|
|
498
|
-
])),
|
|
479
|
+
), ue = d(({ name: t, email: e }) => o({ class: "min-w-0 flex-auto" }, [
|
|
480
|
+
g({ class: "text-base font-semibold leading-6 m-0" }, t),
|
|
481
|
+
g({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, e)
|
|
482
|
+
])), he = () => o({ class: "flex items-center gap-x-1.5" }, [
|
|
499
483
|
o({ class: "flex-none rounded-full bg-emerald-500/20 p-1" }, [
|
|
500
484
|
o({ class: "h-1.5 w-1.5 rounded-full bg-emerald-500" })
|
|
501
485
|
]),
|
|
502
486
|
g({ class: "text-xs leading-5 text-gray-500" }, "Online")
|
|
503
|
-
]),
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
]),
|
|
507
|
-
g({ class: "text-sm leading-6 m-0" },
|
|
508
|
-
|
|
509
|
-
])),
|
|
487
|
+
]), fe = (t) => g({ class: "text-xs leading-5 text-muted-foreground" }, [
|
|
488
|
+
y("Last seen "),
|
|
489
|
+
Q({ datetime: t }, "3h ago")
|
|
490
|
+
]), ge = (t, e) => t === "online" ? he() : fe(e), pe = d(({ role: t, lastSeen: e, status: s }) => o({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
|
|
491
|
+
g({ class: "text-sm leading-6 m-0" }, t),
|
|
492
|
+
ge(s, e)
|
|
493
|
+
])), me = (t) => t.split(" ").map((s) => s[0]).join(""), xe = d((t) => v({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
|
|
510
494
|
o({ class: "flex min-w-0 gap-x-4" }, [
|
|
511
|
-
|
|
512
|
-
|
|
495
|
+
q({ src: t.image, alt: t.name, fallbackText: me(t.name) }),
|
|
496
|
+
ue({ name: t.name, email: t.email })
|
|
513
497
|
]),
|
|
514
|
-
|
|
515
|
-
role:
|
|
516
|
-
lastSeen:
|
|
517
|
-
status:
|
|
498
|
+
pe({
|
|
499
|
+
role: t.role,
|
|
500
|
+
lastSeen: t.lastSeen,
|
|
501
|
+
status: t.status
|
|
518
502
|
})
|
|
519
|
-
])),
|
|
503
|
+
])), Ge = d((t) => new _({
|
|
520
504
|
cache: "list",
|
|
521
505
|
key: "name",
|
|
522
|
-
items:
|
|
506
|
+
items: t.users,
|
|
523
507
|
role: "list",
|
|
524
508
|
class: "divide-y divide-border",
|
|
525
|
-
rowItem:
|
|
526
|
-
})),
|
|
527
|
-
text:
|
|
528
|
-
href:
|
|
509
|
+
rowItem: xe
|
|
510
|
+
})), be = (t, e) => e.includes(t), ke = (t, e, s) => t.exact ? s === e : be(e, s), we = ({ text: t, href: e, exact: s, hidden: n }) => new M({
|
|
511
|
+
text: t,
|
|
512
|
+
href: e,
|
|
529
513
|
exact: s,
|
|
530
514
|
dataSet: ["selected", ["state", !0, "active"]],
|
|
531
515
|
class: `${n ? "hidden" : "inline-flex"} items-center justify-center whitespace-nowrap px-3 py-1.5 text-sm font-medium transition-all rounded-md focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring focus-visible:ring-offset-background hover:bg-primary hover:text-primary-foreground disabled:opacity-50 disabled:pointer-events-none data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm`
|
|
532
516
|
});
|
|
533
|
-
class
|
|
517
|
+
class Ve extends u {
|
|
534
518
|
/**
|
|
535
519
|
* This will declare the props for the compiler.
|
|
536
520
|
*
|
|
@@ -551,14 +535,14 @@ class Ze extends u {
|
|
|
551
535
|
* @returns {object}
|
|
552
536
|
*/
|
|
553
537
|
render() {
|
|
554
|
-
return
|
|
538
|
+
return D(
|
|
555
539
|
{ class: `flex items-center justify-center p-2 text-muted-foreground rounded-md ${this.class || ""}` },
|
|
556
540
|
[
|
|
557
541
|
p({
|
|
558
542
|
class: "flex space-x-4",
|
|
559
|
-
map: [this.options, (
|
|
543
|
+
map: [this.options, (e) => this.addLink(e)],
|
|
560
544
|
watch: {
|
|
561
|
-
value: ["[[path]]",
|
|
545
|
+
value: ["[[path]]", b.data],
|
|
562
546
|
callBack: this.updateLinks.bind(this)
|
|
563
547
|
}
|
|
564
548
|
})
|
|
@@ -571,8 +555,8 @@ class Ze extends u {
|
|
|
571
555
|
* @returns {void}
|
|
572
556
|
*/
|
|
573
557
|
afterSetup() {
|
|
574
|
-
const
|
|
575
|
-
this.updateLinks(
|
|
558
|
+
const e = b.data.path;
|
|
559
|
+
this.updateLinks(e);
|
|
576
560
|
}
|
|
577
561
|
/**
|
|
578
562
|
* This will update the links based on the current path.
|
|
@@ -580,13 +564,13 @@ class Ze extends u {
|
|
|
580
564
|
* @param {string} path
|
|
581
565
|
* @returns {void}
|
|
582
566
|
*/
|
|
583
|
-
updateLinks(
|
|
567
|
+
updateLinks(e) {
|
|
584
568
|
let s = !1;
|
|
585
569
|
this.deactivateAllLinks();
|
|
586
570
|
for (const n of this.links) {
|
|
587
571
|
if (!n.rendered)
|
|
588
572
|
continue;
|
|
589
|
-
|
|
573
|
+
ke(n, n.getLinkPath(), e) ? (this.updateLink(n, !0), s = !0) : this.updateLink(n, !1);
|
|
590
574
|
}
|
|
591
575
|
!s && this.links[0] && this.updateLink(this.links[0], !0);
|
|
592
576
|
}
|
|
@@ -596,8 +580,8 @@ class Ze extends u {
|
|
|
596
580
|
* @returns {void}
|
|
597
581
|
*/
|
|
598
582
|
deactivateAllLinks() {
|
|
599
|
-
for (const
|
|
600
|
-
this.updateLink(
|
|
583
|
+
for (const e of this.links)
|
|
584
|
+
this.updateLink(e, !1);
|
|
601
585
|
}
|
|
602
586
|
/**
|
|
603
587
|
* This will update the link's active state.
|
|
@@ -606,8 +590,8 @@ class Ze extends u {
|
|
|
606
590
|
* @param {boolean} selected
|
|
607
591
|
* @returns {void}
|
|
608
592
|
*/
|
|
609
|
-
updateLink(
|
|
610
|
-
|
|
593
|
+
updateLink(e, s) {
|
|
594
|
+
e.update(s);
|
|
611
595
|
}
|
|
612
596
|
/**
|
|
613
597
|
* This will add a link to the navigation.
|
|
@@ -615,8 +599,8 @@ class Ze extends u {
|
|
|
615
599
|
* @param {object} option
|
|
616
600
|
* @returns {object}
|
|
617
601
|
*/
|
|
618
|
-
addLink({ label:
|
|
619
|
-
const i =
|
|
602
|
+
addLink({ label: e, href: s, exact: n, hidden: a }) {
|
|
603
|
+
const i = we({ text: e, href: s, exact: n, hidden: a });
|
|
620
604
|
return this.links.push(i), i;
|
|
621
605
|
}
|
|
622
606
|
/**
|
|
@@ -628,10 +612,10 @@ class Ze extends u {
|
|
|
628
612
|
this.links = [];
|
|
629
613
|
}
|
|
630
614
|
}
|
|
631
|
-
const
|
|
632
|
-
const
|
|
633
|
-
return o({ class: `flex-none ${
|
|
634
|
-
|
|
615
|
+
const qe = d((t) => {
|
|
616
|
+
const e = t.margin || "m-4 ml-0";
|
|
617
|
+
return o({ class: `flex-none ${e}` }, [
|
|
618
|
+
R({
|
|
635
619
|
variant: "icon",
|
|
636
620
|
class: "back-button",
|
|
637
621
|
click: () => {
|
|
@@ -639,14 +623,14 @@ const et = d((e) => {
|
|
|
639
623
|
window.history.back();
|
|
640
624
|
return;
|
|
641
625
|
}
|
|
642
|
-
|
|
626
|
+
t.backUrl && app.navigate(t.backUrl);
|
|
643
627
|
}
|
|
644
628
|
}, [
|
|
645
|
-
|
|
629
|
+
T(k.arrows.left)
|
|
646
630
|
])
|
|
647
631
|
]);
|
|
648
632
|
});
|
|
649
|
-
class
|
|
633
|
+
class N extends u {
|
|
650
634
|
/**
|
|
651
635
|
* This will declare the props for the compiler.
|
|
652
636
|
*
|
|
@@ -687,7 +671,7 @@ class W extends u {
|
|
|
687
671
|
* @param {object} container
|
|
688
672
|
* @returns {void}
|
|
689
673
|
*/
|
|
690
|
-
setContainer(
|
|
674
|
+
setContainer(e) {
|
|
691
675
|
this.container = app.root;
|
|
692
676
|
}
|
|
693
677
|
/**
|
|
@@ -733,7 +717,7 @@ class W extends u {
|
|
|
733
717
|
return this.children;
|
|
734
718
|
}
|
|
735
719
|
}
|
|
736
|
-
class
|
|
720
|
+
class Je extends N {
|
|
737
721
|
/**
|
|
738
722
|
* This will stop presistence.
|
|
739
723
|
*
|
|
@@ -748,7 +732,7 @@ class tt extends W {
|
|
|
748
732
|
* @returns {object}
|
|
749
733
|
*/
|
|
750
734
|
render() {
|
|
751
|
-
const
|
|
735
|
+
const e = this.container;
|
|
752
736
|
return o(
|
|
753
737
|
{
|
|
754
738
|
onState: [
|
|
@@ -756,7 +740,7 @@ class tt extends W {
|
|
|
756
740
|
loading: !0
|
|
757
741
|
}],
|
|
758
742
|
["docked", (s, n) => {
|
|
759
|
-
s ? (n.className = this.getDockedClassName(),
|
|
743
|
+
s ? (n.className = this.getDockedClassName(), e.appendChild(n), document.documentElement.style.overflowY = "auto") : (n.className = this.getClassName(), app.root.appendChild(n), document.documentElement.style.overflowY = "hidden");
|
|
760
744
|
}]
|
|
761
745
|
]
|
|
762
746
|
},
|
|
@@ -779,8 +763,8 @@ class tt extends W {
|
|
|
779
763
|
* @param {object} container
|
|
780
764
|
* @returns {void}
|
|
781
765
|
*/
|
|
782
|
-
setup(
|
|
783
|
-
this.container =
|
|
766
|
+
setup(e) {
|
|
767
|
+
this.container = e, this.initialize();
|
|
784
768
|
}
|
|
785
769
|
/**
|
|
786
770
|
* This will setup the overlay states.
|
|
@@ -836,7 +820,7 @@ class tt extends W {
|
|
|
836
820
|
document.documentElement.style.overflowY = "auto";
|
|
837
821
|
}
|
|
838
822
|
}
|
|
839
|
-
class
|
|
823
|
+
class Xe extends N {
|
|
840
824
|
/**
|
|
841
825
|
* This will get the overlay type.
|
|
842
826
|
*
|
|
@@ -851,51 +835,51 @@ class st extends W {
|
|
|
851
835
|
* @param {object} container
|
|
852
836
|
* @returns {void}
|
|
853
837
|
*/
|
|
854
|
-
setup(
|
|
855
|
-
this.container =
|
|
838
|
+
setup(e) {
|
|
839
|
+
this.container = e, this.initialize();
|
|
856
840
|
}
|
|
857
841
|
}
|
|
858
|
-
const
|
|
842
|
+
const ye = d(({ index: t, click: e, state: s }, n) => v({
|
|
859
843
|
class: "p-2 cursor-pointer hover:bg-muted/50",
|
|
860
844
|
onState: [
|
|
861
845
|
[s, "selectedIndex", {
|
|
862
|
-
"bg-accent":
|
|
863
|
-
"text-white":
|
|
846
|
+
"bg-accent": t,
|
|
847
|
+
"text-white": t
|
|
864
848
|
}]
|
|
865
849
|
],
|
|
866
|
-
pointerdown: () => t
|
|
867
|
-
}, n)),
|
|
850
|
+
pointerdown: () => e(t)
|
|
851
|
+
}, n)), ve = d(({ selectOption: t, state: e }) => p({
|
|
868
852
|
class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
|
|
869
|
-
for: ["filteredOptions", (s, n) =>
|
|
870
|
-
})),
|
|
871
|
-
|
|
853
|
+
for: ["filteredOptions", (s, n) => ye({ index: n, click: t, state: e }, s.label)]
|
|
854
|
+
})), De = 100, Se = d((t) => o({ class: "relative flex items-center" }, [
|
|
855
|
+
V({
|
|
872
856
|
cache: "input",
|
|
873
|
-
placeholder:
|
|
874
|
-
bind: [
|
|
875
|
-
keyup: (
|
|
876
|
-
s.state.open = !0, typeof
|
|
857
|
+
placeholder: t.placeholder ?? "Search...",
|
|
858
|
+
bind: [t.state, "searchQuery"],
|
|
859
|
+
keyup: (e, s) => {
|
|
860
|
+
s.state.open = !0, typeof t.filterOptions == "function" && t.filterOptions(), s.dropdown.updatePosition();
|
|
877
861
|
},
|
|
878
|
-
pointerup: (
|
|
879
|
-
blur: (
|
|
880
|
-
keydown: (
|
|
862
|
+
pointerup: (e, s) => s.toggleDropdown(),
|
|
863
|
+
blur: (e, { state: s }) => setTimeout(() => s.open = !1, De),
|
|
864
|
+
keydown: (e) => typeof t.handleKeyDown == "function" && t.handleKeyDown(e)
|
|
881
865
|
}),
|
|
882
|
-
|
|
883
|
-
|
|
866
|
+
t.icon && o({ class: "absolute right-0 mr-2" }, [
|
|
867
|
+
T(t.icon)
|
|
884
868
|
])
|
|
885
|
-
])),
|
|
869
|
+
])), Le = (t) => o({
|
|
886
870
|
class: "relative flex fle-auto flex-col",
|
|
887
|
-
onState: ["open", (
|
|
888
|
-
if (
|
|
889
|
-
return new
|
|
871
|
+
onState: ["open", (e, s, n) => {
|
|
872
|
+
if (e)
|
|
873
|
+
return new J({
|
|
890
874
|
cache: "dropdown",
|
|
891
875
|
parent: n,
|
|
892
876
|
button: n.input,
|
|
893
877
|
size: "xl"
|
|
894
878
|
}, [
|
|
895
|
-
|
|
879
|
+
ve(t)
|
|
896
880
|
]);
|
|
897
881
|
}]
|
|
898
|
-
}),
|
|
882
|
+
}), Ze = I(
|
|
899
883
|
{
|
|
900
884
|
/**
|
|
901
885
|
* This will set up the data object.
|
|
@@ -903,10 +887,10 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
903
887
|
* @returns {object} - The data object.
|
|
904
888
|
*/
|
|
905
889
|
setData() {
|
|
906
|
-
const
|
|
907
|
-
return new
|
|
908
|
-
options:
|
|
909
|
-
filteredOptions:
|
|
890
|
+
const t = this.options || [];
|
|
891
|
+
return new S({
|
|
892
|
+
options: t,
|
|
893
|
+
filteredOptions: t
|
|
910
894
|
});
|
|
911
895
|
},
|
|
912
896
|
/**
|
|
@@ -927,10 +911,10 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
927
911
|
* @returns {void}
|
|
928
912
|
*/
|
|
929
913
|
setSelectedIndexByQuery() {
|
|
930
|
-
const
|
|
931
|
-
let { searchQuery:
|
|
932
|
-
|
|
933
|
-
const s =
|
|
914
|
+
const t = this.data.filteredOptions;
|
|
915
|
+
let { searchQuery: e } = this.state;
|
|
916
|
+
e = e.toLowerCase();
|
|
917
|
+
const s = t.findIndex((n) => n.label.toLowerCase() === e);
|
|
934
918
|
s >= 0 && (this.state.selectedIndex = s);
|
|
935
919
|
},
|
|
936
920
|
/**
|
|
@@ -939,14 +923,14 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
939
923
|
* @returns {void}
|
|
940
924
|
*/
|
|
941
925
|
filterOptions() {
|
|
942
|
-
const
|
|
943
|
-
if (
|
|
926
|
+
const t = this.state.searchQuery.toLowerCase();
|
|
927
|
+
if (t === "" || t.length === 0) {
|
|
944
928
|
this.data.filteredOptions = this.data.options;
|
|
945
929
|
return;
|
|
946
930
|
}
|
|
947
|
-
const
|
|
948
|
-
this.data.filteredOptions =
|
|
949
|
-
(s) => s.label.toLowerCase().includes(
|
|
931
|
+
const e = this.data.get("options");
|
|
932
|
+
this.data.filteredOptions = e.filter(
|
|
933
|
+
(s) => s.label.toLowerCase().includes(t)
|
|
950
934
|
);
|
|
951
935
|
},
|
|
952
936
|
/**
|
|
@@ -955,8 +939,8 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
955
939
|
* @returns {object}
|
|
956
940
|
*/
|
|
957
941
|
getValue() {
|
|
958
|
-
const { selectedIndex:
|
|
959
|
-
return
|
|
942
|
+
const { selectedIndex: t } = this.state;
|
|
943
|
+
return t < 0 ? null : this.data.get(`filteredOptions[${t}]`);
|
|
960
944
|
},
|
|
961
945
|
/**
|
|
962
946
|
* This will select an option.
|
|
@@ -964,10 +948,10 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
964
948
|
* @param {number} index - The index of the option.
|
|
965
949
|
* @returns {void}
|
|
966
950
|
*/
|
|
967
|
-
selectOption(
|
|
968
|
-
this.state.selectedIndex =
|
|
969
|
-
const
|
|
970
|
-
this.state.searchQuery =
|
|
951
|
+
selectOption(t) {
|
|
952
|
+
this.state.selectedIndex = t;
|
|
953
|
+
const e = this.data.get(`filteredOptions[${t}]`);
|
|
954
|
+
this.state.searchQuery = e.label, this.state.open = !1, typeof this.onSelect == "function" && this.onSelect(e);
|
|
971
955
|
},
|
|
972
956
|
/**
|
|
973
957
|
* Toggles the dropdown open state.
|
|
@@ -981,9 +965,9 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
981
965
|
* @param {object} event - The event object.
|
|
982
966
|
* @returns {void}
|
|
983
967
|
*/
|
|
984
|
-
handleKeyDown(
|
|
985
|
-
const
|
|
986
|
-
|
|
968
|
+
handleKeyDown(t) {
|
|
969
|
+
const e = this.data.filteredOptions, { selectedIndex: s } = this.state;
|
|
970
|
+
t.key === "ArrowDown" ? (t.preventDefault(), this.state.selectedIndex = Math.min(s + 1, e.length - 1)) : t.key === "ArrowUp" ? (t.preventDefault(), this.state.selectedIndex = Math.max(s - 1, 0)) : t.key === "Enter" && s >= 0 && (t.preventDefault(), this.selectOption(s));
|
|
987
971
|
},
|
|
988
972
|
/**
|
|
989
973
|
* This will render the component.
|
|
@@ -992,7 +976,7 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
992
976
|
*/
|
|
993
977
|
render() {
|
|
994
978
|
return o({ class: "relative w-full max-w-md" }, [
|
|
995
|
-
|
|
979
|
+
Se({
|
|
996
980
|
// @ts-ignore
|
|
997
981
|
state: this.state,
|
|
998
982
|
// @ts-ignore
|
|
@@ -1004,7 +988,7 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
1004
988
|
// @ts-ignore
|
|
1005
989
|
handleKeyDown: this.handleKeyDown.bind(this)
|
|
1006
990
|
}),
|
|
1007
|
-
|
|
991
|
+
Le({
|
|
1008
992
|
// @ts-ignore
|
|
1009
993
|
state: this.state,
|
|
1010
994
|
// @ts-ignore
|
|
@@ -1015,22 +999,22 @@ const Se = d(({ index: e, click: t, state: s }, n) => D({
|
|
|
1015
999
|
]);
|
|
1016
1000
|
}
|
|
1017
1001
|
}
|
|
1018
|
-
),
|
|
1002
|
+
), Ce = (t) => v(
|
|
1019
1003
|
{
|
|
1020
1004
|
class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm",
|
|
1021
|
-
dataSet: ["selected", ["state",
|
|
1005
|
+
dataSet: ["selected", ["state", t.value, "active"]]
|
|
1022
1006
|
},
|
|
1023
1007
|
[
|
|
1024
|
-
|
|
1008
|
+
w({
|
|
1025
1009
|
class: "flex flex-auto justify-center items-center px-3 py-1.5",
|
|
1026
|
-
onSet: ["selected", { selected:
|
|
1027
|
-
click: (
|
|
1028
|
-
},
|
|
1010
|
+
onSet: ["selected", { selected: t.value }],
|
|
1011
|
+
click: (e) => t.callBack(t.value)
|
|
1012
|
+
}, t.label)
|
|
1029
1013
|
]
|
|
1030
|
-
),
|
|
1031
|
-
p({ class: "flex flex-auto flex-row", map: [
|
|
1014
|
+
), Oe = (t, e) => (t.callBack = e, Ce(t)), Be = (t) => D({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${t.class}` }, [
|
|
1015
|
+
p({ class: "flex flex-auto flex-row", map: [t.options, (e) => Oe(e, t.callBack)] })
|
|
1032
1016
|
]);
|
|
1033
|
-
class
|
|
1017
|
+
class et extends u {
|
|
1034
1018
|
/**
|
|
1035
1019
|
* This will declare the props for the compiler.
|
|
1036
1020
|
*
|
|
@@ -1045,14 +1029,14 @@ class at extends u {
|
|
|
1045
1029
|
* @returns {object}
|
|
1046
1030
|
*/
|
|
1047
1031
|
render() {
|
|
1048
|
-
const
|
|
1032
|
+
const e = this.select.bind(this);
|
|
1049
1033
|
return o({ class: "" }, [
|
|
1050
|
-
|
|
1034
|
+
Be({
|
|
1051
1035
|
class: this.class,
|
|
1052
1036
|
options: this.options,
|
|
1053
|
-
callBack:
|
|
1037
|
+
callBack: e
|
|
1054
1038
|
}),
|
|
1055
|
-
|
|
1039
|
+
B({
|
|
1056
1040
|
class: "tab-content",
|
|
1057
1041
|
onState: ["selected", this.updateContent.bind(this)]
|
|
1058
1042
|
})
|
|
@@ -1064,8 +1048,8 @@ class at extends u {
|
|
|
1064
1048
|
* @returns {*}
|
|
1065
1049
|
*/
|
|
1066
1050
|
getFirstValue() {
|
|
1067
|
-
var
|
|
1068
|
-
return (
|
|
1051
|
+
var e;
|
|
1052
|
+
return (e = this.options[0]) == null ? void 0 : e.value;
|
|
1069
1053
|
}
|
|
1070
1054
|
/**
|
|
1071
1055
|
* This will update the component.
|
|
@@ -1073,8 +1057,8 @@ class at extends u {
|
|
|
1073
1057
|
* @returns {void}
|
|
1074
1058
|
*/
|
|
1075
1059
|
update() {
|
|
1076
|
-
const
|
|
1077
|
-
this.select(null), this.select(
|
|
1060
|
+
const e = this.state.get("selected");
|
|
1061
|
+
this.select(null), this.select(e);
|
|
1078
1062
|
}
|
|
1079
1063
|
/**
|
|
1080
1064
|
* This will select a value.
|
|
@@ -1082,8 +1066,8 @@ class at extends u {
|
|
|
1082
1066
|
* @param {*} value
|
|
1083
1067
|
* @returns {void}
|
|
1084
1068
|
*/
|
|
1085
|
-
select(
|
|
1086
|
-
this.state.selected =
|
|
1069
|
+
select(e) {
|
|
1070
|
+
this.state.selected = e;
|
|
1087
1071
|
}
|
|
1088
1072
|
/**
|
|
1089
1073
|
* This will update the content.
|
|
@@ -1091,13 +1075,13 @@ class at extends u {
|
|
|
1091
1075
|
* @param {*} value
|
|
1092
1076
|
* @returns {object}
|
|
1093
1077
|
*/
|
|
1094
|
-
updateContent(
|
|
1078
|
+
updateContent(e) {
|
|
1095
1079
|
const s = this.options;
|
|
1096
1080
|
if (!s || s.length < 1)
|
|
1097
1081
|
return;
|
|
1098
1082
|
const n = s[0];
|
|
1099
1083
|
for (const a of s)
|
|
1100
|
-
if (a.value ===
|
|
1084
|
+
if (a.value === e)
|
|
1101
1085
|
return a.layout;
|
|
1102
1086
|
return n.layout;
|
|
1103
1087
|
}
|
|
@@ -1107,34 +1091,34 @@ class at extends u {
|
|
|
1107
1091
|
* @returns {object}
|
|
1108
1092
|
*/
|
|
1109
1093
|
setupStates() {
|
|
1110
|
-
const
|
|
1094
|
+
const e = this.callBack, s = typeof e;
|
|
1111
1095
|
return {
|
|
1112
1096
|
selected: {
|
|
1113
1097
|
state: this.getFirstValue(),
|
|
1114
1098
|
callBack(n) {
|
|
1115
|
-
s === "function" &&
|
|
1099
|
+
s === "function" && e(n);
|
|
1116
1100
|
}
|
|
1117
1101
|
}
|
|
1118
1102
|
};
|
|
1119
1103
|
}
|
|
1120
1104
|
}
|
|
1121
|
-
const
|
|
1105
|
+
const Ie = (t) => v(
|
|
1122
1106
|
{
|
|
1123
1107
|
class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm",
|
|
1124
|
-
dataSet: ["selected", ["state",
|
|
1108
|
+
dataSet: ["selected", ["state", t.value, "active"]]
|
|
1125
1109
|
},
|
|
1126
1110
|
[
|
|
1127
|
-
|
|
1111
|
+
w({
|
|
1128
1112
|
class: "flex flex-auto justify-center items-center px-3 py-1.5 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
1129
|
-
onSet: ["selected", { selected:
|
|
1130
|
-
click: (
|
|
1131
|
-
disabled:
|
|
1132
|
-
},
|
|
1113
|
+
onSet: ["selected", { selected: t.value }],
|
|
1114
|
+
click: (e) => t.callBack(t.value),
|
|
1115
|
+
disabled: t.disabled
|
|
1116
|
+
}, t.label)
|
|
1133
1117
|
]
|
|
1134
|
-
),
|
|
1135
|
-
p({ class: "flex flex-auto flex-row", map: [
|
|
1118
|
+
), Me = (t, e) => (t.callBack = e, Ie(t)), Re = (t) => D({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${t.class}` }, [
|
|
1119
|
+
p({ class: "flex flex-auto flex-row", map: [t.options, (e) => Me(e, t.callBack)] })
|
|
1136
1120
|
]);
|
|
1137
|
-
class
|
|
1121
|
+
class tt extends u {
|
|
1138
1122
|
/**
|
|
1139
1123
|
* This will declare the props for the compiler.
|
|
1140
1124
|
*
|
|
@@ -1149,11 +1133,11 @@ class it extends u {
|
|
|
1149
1133
|
* @returns {object}
|
|
1150
1134
|
*/
|
|
1151
1135
|
render() {
|
|
1152
|
-
const
|
|
1153
|
-
return
|
|
1136
|
+
const e = this.select.bind(this);
|
|
1137
|
+
return Re({
|
|
1154
1138
|
class: this.class,
|
|
1155
1139
|
options: this.options,
|
|
1156
|
-
callBack:
|
|
1140
|
+
callBack: e
|
|
1157
1141
|
});
|
|
1158
1142
|
}
|
|
1159
1143
|
/**
|
|
@@ -1162,8 +1146,8 @@ class it extends u {
|
|
|
1162
1146
|
* @param {*} value
|
|
1163
1147
|
* @returns {void}
|
|
1164
1148
|
*/
|
|
1165
|
-
select(
|
|
1166
|
-
this.state.selected =
|
|
1149
|
+
select(e) {
|
|
1150
|
+
this.state.selected = e, typeof this.onSelect == "function" && this.onSelect(e, this.parent);
|
|
1167
1151
|
}
|
|
1168
1152
|
/**
|
|
1169
1153
|
* This will setup the states.
|
|
@@ -1171,23 +1155,23 @@ class it extends u {
|
|
|
1171
1155
|
* @returns {object}
|
|
1172
1156
|
*/
|
|
1173
1157
|
setupStates() {
|
|
1174
|
-
var
|
|
1158
|
+
var e;
|
|
1175
1159
|
return {
|
|
1176
|
-
selected: ((
|
|
1160
|
+
selected: ((e = this.options[0]) == null ? void 0 : e.value) || null
|
|
1177
1161
|
};
|
|
1178
1162
|
}
|
|
1179
1163
|
}
|
|
1180
|
-
const
|
|
1181
|
-
const s =
|
|
1182
|
-
return
|
|
1183
|
-
},
|
|
1184
|
-
text:
|
|
1185
|
-
href:
|
|
1164
|
+
const Te = (t, e) => new RegExp(`${t}($|/|\\.).*`).test(e), Ne = (t, e) => {
|
|
1165
|
+
const s = t.getLinkPath();
|
|
1166
|
+
return t.exact ? e === s : Te(s, e);
|
|
1167
|
+
}, We = ({ text: t, href: e, exact: s }) => new M({
|
|
1168
|
+
text: t,
|
|
1169
|
+
href: e,
|
|
1186
1170
|
exact: s,
|
|
1187
1171
|
dataSet: ["selected", ["state", !0, "active"]],
|
|
1188
1172
|
class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm"
|
|
1189
1173
|
});
|
|
1190
|
-
class
|
|
1174
|
+
class $e extends u {
|
|
1191
1175
|
/**
|
|
1192
1176
|
* This will declare the props for the compiler.
|
|
1193
1177
|
*
|
|
@@ -1208,12 +1192,12 @@ class je extends u {
|
|
|
1208
1192
|
* @returns {object}
|
|
1209
1193
|
*/
|
|
1210
1194
|
render() {
|
|
1211
|
-
return
|
|
1195
|
+
return D({ class: `tab items-center justify-center rounded-md bg-muted p-1 text-muted-foreground ${this.class}` }, [
|
|
1212
1196
|
p({
|
|
1213
1197
|
class: "flex flex-auto flex-row",
|
|
1214
|
-
map: [this.options, (
|
|
1198
|
+
map: [this.options, (e) => this.addLink(e)],
|
|
1215
1199
|
watch: {
|
|
1216
|
-
value: ["[[path]]",
|
|
1200
|
+
value: ["[[path]]", b.data],
|
|
1217
1201
|
callBack: this.updateLinks.bind(this)
|
|
1218
1202
|
}
|
|
1219
1203
|
})
|
|
@@ -1225,8 +1209,8 @@ class je extends u {
|
|
|
1225
1209
|
* @returns {void}
|
|
1226
1210
|
*/
|
|
1227
1211
|
afterSetup() {
|
|
1228
|
-
const
|
|
1229
|
-
this.updateLinks(
|
|
1212
|
+
const e = b.data.path;
|
|
1213
|
+
this.updateLinks(e);
|
|
1230
1214
|
}
|
|
1231
1215
|
/**
|
|
1232
1216
|
* This will update the links.
|
|
@@ -1234,11 +1218,11 @@ class je extends u {
|
|
|
1234
1218
|
* @param {string} value
|
|
1235
1219
|
* @returns {void}
|
|
1236
1220
|
*/
|
|
1237
|
-
updateLinks(
|
|
1221
|
+
updateLinks(e) {
|
|
1238
1222
|
let s = !1, n = this.links[0];
|
|
1239
1223
|
this.deactivateAllLinks();
|
|
1240
1224
|
for (const a of this.links)
|
|
1241
|
-
if (a.rendered !== !1 && (s =
|
|
1225
|
+
if (a.rendered !== !1 && (s = Ne(a, e), s === !0)) {
|
|
1242
1226
|
this.updateLink(a, !0);
|
|
1243
1227
|
break;
|
|
1244
1228
|
}
|
|
@@ -1250,8 +1234,8 @@ class je extends u {
|
|
|
1250
1234
|
* @returns {void}
|
|
1251
1235
|
*/
|
|
1252
1236
|
deactivateAllLinks() {
|
|
1253
|
-
for (const
|
|
1254
|
-
this.updateLink(
|
|
1237
|
+
for (const e of this.links)
|
|
1238
|
+
this.updateLink(e, !1);
|
|
1255
1239
|
}
|
|
1256
1240
|
/**
|
|
1257
1241
|
* This will update the link.
|
|
@@ -1260,8 +1244,8 @@ class je extends u {
|
|
|
1260
1244
|
* @param {boolean} selected
|
|
1261
1245
|
* @returns {void}
|
|
1262
1246
|
*/
|
|
1263
|
-
updateLink(
|
|
1264
|
-
|
|
1247
|
+
updateLink(e, s) {
|
|
1248
|
+
e.update(s);
|
|
1265
1249
|
}
|
|
1266
1250
|
/**
|
|
1267
1251
|
* This will add a link.
|
|
@@ -1269,8 +1253,8 @@ class je extends u {
|
|
|
1269
1253
|
* @param {object} option
|
|
1270
1254
|
* @returns {object}
|
|
1271
1255
|
*/
|
|
1272
|
-
addLink({ label:
|
|
1273
|
-
const a =
|
|
1256
|
+
addLink({ label: e, href: s, exact: n }) {
|
|
1257
|
+
const a = We({ text: e, href: s, exact: n });
|
|
1274
1258
|
return this.links.push(a), a;
|
|
1275
1259
|
}
|
|
1276
1260
|
/**
|
|
@@ -1282,7 +1266,7 @@ class je extends u {
|
|
|
1282
1266
|
this.links = [];
|
|
1283
1267
|
}
|
|
1284
1268
|
}
|
|
1285
|
-
class
|
|
1269
|
+
class st extends u {
|
|
1286
1270
|
/**
|
|
1287
1271
|
* This will declare the props for the compiler.
|
|
1288
1272
|
*
|
|
@@ -1298,11 +1282,11 @@ class ot extends u {
|
|
|
1298
1282
|
*/
|
|
1299
1283
|
render() {
|
|
1300
1284
|
return o({ class: "tab-panel" }, [
|
|
1301
|
-
new
|
|
1285
|
+
new $e({
|
|
1302
1286
|
class: this.class,
|
|
1303
1287
|
options: this.options
|
|
1304
1288
|
}),
|
|
1305
|
-
|
|
1289
|
+
B({
|
|
1306
1290
|
class: "tab-content",
|
|
1307
1291
|
switch: this.addGroup()
|
|
1308
1292
|
})
|
|
@@ -1314,14 +1298,14 @@ class ot extends u {
|
|
|
1314
1298
|
* @returns {array}
|
|
1315
1299
|
*/
|
|
1316
1300
|
addGroup() {
|
|
1317
|
-
let
|
|
1301
|
+
let e;
|
|
1318
1302
|
const s = [], n = this.options;
|
|
1319
1303
|
for (let a = 0, i = n.length; a < i; a++)
|
|
1320
|
-
|
|
1304
|
+
e = n[a], s.push(
|
|
1321
1305
|
{
|
|
1322
|
-
uri:
|
|
1323
|
-
component:
|
|
1324
|
-
title:
|
|
1306
|
+
uri: e.uri || e.href,
|
|
1307
|
+
component: e.component,
|
|
1308
|
+
title: e.title || null,
|
|
1325
1309
|
persist: !0
|
|
1326
1310
|
}
|
|
1327
1311
|
);
|
|
@@ -1329,32 +1313,32 @@ class ot extends u {
|
|
|
1329
1313
|
}
|
|
1330
1314
|
}
|
|
1331
1315
|
export {
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1316
|
+
qe as B,
|
|
1317
|
+
le as C,
|
|
1318
|
+
de as D,
|
|
1319
|
+
re as H,
|
|
1320
|
+
Xe as I,
|
|
1321
|
+
Ve as N,
|
|
1322
|
+
N as O,
|
|
1323
|
+
Ee as P,
|
|
1324
|
+
Ze as S,
|
|
1325
|
+
ce as T,
|
|
1326
|
+
xe as U,
|
|
1327
|
+
Ke as W,
|
|
1328
|
+
te as a,
|
|
1329
|
+
L as b,
|
|
1330
|
+
Z as c,
|
|
1331
|
+
Qe as d,
|
|
1332
|
+
He as e,
|
|
1333
|
+
ne as f,
|
|
1334
|
+
ee as g,
|
|
1335
|
+
ie as h,
|
|
1336
|
+
oe as i,
|
|
1337
|
+
_e as j,
|
|
1338
|
+
Ge as k,
|
|
1339
|
+
Je as l,
|
|
1340
|
+
et as m,
|
|
1341
|
+
tt as n,
|
|
1342
|
+
$e as o,
|
|
1343
|
+
st as p
|
|
1360
1344
|
};
|