@base-framework/ui 1.0.21 → 1.0.23
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-BE7K48Lc.js +431 -0
- package/dist/{confirmation-34GijCiu.js → confirmation-BCKH-ZBH.js} +29 -27
- package/dist/index.es.js +3 -3
- package/dist/molecules.es.js +2 -2
- package/dist/organisms.es.js +2 -2
- package/dist/{signature-panel-DHDNfCGU.js → signature-panel-BtYoB3y3.js} +1 -1
- package/dist/types/components/organisms/calendar/calendar.d.ts +7 -0
- package/dist/types/components/organisms/calendar/month/calendar-cells.d.ts +1 -1
- package/dist/types/components/organisms/calendar/month/day-cell.d.ts +1 -1
- package/package.json +1 -1
- package/dist/calendar-BjUju8_5.js +0 -414
|
@@ -0,0 +1,431 @@
|
|
|
1
|
+
import { Div as i, Img as I, Span as M, Button as Y } from "@base-framework/atoms";
|
|
2
|
+
import { Component as N, Data as z, Atom as k, DateTime as j } from "@base-framework/base";
|
|
3
|
+
import { B as A } from "./buttons-CVEwmPAi.js";
|
|
4
|
+
import { Icons as P } from "./icons.es.js";
|
|
5
|
+
const W = (e, t) => {
|
|
6
|
+
const n = e ? e.getBoundingClientRect() : { top: 0, bottom: 0, left: 0 }, s = t.getBoundingClientRect(), o = 10, r = window.scrollX, l = window.scrollY;
|
|
7
|
+
let c = n.left + r, f = n.bottom + l;
|
|
8
|
+
const h = window.innerHeight - n.bottom, d = n.top;
|
|
9
|
+
return c + s.width > window.innerWidth && (c = window.innerWidth - s.width - o), h < s.height && d > h ? f = n.top + l - s.height - o : h < s.height && (f = n.bottom + l - (s.height - h) - o), { x: c, y: f };
|
|
10
|
+
};
|
|
11
|
+
class lt extends N {
|
|
12
|
+
/**
|
|
13
|
+
* This will set up the data.
|
|
14
|
+
*
|
|
15
|
+
* @returns {object}
|
|
16
|
+
*/
|
|
17
|
+
setData() {
|
|
18
|
+
const t = this.parent.data || new z();
|
|
19
|
+
return t.set({
|
|
20
|
+
position: { x: 0, y: 0 }
|
|
21
|
+
}), t;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* This will get the class size.
|
|
25
|
+
*
|
|
26
|
+
* @returns {string}
|
|
27
|
+
*/
|
|
28
|
+
getSize() {
|
|
29
|
+
switch (this.size || "lg") {
|
|
30
|
+
case "sm":
|
|
31
|
+
return "w-48";
|
|
32
|
+
case "md":
|
|
33
|
+
return "w-64";
|
|
34
|
+
case "lg":
|
|
35
|
+
return "w-[250px]";
|
|
36
|
+
case "xl":
|
|
37
|
+
return "w-96";
|
|
38
|
+
case "2xl":
|
|
39
|
+
return "w-[400px]";
|
|
40
|
+
case "fit":
|
|
41
|
+
return "w-fit";
|
|
42
|
+
case "full":
|
|
43
|
+
return "w-full";
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
/**
|
|
47
|
+
* This will render the modal component.
|
|
48
|
+
*
|
|
49
|
+
* @returns {object}
|
|
50
|
+
*/
|
|
51
|
+
render() {
|
|
52
|
+
const t = this.getSize();
|
|
53
|
+
return i({
|
|
54
|
+
class: `absolute inset-auto fadeIn mt-2 rounded-md p-0 shadow-lg bg-popover min-h-12 backdrop:bg-transparent text-inherit r z-30 ${t}`,
|
|
55
|
+
popover: "auto",
|
|
56
|
+
toggle: (n, { state: s }) => n.newState === "closed" ? s.open = !1 : null,
|
|
57
|
+
style: "top: [[position.y]]px; left: [[position.x]]px"
|
|
58
|
+
}, this.children);
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* This will setup the states.
|
|
62
|
+
*
|
|
63
|
+
* @returns {object}
|
|
64
|
+
*/
|
|
65
|
+
setupStates() {
|
|
66
|
+
return {
|
|
67
|
+
open: {
|
|
68
|
+
id: this.parent.getId(),
|
|
69
|
+
callBack: (s) => {
|
|
70
|
+
this.state.open === !1 && this.destroy();
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
}
|
|
75
|
+
/**
|
|
76
|
+
* Updates the dropdown position.
|
|
77
|
+
*
|
|
78
|
+
* @returns {void}
|
|
79
|
+
*/
|
|
80
|
+
updatePosition() {
|
|
81
|
+
const t = this.button ?? null, n = this.panel, s = W(t, n);
|
|
82
|
+
this.data.position = s;
|
|
83
|
+
}
|
|
84
|
+
/**
|
|
85
|
+
* This will run after the setup.
|
|
86
|
+
*
|
|
87
|
+
* @returns {void}
|
|
88
|
+
*/
|
|
89
|
+
afterSetup() {
|
|
90
|
+
this.panel.showPopover(), this.updatePosition();
|
|
91
|
+
}
|
|
92
|
+
/**
|
|
93
|
+
* This will check if the element clicked was in the
|
|
94
|
+
* component of the button.
|
|
95
|
+
*
|
|
96
|
+
* @param {object} element
|
|
97
|
+
* @returns {boolean}
|
|
98
|
+
*/
|
|
99
|
+
isOutsideClick(t) {
|
|
100
|
+
return !this.panel.contains(t) && this.button && !this.button.contains(t);
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* This will set up the events.
|
|
104
|
+
*
|
|
105
|
+
* @returns {array}
|
|
106
|
+
*/
|
|
107
|
+
setupEvents() {
|
|
108
|
+
return [
|
|
109
|
+
["click", document, (t) => {
|
|
110
|
+
this.isOutsideClick(t.target) && (this.state.open = !1);
|
|
111
|
+
}],
|
|
112
|
+
["resize", window, (t) => this.updatePosition()],
|
|
113
|
+
["scroll", document, (t) => this.updatePosition()]
|
|
114
|
+
];
|
|
115
|
+
}
|
|
116
|
+
/**
|
|
117
|
+
* This will override the set up to use the app shell.
|
|
118
|
+
*
|
|
119
|
+
* @param {object} container
|
|
120
|
+
*/
|
|
121
|
+
setContainer(t) {
|
|
122
|
+
this.container = app.root;
|
|
123
|
+
}
|
|
124
|
+
/**
|
|
125
|
+
* This will hide the popover before destroying.
|
|
126
|
+
*
|
|
127
|
+
* @returns {void}
|
|
128
|
+
*/
|
|
129
|
+
beforeDestroy() {
|
|
130
|
+
this.panel.hidePopover();
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
const H = k(({ src: e, alt: t }) => e ? I({
|
|
134
|
+
class: "absolute w-full h-full rounded-full object-cover fadeIn",
|
|
135
|
+
src: e,
|
|
136
|
+
alt: t,
|
|
137
|
+
/**
|
|
138
|
+
* If there's an error loading the image, hide it.
|
|
139
|
+
*/
|
|
140
|
+
error: (n) => n.target.style.display = "none"
|
|
141
|
+
}) : null), R = (e) => e.split(" ").map((t) => t.charAt(0)).join(""), B = (e) => !e || e.length < 2 ? e : R(e), X = (e) => M([e, (t, n) => {
|
|
142
|
+
n.textContent = B(t);
|
|
143
|
+
}]), S = {
|
|
144
|
+
xs: "h-6 w-6",
|
|
145
|
+
sm: "h-8 w-8",
|
|
146
|
+
md: "h-12 w-12",
|
|
147
|
+
lg: "h-16 w-16",
|
|
148
|
+
xl: "h-24 w-24",
|
|
149
|
+
"2xl": "h-32 w-32",
|
|
150
|
+
"3xl": "h-48 w-48",
|
|
151
|
+
default: "h-12 w-12"
|
|
152
|
+
}, T = {
|
|
153
|
+
xs: "text-[7px]",
|
|
154
|
+
sm: "text-xs",
|
|
155
|
+
md: "text-base",
|
|
156
|
+
lg: "text-xl",
|
|
157
|
+
xl: "text-2xl",
|
|
158
|
+
"2xl": "text-3xl",
|
|
159
|
+
"3xl": "text-4xl",
|
|
160
|
+
default: "text-base"
|
|
161
|
+
}, E = (e) => S[e] || S.default, G = (e) => T[e] || T.default, L = (e, t = null, n = "md") => {
|
|
162
|
+
const s = B(e), o = G(n);
|
|
163
|
+
return i(
|
|
164
|
+
{
|
|
165
|
+
class: `
|
|
166
|
+
flex items-center justify-center w-full h-full rounded-full
|
|
167
|
+
bg-muted text-muted-foreground font-medium
|
|
168
|
+
${o}
|
|
169
|
+
`
|
|
170
|
+
},
|
|
171
|
+
[
|
|
172
|
+
t ? X(t) : M(s)
|
|
173
|
+
]
|
|
174
|
+
);
|
|
175
|
+
}, ct = k(({ src: e, alt: t, fallbackText: n, watcherFallback: s, size: o }) => {
|
|
176
|
+
const r = E(o);
|
|
177
|
+
return i(
|
|
178
|
+
{
|
|
179
|
+
class: `relative flex items-center justify-center ${r}`
|
|
180
|
+
},
|
|
181
|
+
[
|
|
182
|
+
H({ src: e, alt: t }),
|
|
183
|
+
L(n, s, o)
|
|
184
|
+
]
|
|
185
|
+
);
|
|
186
|
+
}), x = (e) => (e *= 1, e < 10 ? `0${e}` : String(e)), q = (e) => (e.indexOf("T") === -1 && e.indexOf(" ") === -1 && (e += "T00:00:01"), e.replace(" ", "T"), e), p = (e, t, n) => `${e}-${x(t + 1)}-${x(n)}`, J = (e) => e ? "bg-accent text-primary" : "", K = (e) => e ? "text-muted-foreground opacity-50" : "", Q = (e, t) => e === t, U = (e, t) => Q(e, t) ? "bg-primary text-primary-foreground" : "", V = (e, t, n, s) => {
|
|
187
|
+
const o = U(t, s);
|
|
188
|
+
return o || (e ? J(e) : n ? K(n) : "text-foreground");
|
|
189
|
+
}, C = (e) => {
|
|
190
|
+
const {
|
|
191
|
+
day: t,
|
|
192
|
+
currentDate: n,
|
|
193
|
+
date: s,
|
|
194
|
+
isToday: o,
|
|
195
|
+
isOutsideMonth: r,
|
|
196
|
+
select: l,
|
|
197
|
+
disabled: c
|
|
198
|
+
} = e;
|
|
199
|
+
return Y(
|
|
200
|
+
{
|
|
201
|
+
class: `
|
|
202
|
+
flex items-center justify-center h-9 w-auto p-0 font-normal text-sm rounded-md
|
|
203
|
+
${V(o, n, r, s)}
|
|
204
|
+
hover:bg-muted/50 hover:text-muted-foreground focus:z-10
|
|
205
|
+
`,
|
|
206
|
+
disabled: c || t === null,
|
|
207
|
+
"aria-label": t ? `Day ${t}` : null,
|
|
208
|
+
// Only call select if it's not disabled.
|
|
209
|
+
click: () => !c && l(s)
|
|
210
|
+
},
|
|
211
|
+
t.toString()
|
|
212
|
+
);
|
|
213
|
+
}, b = (e, t, n, s) => e === s.date && t === s.month && n === s.year, Z = (e, t, n, s = !1) => {
|
|
214
|
+
const { year: o, month: r } = e, l = p(o, r, e.date), c = new Date(o, r, 1).getDay(), f = new Date(o, r + 1, 0).getDate(), h = new Date(o, r, 0).getDate(), d = [], D = r === 0 ? 11 : r - 1, w = r === 0 ? o - 1 : o;
|
|
215
|
+
for (let a = c - 1; a >= 0; a--) {
|
|
216
|
+
const u = h - a, g = b(u, D, w, t), m = new Date(w, D, u) < new Date(t.year, t.month, t.date), F = s && m;
|
|
217
|
+
d.push(
|
|
218
|
+
C({
|
|
219
|
+
day: u,
|
|
220
|
+
currentDate: l,
|
|
221
|
+
date: p(w, D, u),
|
|
222
|
+
isToday: g,
|
|
223
|
+
isOutsideMonth: !0,
|
|
224
|
+
select: n,
|
|
225
|
+
disabled: F
|
|
226
|
+
})
|
|
227
|
+
);
|
|
228
|
+
}
|
|
229
|
+
for (let a = 1; a <= f; a++) {
|
|
230
|
+
const u = b(a, r, o, t), g = new Date(o, r, a) < new Date(t.year, t.month, t.date), m = s && g;
|
|
231
|
+
d.push(
|
|
232
|
+
C({
|
|
233
|
+
day: a,
|
|
234
|
+
currentDate: l,
|
|
235
|
+
date: p(o, r, a),
|
|
236
|
+
isToday: u,
|
|
237
|
+
isOutsideMonth: !1,
|
|
238
|
+
select: n,
|
|
239
|
+
disabled: m
|
|
240
|
+
})
|
|
241
|
+
);
|
|
242
|
+
}
|
|
243
|
+
const y = r === 11 ? 0 : r + 1, v = r === 11 ? o + 1 : o, O = (7 - d.length % 7) % 7;
|
|
244
|
+
for (let a = 1; a <= O; a++) {
|
|
245
|
+
const u = b(a, y, v, t), g = new Date(v, y, a) < new Date(t.year, t.month, t.date), m = s && g;
|
|
246
|
+
d.push(
|
|
247
|
+
C({
|
|
248
|
+
day: a,
|
|
249
|
+
currentDate: l,
|
|
250
|
+
date: p(v, y, a),
|
|
251
|
+
isToday: u,
|
|
252
|
+
isOutsideMonth: !0,
|
|
253
|
+
select: n,
|
|
254
|
+
disabled: m
|
|
255
|
+
})
|
|
256
|
+
);
|
|
257
|
+
}
|
|
258
|
+
return d;
|
|
259
|
+
}, _ = (e) => i(
|
|
260
|
+
{ class: "flex items-center justify-center h-9 w-auto text-[0.8rem] font-normal text-muted-foreground" },
|
|
261
|
+
e
|
|
262
|
+
), $ = ({ label: e, click: t }) => A(
|
|
263
|
+
{
|
|
264
|
+
class: `
|
|
265
|
+
inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
|
|
266
|
+
opacity-50 hover:opacity-100 text-muted-foreground absolute
|
|
267
|
+
${e === "Previous" ? "left-1" : "right-1"}
|
|
268
|
+
focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
|
|
269
|
+
`,
|
|
270
|
+
click: t,
|
|
271
|
+
"aria-label": `${e} month`,
|
|
272
|
+
variant: "icon",
|
|
273
|
+
icon: e === "Previous" ? P.chevron.single.left : P.chevron.single.right
|
|
274
|
+
}
|
|
275
|
+
), tt = ({ next: e, previous: t }) => i({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
|
|
276
|
+
M("[[monthName]] [[current.year]]"),
|
|
277
|
+
$({
|
|
278
|
+
label: "Previous",
|
|
279
|
+
click: t
|
|
280
|
+
}),
|
|
281
|
+
$({
|
|
282
|
+
label: "Next",
|
|
283
|
+
click: e
|
|
284
|
+
})
|
|
285
|
+
]), et = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(_), nt = (e) => i({ class: "rdp w-full space-y-1" }, [
|
|
286
|
+
tt({
|
|
287
|
+
next: e.next,
|
|
288
|
+
previous: e.previous
|
|
289
|
+
}),
|
|
290
|
+
i({
|
|
291
|
+
class: "flex flex-auto flex-col w-full",
|
|
292
|
+
onSet: [
|
|
293
|
+
"currentDate",
|
|
294
|
+
() => [
|
|
295
|
+
i({ class: "grid grid-cols-7" }, et()),
|
|
296
|
+
i(
|
|
297
|
+
{ class: "grid grid-cols-7" },
|
|
298
|
+
Z(
|
|
299
|
+
e.current,
|
|
300
|
+
e.today,
|
|
301
|
+
e.select,
|
|
302
|
+
e.blockPriorDates
|
|
303
|
+
)
|
|
304
|
+
)
|
|
305
|
+
]
|
|
306
|
+
]
|
|
307
|
+
})
|
|
308
|
+
]);
|
|
309
|
+
class ut extends N {
|
|
310
|
+
/**
|
|
311
|
+
* This will declare the props for the compiler.
|
|
312
|
+
*
|
|
313
|
+
* @returns {void}
|
|
314
|
+
*/
|
|
315
|
+
declareProps() {
|
|
316
|
+
this.selectedDate = null, this.selectedCallBack = null, this.blockPriorDates = !1;
|
|
317
|
+
}
|
|
318
|
+
/**
|
|
319
|
+
* This will get the selected data.
|
|
320
|
+
*
|
|
321
|
+
* @param {object} today
|
|
322
|
+
* @returns {Date}
|
|
323
|
+
*/
|
|
324
|
+
getSelectedDate(t) {
|
|
325
|
+
const n = this.selectedDate ? new Date(q(this.selectedDate)) : t;
|
|
326
|
+
return new Date(n.getFullYear(), n.getMonth(), n.getDate());
|
|
327
|
+
}
|
|
328
|
+
/**
|
|
329
|
+
* This will set up the data for the calendar.
|
|
330
|
+
*
|
|
331
|
+
* @returns {Data}
|
|
332
|
+
*/
|
|
333
|
+
setData() {
|
|
334
|
+
const t = /* @__PURE__ */ new Date(), n = this.getSelectedDate(t), s = n.getMonth();
|
|
335
|
+
return new z({
|
|
336
|
+
monthName: this.getMonthName(s),
|
|
337
|
+
currentDate: `${n.getFullYear()}-${s + 1}-${n.getDate()}`,
|
|
338
|
+
current: {
|
|
339
|
+
date: n.getDate(),
|
|
340
|
+
year: n.getFullYear(),
|
|
341
|
+
month: s
|
|
342
|
+
},
|
|
343
|
+
today: {
|
|
344
|
+
date: t.getDate(),
|
|
345
|
+
month: t.getMonth(),
|
|
346
|
+
year: t.getFullYear()
|
|
347
|
+
}
|
|
348
|
+
});
|
|
349
|
+
}
|
|
350
|
+
/**
|
|
351
|
+
* This will get the name of the month.
|
|
352
|
+
*
|
|
353
|
+
* @param {number} month
|
|
354
|
+
* @returns {string}
|
|
355
|
+
*/
|
|
356
|
+
getMonthName(t) {
|
|
357
|
+
return j.monthNames[t];
|
|
358
|
+
}
|
|
359
|
+
/**
|
|
360
|
+
* This will go to the previous month.
|
|
361
|
+
*
|
|
362
|
+
* @returns {void}
|
|
363
|
+
*/
|
|
364
|
+
goToPreviousMonth() {
|
|
365
|
+
const t = this.data;
|
|
366
|
+
let n = t.current.month, s = t.current.year;
|
|
367
|
+
n === 0 ? (n = 11, s--) : n--, this.setCurrentDate(n, s);
|
|
368
|
+
}
|
|
369
|
+
/**
|
|
370
|
+
* This will go to the next month.
|
|
371
|
+
*
|
|
372
|
+
* @returns {void}
|
|
373
|
+
*/
|
|
374
|
+
goToNextMonth() {
|
|
375
|
+
const t = this.data;
|
|
376
|
+
let n = t.current.month, s = t.current.year;
|
|
377
|
+
n === 11 ? (n = 0, s++) : n++, this.setCurrentDate(n, s);
|
|
378
|
+
}
|
|
379
|
+
/**
|
|
380
|
+
* This will set the current month and year.
|
|
381
|
+
*
|
|
382
|
+
* @param {number} month
|
|
383
|
+
* @param {number} year
|
|
384
|
+
* @param {number} [date=null]
|
|
385
|
+
* @returns {void}
|
|
386
|
+
*/
|
|
387
|
+
setCurrentDate(t, n, s = null) {
|
|
388
|
+
const o = this.data;
|
|
389
|
+
o.current.month = t, o.current.year = n, typeof s == "number" && (o.current.date = x(s)), o.currentDate = `${n}-${x(t + 1)}-${o.current.date}`, o.monthName = this.getMonthName(t);
|
|
390
|
+
}
|
|
391
|
+
/**
|
|
392
|
+
* This will select a date.
|
|
393
|
+
*
|
|
394
|
+
* @param {string} date
|
|
395
|
+
* @returns {void}
|
|
396
|
+
*/
|
|
397
|
+
selectDate(t) {
|
|
398
|
+
const n = /* @__PURE__ */ new Date(t + "T00:00:00");
|
|
399
|
+
this.setCurrentDate(n.getMonth(), n.getFullYear(), n.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(this.data.currentDate);
|
|
400
|
+
}
|
|
401
|
+
/**
|
|
402
|
+
* This will render the calendar.
|
|
403
|
+
*
|
|
404
|
+
* @returns {object}
|
|
405
|
+
*/
|
|
406
|
+
render() {
|
|
407
|
+
return i({ class: "calendar-container p-3 rounded-md border min-w-80" }, [
|
|
408
|
+
nt({
|
|
409
|
+
current: this.data.current,
|
|
410
|
+
today: this.data.today,
|
|
411
|
+
select: (t) => this.selectDate(t),
|
|
412
|
+
next: () => this.goToNextMonth(),
|
|
413
|
+
previous: () => this.goToPreviousMonth(),
|
|
414
|
+
blockPriorDates: this.blockPriorDates || !1
|
|
415
|
+
})
|
|
416
|
+
]);
|
|
417
|
+
}
|
|
418
|
+
}
|
|
419
|
+
export {
|
|
420
|
+
ct as A,
|
|
421
|
+
Z as C,
|
|
422
|
+
C as D,
|
|
423
|
+
p as F,
|
|
424
|
+
nt as M,
|
|
425
|
+
lt as P,
|
|
426
|
+
_ as a,
|
|
427
|
+
ut as b,
|
|
428
|
+
q as c,
|
|
429
|
+
W as g,
|
|
430
|
+
x as p
|
|
431
|
+
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { Div as n, I as f, H5 as _, P as
|
|
2
|
-
import { Atom as c, Component as
|
|
3
|
-
import { P as D, b as te } from "./calendar-
|
|
1
|
+
import { Div as n, I as f, H5 as _, P as b, Li as O, Span as a, Ul as V, Button as h, OnState as v, Label as R, Form as W, H2 as B, Footer as $, Header as M, A as Y, H3 as G, Checkbox as J, Nav as K, Input as C, Time as Q, Dialog as X } from "@base-framework/atoms";
|
|
2
|
+
import { Atom as c, Component as p, Html as L, Dom as Z, base as ee, Data as k, Builder as q, Jot as S, DateTime as A } from "@base-framework/base";
|
|
3
|
+
import { P as D, b as te } from "./calendar-BE7K48Lc.js";
|
|
4
4
|
import { B as u, I as x } from "./buttons-CVEwmPAi.js";
|
|
5
5
|
import { Icons as d } from "./icons.es.js";
|
|
6
6
|
import { a as w } from "./veil-DSQdR6CM.js";
|
|
@@ -33,7 +33,7 @@ const P = {
|
|
|
33
33
|
}
|
|
34
34
|
}, re = (e, t) => n({ class: `flex items-center justify-center h-6 w-6 mr-3 ${t}` }, [
|
|
35
35
|
f({ html: e })
|
|
36
|
-
]), le = (e) => _({ class: "font-semibold" }, e), ie = (e) =>
|
|
36
|
+
]), le = (e) => _({ class: "font-semibold" }, e), ie = (e) => b({ class: "text-sm text-muted-foreground" }, e), ht = c(({ title: e, description: t, icon: s, type: o = "default" }) => {
|
|
37
37
|
const { borderColor: l, bgColor: r, iconColor: i } = P[o] || P.default;
|
|
38
38
|
return n({ class: `flex items-start p-4 border rounded-lg ${r} ${l}` }, [
|
|
39
39
|
// Icon and content
|
|
@@ -44,7 +44,7 @@ const P = {
|
|
|
44
44
|
])
|
|
45
45
|
]);
|
|
46
46
|
});
|
|
47
|
-
class ae extends
|
|
47
|
+
class ae extends p {
|
|
48
48
|
/**
|
|
49
49
|
* This will declare the props for the compiler.
|
|
50
50
|
*
|
|
@@ -91,7 +91,7 @@ const ce = (e) => a({ class: "ml-auto text-xs tracking-widest opacity-60" }, e),
|
|
|
91
91
|
}, [
|
|
92
92
|
e && a(e),
|
|
93
93
|
t && f({ html: t })
|
|
94
|
-
]),
|
|
94
|
+
]), be = ({ onSelect: e }) => n([
|
|
95
95
|
v(
|
|
96
96
|
"open",
|
|
97
97
|
(t, s, o) => t ? new D({
|
|
@@ -103,7 +103,7 @@ const ce = (e) => a({ class: "ml-auto text-xs tracking-widest opacity-60" }, e),
|
|
|
103
103
|
]) : null
|
|
104
104
|
)
|
|
105
105
|
]);
|
|
106
|
-
class mt extends
|
|
106
|
+
class mt extends p {
|
|
107
107
|
/**
|
|
108
108
|
* This will declare the props for the compiler.
|
|
109
109
|
*
|
|
@@ -162,11 +162,11 @@ class mt extends b {
|
|
|
162
162
|
icon: this.icon,
|
|
163
163
|
toggleDropdown: this.toggleDropdown.bind(this)
|
|
164
164
|
}),
|
|
165
|
-
|
|
165
|
+
be({ onSelect: this.handleSelect.bind(this) })
|
|
166
166
|
]);
|
|
167
167
|
}
|
|
168
168
|
}
|
|
169
|
-
const
|
|
169
|
+
const pe = c((e, t) => n({ ...e, class: "flex flex-auto flex-col space-y-2" }, t)), xe = c((e, t) => R({ ...e, class: "flex auto text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, t)), we = c((e, t) => b({ ...e, class: "text-sm text-muted-foreground italic" }, t)), ye = c((e, t) => b({ ...e, class: "text-sm text-destructive" }, t)), ve = (e) => e.tag === "input" || e.tag === "select" || e.tag === "textarea", H = (e, t, s) => e.map((o) => (o.children && o.children.length > 0 && (o.children = H(o.children, t, s)), o.required && ve(o) ? {
|
|
170
170
|
...o,
|
|
171
171
|
aria: {
|
|
172
172
|
invalid: ["hasError"]
|
|
@@ -208,7 +208,7 @@ const be = c((e, t) => n({ ...e, class: "flex flex-auto flex-col space-y-2" }, t
|
|
|
208
208
|
this.state.error = r, this.state.hasError = !!r;
|
|
209
209
|
};
|
|
210
210
|
return n({ class: "flex flex-auto space-y-4" }, [
|
|
211
|
-
|
|
211
|
+
pe([
|
|
212
212
|
xe({ htmlFor: t }, s),
|
|
213
213
|
Ce({
|
|
214
214
|
id: t,
|
|
@@ -226,10 +226,10 @@ const be = c((e, t) => n({ ...e, class: "flex flex-auto flex-col space-y-2" }, t
|
|
|
226
226
|
e.target.checkValidity() && (e.preventDefault(), t && t(e));
|
|
227
227
|
}, Se = c(
|
|
228
228
|
(e, t) => W({ ...e, submit: (s) => ke(s, e.submit), class: `w-full ${e.class ?? ""}` }, t)
|
|
229
|
-
), gt = c((e, t) => n({ ...e, class: `space-y-6 p-4 md:p-6 divide-y ${e.class || ""}` }, t)),
|
|
229
|
+
), gt = c((e, t) => n({ ...e, class: `space-y-6 p-4 md:p-6 divide-y ${e.class || ""}` }, t)), bt = c((e, t = []) => n({ class: "space-y-3 py-4" }, [
|
|
230
230
|
e.title && B({ class: "font-semibold" }, e.title),
|
|
231
231
|
...t
|
|
232
|
-
])),
|
|
232
|
+
])), pt = (e, t) => n({ class: "flex justify-between" }, [
|
|
233
233
|
a({ class: "text-muted-foreground" }, e),
|
|
234
234
|
a(t)
|
|
235
235
|
]), De = ({ title: e, description: t, back: s, icon: o, options: l = [] }) => M({ class: "modal-header bg-background/80 backdrop-blur-md sticky flex flex-none items-center py-4 px-6 z-10" }, [
|
|
@@ -264,7 +264,7 @@ const be = c((e, t) => n({ ...e, class: "flex flex-auto flex-col space-y-2" }, t
|
|
|
264
264
|
$({ class: "modal-footer sticky bg-background/80 backdrop-blur-md flex flex-none justify-between py-4 px-6 z-10" }, e.buttons)
|
|
265
265
|
])
|
|
266
266
|
])), Te = (e) => q.render(e, app.root);
|
|
267
|
-
class xt extends
|
|
267
|
+
class xt extends p {
|
|
268
268
|
/**
|
|
269
269
|
* This will declare the props for the compiler.
|
|
270
270
|
*
|
|
@@ -527,7 +527,7 @@ class Me extends ae {
|
|
|
527
527
|
n({ class: "flex flex-auto flex-row items-center w-full pr-12" }, [
|
|
528
528
|
this.title && Ae(this.title)
|
|
529
529
|
]),
|
|
530
|
-
|
|
530
|
+
b({ class: "text-base text-muted-foreground m-0 pr-12" }, this.description),
|
|
531
531
|
(this.primary || this.secondary) && $({ class: "margin-top-24 flex align-center" }, this.getButtons())
|
|
532
532
|
])
|
|
533
533
|
]),
|
|
@@ -550,7 +550,7 @@ class Me extends ae {
|
|
|
550
550
|
}
|
|
551
551
|
}
|
|
552
552
|
let Le = 0;
|
|
553
|
-
class wt extends
|
|
553
|
+
class wt extends p {
|
|
554
554
|
/**
|
|
555
555
|
* This will render the component.
|
|
556
556
|
*
|
|
@@ -988,18 +988,19 @@ const N = window.matchMedia, I = c(({ value: e, label: t, icon: s }) => h({
|
|
|
988
988
|
onState: ["selectedDate", (o) => o ? A.format("standard", o) : "Pick a date"]
|
|
989
989
|
}),
|
|
990
990
|
f({ html: d.calendar.days })
|
|
991
|
-
]), Ke = ({ handleDateSelect: e }) => n({ class: "absolute mt-1 z-10 bg-background rounded-md shadow-lg" }, [
|
|
991
|
+
]), Ke = ({ handleDateSelect: e, blockPriorDates: t }) => n({ class: "absolute mt-1 z-10 bg-background rounded-md shadow-lg" }, [
|
|
992
992
|
v(
|
|
993
993
|
"open",
|
|
994
|
-
(
|
|
994
|
+
(s, o, l) => s ? new D({
|
|
995
995
|
cache: "dropdown",
|
|
996
|
-
parent:
|
|
997
|
-
button:
|
|
996
|
+
parent: l,
|
|
997
|
+
button: l.panel,
|
|
998
998
|
size: "fit"
|
|
999
999
|
}, [
|
|
1000
1000
|
new te({
|
|
1001
|
-
selectedDate:
|
|
1002
|
-
selectedCallBack: e
|
|
1001
|
+
selectedDate: l.state.selectedDate,
|
|
1002
|
+
selectedCallBack: e,
|
|
1003
|
+
blockPriorDates: t
|
|
1003
1004
|
})
|
|
1004
1005
|
]) : null
|
|
1005
1006
|
)
|
|
@@ -1041,7 +1042,8 @@ const N = window.matchMedia, I = c(({ value: e, label: t, icon: s }) => h({
|
|
|
1041
1042
|
required: this.required
|
|
1042
1043
|
}),
|
|
1043
1044
|
Ke({
|
|
1044
|
-
handleDateSelect: t
|
|
1045
|
+
handleDateSelect: t,
|
|
1046
|
+
blockPriorDates: this.blockPriorDates || !1
|
|
1045
1047
|
})
|
|
1046
1048
|
]);
|
|
1047
1049
|
}
|
|
@@ -1237,7 +1239,7 @@ const $t = w(
|
|
|
1237
1239
|
n({ class: "flex flex-auto flex-col gap-4" }, [
|
|
1238
1240
|
n({ class: "flex flex-auto flex-col space-y-2" }, [
|
|
1239
1241
|
tt(e),
|
|
1240
|
-
e.description &&
|
|
1242
|
+
e.description && b({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, e.description),
|
|
1241
1243
|
n({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, t)
|
|
1242
1244
|
]),
|
|
1243
1245
|
e.buttons && $({ class: "flex flex-col-reverse sm:flex-row sm:justify-end mt-6 gap-2 sm:gap-0 sm:space-x-2" }, e.buttons)
|
|
@@ -1271,7 +1273,7 @@ const $t = w(
|
|
|
1271
1273
|
iconColor: "text-muted-foreground"
|
|
1272
1274
|
}
|
|
1273
1275
|
};
|
|
1274
|
-
class nt extends
|
|
1276
|
+
class nt extends p {
|
|
1275
1277
|
/**
|
|
1276
1278
|
* This will declare the props for the compiler.
|
|
1277
1279
|
*
|
|
@@ -1380,12 +1382,12 @@ export {
|
|
|
1380
1382
|
It as C,
|
|
1381
1383
|
ae as D,
|
|
1382
1384
|
st as E,
|
|
1383
|
-
|
|
1385
|
+
pe as F,
|
|
1384
1386
|
nt as G,
|
|
1385
1387
|
xt as M,
|
|
1386
1388
|
wt as N,
|
|
1387
1389
|
Re as P,
|
|
1388
|
-
|
|
1390
|
+
pt as S,
|
|
1389
1391
|
yt as T,
|
|
1390
1392
|
he as a,
|
|
1391
1393
|
mt as b,
|
|
@@ -1397,7 +1399,7 @@ export {
|
|
|
1397
1399
|
ft as h,
|
|
1398
1400
|
Se as i,
|
|
1399
1401
|
gt as j,
|
|
1400
|
-
|
|
1402
|
+
bt as k,
|
|
1401
1403
|
Me as l,
|
|
1402
1404
|
vt as m,
|
|
1403
1405
|
Ct as n,
|
package/dist/index.es.js
CHANGED
|
@@ -3,9 +3,9 @@ import { B as g, I as C, L as T } from "./buttons-CVEwmPAi.js";
|
|
|
3
3
|
import { C as D, d as I, D as S, c as b, E as B, F as P, H as F, I as M, M as k, N, P as v, R as f, S as x, T as h, a as y, b as W, U as L, W as A } from "./inputs-C1dvFQuB.js";
|
|
4
4
|
import { V as w, a as U } from "./veil-DSQdR6CM.js";
|
|
5
5
|
import { Icons as R } from "./icons.es.js";
|
|
6
|
-
import { A as G, B as V, C as j, z as q, u as z, v as J, w as _, D as K, j as Q, k as X, G as Y, E as Z, s as $, c as aa, a as sa, b as ea, i as oa, g as ta, e as ra, h as na, F as ia, d as la, f as pa, t as ua, M as ma, l as da, N as ga, P as Ca, p as Ta, q as ca, S as Da, n as Ia, o as Sa, T as ba, x as Ba, y as Pa, m as Fa, r as Ma } from "./confirmation-
|
|
7
|
-
import { A as Na, b as va, C as fa, D as xa, a as ha, F as ya, M as Wa, P as La, c as Aa, g as Ha, p as wa } from "./calendar-
|
|
8
|
-
import { B as Oa, m as Ra, C as Ea, j as Ga, D as Va, l as ja, H as qa, I as za, N as Ja, O as _a, P as Ka, S as Qa, q as Xa, p as Ya, n as Za, o as $a, T as as, k as ss, U as es, W as os, f as ts, h as rs, i as ns, c as is, d as ls, b as ps, e as us, a as ms, g as ds } from "./signature-panel-
|
|
6
|
+
import { A as G, B as V, C as j, z as q, u as z, v as J, w as _, D as K, j as Q, k as X, G as Y, E as Z, s as $, c as aa, a as sa, b as ea, i as oa, g as ta, e as ra, h as na, F as ia, d as la, f as pa, t as ua, M as ma, l as da, N as ga, P as Ca, p as Ta, q as ca, S as Da, n as Ia, o as Sa, T as ba, x as Ba, y as Pa, m as Fa, r as Ma } from "./confirmation-BCKH-ZBH.js";
|
|
7
|
+
import { A as Na, b as va, C as fa, D as xa, a as ha, F as ya, M as Wa, P as La, c as Aa, g as Ha, p as wa } from "./calendar-BE7K48Lc.js";
|
|
8
|
+
import { B as Oa, m as Ra, C as Ea, j as Ga, D as Va, l as ja, H as qa, I as za, N as Ja, O as _a, P as Ka, S as Qa, q as Xa, p as Ya, n as Za, o as $a, T as as, k as ss, U as es, W as os, f as ts, h as rs, i as ns, c as is, d as ls, b as ps, e as us, a as ms, g as ds } from "./signature-panel-BtYoB3y3.js";
|
|
9
9
|
import { B as Cs, I as Ts, M as cs, d as Ds, e as Is, g as Ss, N as bs, b as Bs, a as Ps, f as Fs, P as Ms, c as ks, S as Ns, T as vs } from "./mobile-nav-wrapper-DyNFnla-.js";
|
|
10
10
|
import { B as xs, a as hs, C as ys, F as Ws, b as Ls, c as As, M as Hs, P as ws, S as Us } from "./sidebar-menu-page-lAu74WTl.js";
|
|
11
11
|
import { A as Rs, F as Es, M as Gs, a as Vs, T as js } from "./aside-template-McEj_Gxc.js";
|
package/dist/molecules.es.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { A as o, B as t, C as e, z as i, u as r, v as n, w as m, D as l, j as S, k as D, G as c, E as u, s as d, c as g, a as p, b as C, i as F, g as T, e as A, h as P, F as f, d as b, f as w, t as B, M as I, l as M, N as x, P as y, p as k, q as v, S as N, n as h, o as E, T as L, x as U, y as j, m as q, r as z } from "./confirmation-
|
|
2
|
-
import { A as O, P as R, g as _ } from "./calendar-
|
|
1
|
+
import { A as o, B as t, C as e, z as i, u as r, v as n, w as m, D as l, j as S, k as D, G as c, E as u, s as d, c as g, a as p, b as C, i as F, g as T, e as A, h as P, F as f, d as b, f as w, t as B, M as I, l as M, N as x, P as y, p as k, q as v, S as N, n as h, o as E, T as L, x as U, y as j, m as q, r as z } from "./confirmation-BCKH-ZBH.js";
|
|
2
|
+
import { A as O, P as R, g as _ } from "./calendar-BE7K48Lc.js";
|
|
3
3
|
export {
|
|
4
4
|
o as Alert,
|
|
5
5
|
O as Avatar,
|
package/dist/organisms.es.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { B as s, m as o, C as t, j as r, D as n, l, H as i, I as d, N as b, O as v, P as g, S as p, q as u, p as N, n as k, o as C, T as D, k as M, U as T, W as c, f as B, h as m, i as y, c as W, d as h, b as H, e as P, a as S, g as f } from "./signature-panel-
|
|
2
|
-
import { b as I, C as L, D as O, a as F, F as U, M as G, c as j, p as q } from "./calendar-
|
|
1
|
+
import { B as s, m as o, C as t, j as r, D as n, l, H as i, I as d, N as b, O as v, P as g, S as p, q as u, p as N, n as k, o as C, T as D, k as M, U as T, W as c, f as B, h as m, i as y, c as W, d as h, b as H, e as P, a as S, g as f } from "./signature-panel-BtYoB3y3.js";
|
|
2
|
+
import { b as I, C as L, D as O, a as F, F as U, M as G, c as j, p as q } from "./calendar-BE7K48Lc.js";
|
|
3
3
|
import { B as z, I as A, M as E, d as J, e as K, g as Q, N as R, b as V, a as X, f as Y, P as Z, c as _, S as $, T as aa } from "./mobile-nav-wrapper-DyNFnla-.js";
|
|
4
4
|
export {
|
|
5
5
|
s as BackButton,
|
|
@@ -4,7 +4,7 @@ import { B as C, I as z } from "./buttons-CVEwmPAi.js";
|
|
|
4
4
|
import { Icons as w } from "./icons.es.js";
|
|
5
5
|
import { TableBody as _, List as G, IntervalTimer as V } from "@base-framework/organisms";
|
|
6
6
|
import { C as J, I as Z, H as ee } from "./inputs-C1dvFQuB.js";
|
|
7
|
-
import { A as te, P as se } from "./calendar-
|
|
7
|
+
import { A as te, P as se } from "./calendar-BE7K48Lc.js";
|
|
8
8
|
u((t, e) => ({
|
|
9
9
|
class: "flex items-center px-4 py-2",
|
|
10
10
|
...t,
|
|
@@ -18,6 +18,13 @@ export class Calendar extends Component {
|
|
|
18
18
|
* @default null
|
|
19
19
|
*/
|
|
20
20
|
selectedCallBack: any;
|
|
21
|
+
/**
|
|
22
|
+
* This will block prior dates.
|
|
23
|
+
*
|
|
24
|
+
* @member {boolean} blockPriorDates
|
|
25
|
+
* @default false
|
|
26
|
+
*/
|
|
27
|
+
blockPriorDates: boolean;
|
|
21
28
|
/**
|
|
22
29
|
* This will get the selected data.
|
|
23
30
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export function CalendarCells(current: object, today: object, selectCallBack: Function): object;
|
|
1
|
+
export function CalendarCells(current: object, today: object, selectCallBack: Function, blockPriorDates?: boolean): object[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export function DayCell(
|
|
1
|
+
export function DayCell(props: object): object;
|
package/package.json
CHANGED
|
@@ -1,414 +0,0 @@
|
|
|
1
|
-
import { Div as l, Img as k, Span as D, Button as F } from "@base-framework/atoms";
|
|
2
|
-
import { Component as $, Data as P, Atom as z, DateTime as O } from "@base-framework/base";
|
|
3
|
-
import { B } from "./buttons-CVEwmPAi.js";
|
|
4
|
-
import { Icons as v } from "./icons.es.js";
|
|
5
|
-
const I = (t, e) => {
|
|
6
|
-
const n = t ? t.getBoundingClientRect() : { top: 0, bottom: 0, left: 0 }, s = e.getBoundingClientRect(), o = 10, a = window.scrollX, c = window.scrollY;
|
|
7
|
-
let d = n.left + a, u = n.bottom + c;
|
|
8
|
-
const i = window.innerHeight - n.bottom, f = n.top;
|
|
9
|
-
return d + s.width > window.innerWidth && (d = window.innerWidth - s.width - o), i < s.height && f > i ? u = n.top + c - s.height - o : i < s.height && (u = n.bottom + c - (s.height - i) - o), { x: d, y: u };
|
|
10
|
-
};
|
|
11
|
-
class ot extends $ {
|
|
12
|
-
/**
|
|
13
|
-
* This will set up the data.
|
|
14
|
-
*
|
|
15
|
-
* @returns {object}
|
|
16
|
-
*/
|
|
17
|
-
setData() {
|
|
18
|
-
const e = this.parent.data || new P();
|
|
19
|
-
return e.set({
|
|
20
|
-
position: { x: 0, y: 0 }
|
|
21
|
-
}), e;
|
|
22
|
-
}
|
|
23
|
-
/**
|
|
24
|
-
* This will get the class size.
|
|
25
|
-
*
|
|
26
|
-
* @returns {string}
|
|
27
|
-
*/
|
|
28
|
-
getSize() {
|
|
29
|
-
switch (this.size || "lg") {
|
|
30
|
-
case "sm":
|
|
31
|
-
return "w-48";
|
|
32
|
-
case "md":
|
|
33
|
-
return "w-64";
|
|
34
|
-
case "lg":
|
|
35
|
-
return "w-[250px]";
|
|
36
|
-
case "xl":
|
|
37
|
-
return "w-96";
|
|
38
|
-
case "2xl":
|
|
39
|
-
return "w-[400px]";
|
|
40
|
-
case "fit":
|
|
41
|
-
return "w-fit";
|
|
42
|
-
case "full":
|
|
43
|
-
return "w-full";
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
/**
|
|
47
|
-
* This will render the modal component.
|
|
48
|
-
*
|
|
49
|
-
* @returns {object}
|
|
50
|
-
*/
|
|
51
|
-
render() {
|
|
52
|
-
const e = this.getSize();
|
|
53
|
-
return l({
|
|
54
|
-
class: `absolute inset-auto fadeIn mt-2 rounded-md p-0 shadow-lg bg-popover min-h-12 backdrop:bg-transparent text-inherit r z-30 ${e}`,
|
|
55
|
-
popover: "auto",
|
|
56
|
-
toggle: (n, { state: s }) => n.newState === "closed" ? s.open = !1 : null,
|
|
57
|
-
style: "top: [[position.y]]px; left: [[position.x]]px"
|
|
58
|
-
}, this.children);
|
|
59
|
-
}
|
|
60
|
-
/**
|
|
61
|
-
* This will setup the states.
|
|
62
|
-
*
|
|
63
|
-
* @returns {object}
|
|
64
|
-
*/
|
|
65
|
-
setupStates() {
|
|
66
|
-
return {
|
|
67
|
-
open: {
|
|
68
|
-
id: this.parent.getId(),
|
|
69
|
-
callBack: (s) => {
|
|
70
|
-
this.state.open === !1 && this.destroy();
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
}
|
|
75
|
-
/**
|
|
76
|
-
* Updates the dropdown position.
|
|
77
|
-
*
|
|
78
|
-
* @returns {void}
|
|
79
|
-
*/
|
|
80
|
-
updatePosition() {
|
|
81
|
-
const e = this.button ?? null, n = this.panel, s = I(e, n);
|
|
82
|
-
this.data.position = s;
|
|
83
|
-
}
|
|
84
|
-
/**
|
|
85
|
-
* This will run after the setup.
|
|
86
|
-
*
|
|
87
|
-
* @returns {void}
|
|
88
|
-
*/
|
|
89
|
-
afterSetup() {
|
|
90
|
-
this.panel.showPopover(), this.updatePosition();
|
|
91
|
-
}
|
|
92
|
-
/**
|
|
93
|
-
* This will check if the element clicked was in the
|
|
94
|
-
* component of the button.
|
|
95
|
-
*
|
|
96
|
-
* @param {object} element
|
|
97
|
-
* @returns {boolean}
|
|
98
|
-
*/
|
|
99
|
-
isOutsideClick(e) {
|
|
100
|
-
return !this.panel.contains(e) && this.button && !this.button.contains(e);
|
|
101
|
-
}
|
|
102
|
-
/**
|
|
103
|
-
* This will set up the events.
|
|
104
|
-
*
|
|
105
|
-
* @returns {array}
|
|
106
|
-
*/
|
|
107
|
-
setupEvents() {
|
|
108
|
-
return [
|
|
109
|
-
["click", document, (e) => {
|
|
110
|
-
this.isOutsideClick(e.target) && (this.state.open = !1);
|
|
111
|
-
}],
|
|
112
|
-
["resize", window, (e) => this.updatePosition()],
|
|
113
|
-
["scroll", document, (e) => this.updatePosition()]
|
|
114
|
-
];
|
|
115
|
-
}
|
|
116
|
-
/**
|
|
117
|
-
* This will override the set up to use the app shell.
|
|
118
|
-
*
|
|
119
|
-
* @param {object} container
|
|
120
|
-
*/
|
|
121
|
-
setContainer(e) {
|
|
122
|
-
this.container = app.root;
|
|
123
|
-
}
|
|
124
|
-
/**
|
|
125
|
-
* This will hide the popover before destroying.
|
|
126
|
-
*
|
|
127
|
-
* @returns {void}
|
|
128
|
-
*/
|
|
129
|
-
beforeDestroy() {
|
|
130
|
-
this.panel.hidePopover();
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
const Y = z(({ src: t, alt: e }) => t ? k({
|
|
134
|
-
class: "absolute w-full h-full rounded-full object-cover fadeIn",
|
|
135
|
-
src: t,
|
|
136
|
-
alt: e,
|
|
137
|
-
/**
|
|
138
|
-
* If there's an error loading the image, hide it.
|
|
139
|
-
*/
|
|
140
|
-
error: (n) => n.target.style.display = "none"
|
|
141
|
-
}) : null), j = (t) => t.split(" ").map((e) => e.charAt(0)).join(""), N = (t) => !t || t.length < 2 ? t : j(t), A = (t) => D([t, (e, n) => {
|
|
142
|
-
n.textContent = N(e);
|
|
143
|
-
}]), M = {
|
|
144
|
-
xs: "h-6 w-6",
|
|
145
|
-
sm: "h-8 w-8",
|
|
146
|
-
md: "h-12 w-12",
|
|
147
|
-
lg: "h-16 w-16",
|
|
148
|
-
xl: "h-24 w-24",
|
|
149
|
-
"2xl": "h-32 w-32",
|
|
150
|
-
"3xl": "h-48 w-48",
|
|
151
|
-
default: "h-12 w-12"
|
|
152
|
-
}, b = {
|
|
153
|
-
xs: "text-[7px]",
|
|
154
|
-
sm: "text-xs",
|
|
155
|
-
md: "text-base",
|
|
156
|
-
lg: "text-xl",
|
|
157
|
-
xl: "text-2xl",
|
|
158
|
-
"2xl": "text-3xl",
|
|
159
|
-
"3xl": "text-4xl",
|
|
160
|
-
default: "text-base"
|
|
161
|
-
}, W = (t) => M[t] || M.default, H = (t) => b[t] || b.default, R = (t, e = null, n = "md") => {
|
|
162
|
-
const s = N(t), o = H(n);
|
|
163
|
-
return l(
|
|
164
|
-
{
|
|
165
|
-
class: `
|
|
166
|
-
flex items-center justify-center w-full h-full rounded-full
|
|
167
|
-
bg-muted text-muted-foreground font-medium
|
|
168
|
-
${o}
|
|
169
|
-
`
|
|
170
|
-
},
|
|
171
|
-
[
|
|
172
|
-
e ? A(e) : D(s)
|
|
173
|
-
]
|
|
174
|
-
);
|
|
175
|
-
}, rt = z(({ src: t, alt: e, fallbackText: n, watcherFallback: s, size: o }) => {
|
|
176
|
-
const a = W(o);
|
|
177
|
-
return l(
|
|
178
|
-
{
|
|
179
|
-
class: `relative flex items-center justify-center ${a}`
|
|
180
|
-
},
|
|
181
|
-
[
|
|
182
|
-
Y({ src: t, alt: e }),
|
|
183
|
-
R(n, s, o)
|
|
184
|
-
]
|
|
185
|
-
);
|
|
186
|
-
}), p = (t) => (t *= 1, t < 10 ? `0${t}` : String(t)), X = (t) => (t.indexOf("T") === -1 && t.indexOf(" ") === -1 && (t += "T00:00:01"), t.replace(" ", "T"), t), g = (t, e, n) => `${t}-${p(e + 1)}-${p(n)}`, E = (t) => t ? "bg-accent text-primary" : "", G = (t) => t ? "text-muted-foreground opacity-50" : "", L = (t, e) => t === e, q = (t, e) => L(t, e) ? "bg-primary text-primary-foreground" : "", J = (t, e, n, s) => {
|
|
187
|
-
const o = q(e, s);
|
|
188
|
-
if (o)
|
|
189
|
-
return o;
|
|
190
|
-
const a = E(t);
|
|
191
|
-
if (t)
|
|
192
|
-
return a;
|
|
193
|
-
const c = G(n);
|
|
194
|
-
return n ? c : "text-foreground";
|
|
195
|
-
}, m = ({ day: t, currentDate: e, date: n, isToday: s, isOutsideMonth: o, select: a }) => F(
|
|
196
|
-
{
|
|
197
|
-
class: `
|
|
198
|
-
flex items-center justify-center h-9 w-auto p-0 font-normal text-sm rounded-md
|
|
199
|
-
${J(s, e, o, n)}
|
|
200
|
-
hover:bg-muted/50 focus:z-10
|
|
201
|
-
`,
|
|
202
|
-
disabled: t === null,
|
|
203
|
-
"aria-label": t ? `Day ${t}` : null,
|
|
204
|
-
click: () => a(n)
|
|
205
|
-
},
|
|
206
|
-
t.toString()
|
|
207
|
-
), x = (t, e, n, s) => t === s.date && e === s.month && n === s.year, K = (t, e, n) => {
|
|
208
|
-
const { year: s, month: o } = t, a = g(s, o, t.date), c = new Date(s, o, 1).getDay(), d = new Date(s, o + 1, 0).getDate(), u = new Date(s, o, 0).getDate(), i = [], f = o === 0 ? 11 : o - 1, w = o === 0 ? s - 1 : s;
|
|
209
|
-
for (let r = c - 1; r >= 0; r--) {
|
|
210
|
-
const h = x(u - r, f, w, e);
|
|
211
|
-
i.push(
|
|
212
|
-
m({
|
|
213
|
-
day: u - r,
|
|
214
|
-
currentDate: a,
|
|
215
|
-
date: g(w, f, u - r),
|
|
216
|
-
isToday: h,
|
|
217
|
-
isOutsideMonth: !0,
|
|
218
|
-
select: n
|
|
219
|
-
})
|
|
220
|
-
);
|
|
221
|
-
}
|
|
222
|
-
for (let r = 1; r <= d; r++) {
|
|
223
|
-
const h = x(r, o, s, e);
|
|
224
|
-
i.push(
|
|
225
|
-
m({
|
|
226
|
-
day: r,
|
|
227
|
-
currentDate: a,
|
|
228
|
-
date: g(s, o, r),
|
|
229
|
-
isToday: h,
|
|
230
|
-
isOutsideMonth: !1,
|
|
231
|
-
select: n
|
|
232
|
-
})
|
|
233
|
-
);
|
|
234
|
-
}
|
|
235
|
-
const y = o === 11 ? 0 : o + 1, C = o === 11 ? s + 1 : s, T = (7 - i.length % 7) % 7;
|
|
236
|
-
for (let r = 1; r <= T; r++) {
|
|
237
|
-
const h = x(r, y, C, e);
|
|
238
|
-
i.push(
|
|
239
|
-
m({
|
|
240
|
-
day: r,
|
|
241
|
-
currentDate: a,
|
|
242
|
-
date: g(C, y, r),
|
|
243
|
-
isToday: h,
|
|
244
|
-
isOutsideMonth: !0,
|
|
245
|
-
select: n
|
|
246
|
-
})
|
|
247
|
-
);
|
|
248
|
-
}
|
|
249
|
-
return i;
|
|
250
|
-
}, Q = (t) => l(
|
|
251
|
-
{ class: "flex items-center justify-center h-9 w-auto text-[0.8rem] font-normal text-muted-foreground" },
|
|
252
|
-
t
|
|
253
|
-
), S = ({ label: t, click: e }) => B(
|
|
254
|
-
{
|
|
255
|
-
class: `
|
|
256
|
-
inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
|
|
257
|
-
opacity-50 hover:opacity-100 text-muted-foreground absolute
|
|
258
|
-
${t === "Previous" ? "left-1" : "right-1"}
|
|
259
|
-
focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
|
|
260
|
-
`,
|
|
261
|
-
click: e,
|
|
262
|
-
"aria-label": `${t} month`,
|
|
263
|
-
variant: "icon",
|
|
264
|
-
icon: t === "Previous" ? v.chevron.single.left : v.chevron.single.right
|
|
265
|
-
}
|
|
266
|
-
), U = ({ next: t, previous: e }) => l({ class: "flex flex-auto min-h-12 text-sm font-medium relative justify-center items-center" }, [
|
|
267
|
-
D("[[monthName]] [[current.year]]"),
|
|
268
|
-
S({
|
|
269
|
-
label: "Previous",
|
|
270
|
-
click: e
|
|
271
|
-
}),
|
|
272
|
-
S({
|
|
273
|
-
label: "Next",
|
|
274
|
-
click: t
|
|
275
|
-
})
|
|
276
|
-
]), V = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(Q), Z = (t) => l({ class: "rdp w-full space-y-1" }, [
|
|
277
|
-
U({
|
|
278
|
-
next: t.next,
|
|
279
|
-
previous: t.previous
|
|
280
|
-
}),
|
|
281
|
-
l({
|
|
282
|
-
class: "flex flex-auto flex-col w-full",
|
|
283
|
-
onSet: ["currentDate", () => [
|
|
284
|
-
l({ class: "grid grid-cols-7" }, V()),
|
|
285
|
-
l({ class: "grid grid-cols-7" }, K(
|
|
286
|
-
t.current,
|
|
287
|
-
t.today,
|
|
288
|
-
t.select
|
|
289
|
-
))
|
|
290
|
-
]]
|
|
291
|
-
})
|
|
292
|
-
]);
|
|
293
|
-
class at extends $ {
|
|
294
|
-
/**
|
|
295
|
-
* This will declare the props for the compiler.
|
|
296
|
-
*
|
|
297
|
-
* @returns {void}
|
|
298
|
-
*/
|
|
299
|
-
declareProps() {
|
|
300
|
-
this.selectedDate = null, this.selectedCallBack = null;
|
|
301
|
-
}
|
|
302
|
-
/**
|
|
303
|
-
* This will get the selected data.
|
|
304
|
-
*
|
|
305
|
-
* @param {object} today
|
|
306
|
-
* @returns {Date}
|
|
307
|
-
*/
|
|
308
|
-
getSelectedDate(e) {
|
|
309
|
-
const n = this.selectedDate ? new Date(X(this.selectedDate)) : e;
|
|
310
|
-
return new Date(n.getFullYear(), n.getMonth(), n.getDate());
|
|
311
|
-
}
|
|
312
|
-
/**
|
|
313
|
-
* This will set up the data for the calendar.
|
|
314
|
-
*
|
|
315
|
-
* @returns {Data}
|
|
316
|
-
*/
|
|
317
|
-
setData() {
|
|
318
|
-
const e = /* @__PURE__ */ new Date(), n = this.getSelectedDate(e), s = n.getMonth();
|
|
319
|
-
return new P({
|
|
320
|
-
monthName: this.getMonthName(s),
|
|
321
|
-
currentDate: `${n.getFullYear()}-${s + 1}-${n.getDate()}`,
|
|
322
|
-
current: {
|
|
323
|
-
date: n.getDate(),
|
|
324
|
-
year: n.getFullYear(),
|
|
325
|
-
month: s
|
|
326
|
-
},
|
|
327
|
-
today: {
|
|
328
|
-
date: e.getDate(),
|
|
329
|
-
month: e.getMonth(),
|
|
330
|
-
year: e.getFullYear()
|
|
331
|
-
}
|
|
332
|
-
});
|
|
333
|
-
}
|
|
334
|
-
/**
|
|
335
|
-
* This will get the name of the month.
|
|
336
|
-
*
|
|
337
|
-
* @param {number} month
|
|
338
|
-
* @returns {string}
|
|
339
|
-
*/
|
|
340
|
-
getMonthName(e) {
|
|
341
|
-
return O.monthNames[e];
|
|
342
|
-
}
|
|
343
|
-
/**
|
|
344
|
-
* This will go to the previous month.
|
|
345
|
-
*
|
|
346
|
-
* @returns {void}
|
|
347
|
-
*/
|
|
348
|
-
goToPreviousMonth() {
|
|
349
|
-
const e = this.data;
|
|
350
|
-
let n = e.current.month, s = e.current.year;
|
|
351
|
-
n === 0 ? (n = 11, s--) : n--, this.setCurrentDate(n, s);
|
|
352
|
-
}
|
|
353
|
-
/**
|
|
354
|
-
* This will go to the next month.
|
|
355
|
-
*
|
|
356
|
-
* @returns {void}
|
|
357
|
-
*/
|
|
358
|
-
goToNextMonth() {
|
|
359
|
-
const e = this.data;
|
|
360
|
-
let n = e.current.month, s = e.current.year;
|
|
361
|
-
n === 11 ? (n = 0, s++) : n++, this.setCurrentDate(n, s);
|
|
362
|
-
}
|
|
363
|
-
/**
|
|
364
|
-
* This will set the current month and year.
|
|
365
|
-
*
|
|
366
|
-
* @param {number} month
|
|
367
|
-
* @param {number} year
|
|
368
|
-
* @param {number} [date=null]
|
|
369
|
-
* @returns {void}
|
|
370
|
-
*/
|
|
371
|
-
setCurrentDate(e, n, s = null) {
|
|
372
|
-
const o = this.data;
|
|
373
|
-
o.current.month = e, o.current.year = n, typeof s == "number" && (o.current.date = p(s)), o.currentDate = `${n}-${p(e + 1)}-${o.current.date}`, o.monthName = this.getMonthName(e);
|
|
374
|
-
}
|
|
375
|
-
/**
|
|
376
|
-
* This will select a date.
|
|
377
|
-
*
|
|
378
|
-
* @param {string} date
|
|
379
|
-
* @returns {void}
|
|
380
|
-
*/
|
|
381
|
-
selectDate(e) {
|
|
382
|
-
const n = /* @__PURE__ */ new Date(e + "T00:00:00");
|
|
383
|
-
this.setCurrentDate(n.getMonth(), n.getFullYear(), n.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(this.data.currentDate);
|
|
384
|
-
}
|
|
385
|
-
/**
|
|
386
|
-
* This will render the calendar.
|
|
387
|
-
*
|
|
388
|
-
* @returns {object}
|
|
389
|
-
*/
|
|
390
|
-
render() {
|
|
391
|
-
return l({ class: "calendar-container p-3 rounded-md border min-w-80" }, [
|
|
392
|
-
Z({
|
|
393
|
-
current: this.data.current,
|
|
394
|
-
today: this.data.today,
|
|
395
|
-
select: (e) => this.selectDate(e),
|
|
396
|
-
next: () => this.goToNextMonth(),
|
|
397
|
-
previous: () => this.goToPreviousMonth()
|
|
398
|
-
})
|
|
399
|
-
]);
|
|
400
|
-
}
|
|
401
|
-
}
|
|
402
|
-
export {
|
|
403
|
-
rt as A,
|
|
404
|
-
K as C,
|
|
405
|
-
m as D,
|
|
406
|
-
g as F,
|
|
407
|
-
Z as M,
|
|
408
|
-
ot as P,
|
|
409
|
-
Q as a,
|
|
410
|
-
at as b,
|
|
411
|
-
X as c,
|
|
412
|
-
I as g,
|
|
413
|
-
p
|
|
414
|
-
};
|