@box-kite/react 2.2.16 → 2.2.17
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/components/datePicker.cjs +1 -1
- package/components/datePicker.mjs +196 -193
- package/components/dialog.cjs +1 -1
- package/components/dialog.mjs +85 -84
- package/components/menu.cjs +1 -1
- package/components/menu.mjs +119 -118
- package/components/overlay.cjs +1 -1
- package/components/overlay.mjs +1 -0
- package/components/popover.cjs +1 -1
- package/components/popover.mjs +49 -48
- package/components/presence.cjs +1 -1
- package/components/presence.mjs +1 -1
- package/components/semantics.d.ts +29 -29
- package/components/swipeItem.cjs +1 -1
- package/components/swipeItem.mjs +1 -1
- package/components/tabs.cjs +1 -1
- package/components/tabs.mjs +1 -1
- package/components/toaster.cjs +1 -1
- package/components/toaster.mjs +1 -1
- package/docs/props.md +2 -2
- package/motion.cjs +1 -1
- package/motion.mjs +30 -20
- package/package.json +40 -40
- package/react/animation/useHeldContent.d.ts +6 -0
- package/react/animation/usePresence.d.ts +4 -0
|
@@ -13,17 +13,18 @@ import { n as ee } from "../date-environment.mjs";
|
|
|
13
13
|
import x from "./calendar.mjs";
|
|
14
14
|
import { t as S } from "../layer.mjs";
|
|
15
15
|
import C from "./overlay.mjs";
|
|
16
|
-
import w from "
|
|
17
|
-
import
|
|
18
|
-
import {
|
|
16
|
+
import { n as w } from "../motion.mjs";
|
|
17
|
+
import te from "./dateField.mjs";
|
|
18
|
+
import { useCallback as T, useEffect as E, useMemo as D, useRef as ne, useState as re } from "react";
|
|
19
|
+
import { Fragment as ie, jsx as O, jsxs as k } from "react/jsx-runtime";
|
|
19
20
|
//#region src/components/datePicker.tsx
|
|
20
|
-
function
|
|
21
|
-
return /* @__PURE__ */
|
|
21
|
+
function A() {
|
|
22
|
+
return /* @__PURE__ */ O(b, {
|
|
22
23
|
viewBox: "0 0 16 16",
|
|
23
24
|
width: "1rem",
|
|
24
25
|
height: "1rem",
|
|
25
26
|
props: { fill: "none" },
|
|
26
|
-
children: /* @__PURE__ */
|
|
27
|
+
children: /* @__PURE__ */ O(y, {
|
|
27
28
|
d: "M3 3.5h10a1 1 0 0 1 1 1V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4.5a1 1 0 0 1 1-1ZM2 7h12M5.5 2v3M10.5 2v3",
|
|
28
29
|
stroke: "currentColor",
|
|
29
30
|
strokeWidth: 1.5,
|
|
@@ -31,13 +32,13 @@ function re() {
|
|
|
31
32
|
})
|
|
32
33
|
});
|
|
33
34
|
}
|
|
34
|
-
function
|
|
35
|
-
return /* @__PURE__ */
|
|
35
|
+
function j() {
|
|
36
|
+
return /* @__PURE__ */ O(b, {
|
|
36
37
|
viewBox: "0 0 16 16",
|
|
37
38
|
width: "1rem",
|
|
38
39
|
height: "1rem",
|
|
39
40
|
props: { fill: "none" },
|
|
40
|
-
children: /* @__PURE__ */
|
|
41
|
+
children: /* @__PURE__ */ O(y, {
|
|
41
42
|
d: "M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12ZM8 5v3l2 1.5",
|
|
42
43
|
stroke: "currentColor",
|
|
43
44
|
strokeWidth: 1.5,
|
|
@@ -47,12 +48,12 @@ function ie() {
|
|
|
47
48
|
});
|
|
48
49
|
}
|
|
49
50
|
function ae() {
|
|
50
|
-
return /* @__PURE__ */
|
|
51
|
+
return /* @__PURE__ */ O(b, {
|
|
51
52
|
viewBox: "0 0 16 16",
|
|
52
53
|
width: "0.875rem",
|
|
53
54
|
height: "0.875rem",
|
|
54
55
|
props: { fill: "none" },
|
|
55
|
-
children: /* @__PURE__ */
|
|
56
|
+
children: /* @__PURE__ */ O(y, {
|
|
56
57
|
d: "m4.5 4.5 7 7m0-7-7 7",
|
|
57
58
|
stroke: "currentColor",
|
|
58
59
|
strokeWidth: 1.5,
|
|
@@ -61,7 +62,7 @@ function ae() {
|
|
|
61
62
|
});
|
|
62
63
|
}
|
|
63
64
|
function oe(e) {
|
|
64
|
-
let [i, o] =
|
|
65
|
+
let [i, o] = re(null), s = e.ref, c = T((e) => {
|
|
65
66
|
o(e), t(s, e);
|
|
66
67
|
}, [s]), l = (e) => {
|
|
67
68
|
if (!e || e.contains(document.activeElement) && document.activeElement !== e) return;
|
|
@@ -93,9 +94,11 @@ function oe(e) {
|
|
|
93
94
|
matchWidth: e.matchWidth,
|
|
94
95
|
anchor: i
|
|
95
96
|
});
|
|
96
|
-
|
|
97
|
+
E(() => {
|
|
97
98
|
f && l(v);
|
|
98
|
-
}, [f, v])
|
|
99
|
+
}, [f, v]);
|
|
100
|
+
let b = T(() => v, [v]), ee = w(f, b);
|
|
101
|
+
return {
|
|
99
102
|
attachTrigger: g.ref,
|
|
100
103
|
triggerAttributes: g.props,
|
|
101
104
|
triggerElement: _,
|
|
@@ -113,7 +116,7 @@ function oe(e) {
|
|
|
113
116
|
"aria-label": e.label,
|
|
114
117
|
tabIndex: -1
|
|
115
118
|
};
|
|
116
|
-
return d ? /* @__PURE__ */
|
|
119
|
+
return d ? /* @__PURE__ */ O(n, {
|
|
117
120
|
ref: m,
|
|
118
121
|
component: "popover",
|
|
119
122
|
variant: { topLayer: !0 },
|
|
@@ -124,8 +127,8 @@ function oe(e) {
|
|
|
124
127
|
popover: "auto",
|
|
125
128
|
...r
|
|
126
129
|
},
|
|
127
|
-
children:
|
|
128
|
-
}) : f && /* @__PURE__ */
|
|
130
|
+
children: ee === "closed" ? null : t
|
|
131
|
+
}) : f && /* @__PURE__ */ O(C, {
|
|
129
132
|
contentRef: m,
|
|
130
133
|
anchor: i,
|
|
131
134
|
side: e.side,
|
|
@@ -158,7 +161,7 @@ function se(e) {
|
|
|
158
161
|
ps: 2,
|
|
159
162
|
bs: 1
|
|
160
163
|
} : {};
|
|
161
|
-
return m.length === 0 ? /* @__PURE__ */
|
|
164
|
+
return m.length === 0 ? /* @__PURE__ */ O(n, {
|
|
162
165
|
component: "datePicker.empty",
|
|
163
166
|
flexGrow: 1,
|
|
164
167
|
px: 3,
|
|
@@ -167,7 +170,7 @@ function se(e) {
|
|
|
167
170
|
...b,
|
|
168
171
|
props: { role: "status" },
|
|
169
172
|
children: f
|
|
170
|
-
}) : /* @__PURE__ */
|
|
173
|
+
}) : /* @__PURE__ */ O(n, {
|
|
171
174
|
component: "datePicker.times",
|
|
172
175
|
position: "relative",
|
|
173
176
|
display: "flex",
|
|
@@ -183,7 +186,7 @@ function se(e) {
|
|
|
183
186
|
"aria-label": l,
|
|
184
187
|
onKeyDown: y.onKeyDown
|
|
185
188
|
},
|
|
186
|
-
children: m.map((e, t) => /* @__PURE__ */
|
|
189
|
+
children: m.map((e, t) => /* @__PURE__ */ O(n, {
|
|
187
190
|
component: "datePicker.time",
|
|
188
191
|
variant: { selected: e === _ },
|
|
189
192
|
px: 3,
|
|
@@ -209,7 +212,7 @@ function se(e) {
|
|
|
209
212
|
});
|
|
210
213
|
}
|
|
211
214
|
function ce(e) {
|
|
212
|
-
return /* @__PURE__ */
|
|
215
|
+
return /* @__PURE__ */ O(n, {
|
|
213
216
|
component: "datePicker.presets",
|
|
214
217
|
display: "flex",
|
|
215
218
|
d: "column",
|
|
@@ -217,7 +220,7 @@ function ce(e) {
|
|
|
217
220
|
pe: 2,
|
|
218
221
|
be: 1,
|
|
219
222
|
props: { role: "group" },
|
|
220
|
-
children: e.presets.map((t) => /* @__PURE__ */
|
|
223
|
+
children: e.presets.map((t) => /* @__PURE__ */ O(n, {
|
|
221
224
|
tag: "button",
|
|
222
225
|
component: "datePicker.preset",
|
|
223
226
|
variant: { selected: e.isSelected(t.value) },
|
|
@@ -236,11 +239,11 @@ function ce(e) {
|
|
|
236
239
|
});
|
|
237
240
|
}
|
|
238
241
|
function le(e) {
|
|
239
|
-
let { frame: t, attachField: i, attachTrigger: a, triggerAttributes: o, triggerElement: s, id: c, label: l, labelledBy: u, describedBy: d } = e, { text: f, placeholder: p, icon: m, clear: h, disabled: g, invalid: _, required: v = !1, tabIndex: y, inputs: b, onReset: ee } = e, x =
|
|
242
|
+
let { frame: t, attachField: i, attachTrigger: a, triggerAttributes: o, triggerElement: s, id: c, label: l, labelledBy: u, describedBy: d } = e, { text: f, placeholder: p, icon: m, clear: h, disabled: g, invalid: _, required: v = !1, tabIndex: y, inputs: b, onReset: ee } = e, x = ne(null), S = l === void 0 ? void 0 : `${c}-label`, C = `${c}-value`, w = r(ee);
|
|
240
243
|
return E(() => {
|
|
241
244
|
let e = x.current?.form;
|
|
242
245
|
if (e) return e.addEventListener("reset", w), () => e.removeEventListener("reset", w);
|
|
243
|
-
}, [w]), /* @__PURE__ */
|
|
246
|
+
}, [w]), /* @__PURE__ */ k(ie, { children: [l !== void 0 && /* @__PURE__ */ O(n, {
|
|
244
247
|
component: "dateField.label",
|
|
245
248
|
display: "block",
|
|
246
249
|
mb: 1.5,
|
|
@@ -248,7 +251,7 @@ function le(e) {
|
|
|
248
251
|
id: S,
|
|
249
252
|
props: { onClick: () => s?.focus() },
|
|
250
253
|
children: l
|
|
251
|
-
}), /* @__PURE__ */
|
|
254
|
+
}), /* @__PURE__ */ k(n, {
|
|
252
255
|
ref: i,
|
|
253
256
|
component: "dateField",
|
|
254
257
|
display: "inline-flex",
|
|
@@ -262,7 +265,7 @@ function le(e) {
|
|
|
262
265
|
invalid: _
|
|
263
266
|
}],
|
|
264
267
|
children: [
|
|
265
|
-
/* @__PURE__ */
|
|
268
|
+
/* @__PURE__ */ O(n, {
|
|
266
269
|
tag: "button",
|
|
267
270
|
ref: a,
|
|
268
271
|
component: "datePicker.value",
|
|
@@ -288,17 +291,17 @@ function le(e) {
|
|
|
288
291
|
"aria-invalid": _ || void 0,
|
|
289
292
|
...o
|
|
290
293
|
},
|
|
291
|
-
children: /* @__PURE__ */
|
|
294
|
+
children: /* @__PURE__ */ O("span", {
|
|
292
295
|
id: C,
|
|
293
296
|
children: f || p
|
|
294
297
|
})
|
|
295
298
|
}),
|
|
296
|
-
/* @__PURE__ */
|
|
299
|
+
/* @__PURE__ */ k(n, {
|
|
297
300
|
display: "inline-flex",
|
|
298
301
|
ai: "center",
|
|
299
302
|
gap: 1,
|
|
300
303
|
ms: 2,
|
|
301
|
-
children: [h, /* @__PURE__ */
|
|
304
|
+
children: [h, /* @__PURE__ */ O(n, {
|
|
302
305
|
component: "datePicker.icon",
|
|
303
306
|
display: "inline-flex",
|
|
304
307
|
ai: "center",
|
|
@@ -310,7 +313,7 @@ function le(e) {
|
|
|
310
313
|
children: m
|
|
311
314
|
})]
|
|
312
315
|
}),
|
|
313
|
-
b.map((e, t) => v ? /* @__PURE__ */
|
|
316
|
+
b.map((e, t) => v ? /* @__PURE__ */ O(n, {
|
|
314
317
|
tag: "input",
|
|
315
318
|
ref: t === 0 ? x : void 0,
|
|
316
319
|
component: "dateField.validation",
|
|
@@ -325,7 +328,7 @@ function le(e) {
|
|
|
325
328
|
onChange: () => {},
|
|
326
329
|
onFocus: () => s?.focus()
|
|
327
330
|
}
|
|
328
|
-
}, t) : e.name === void 0 ? null : /* @__PURE__ */
|
|
331
|
+
}, t) : e.name === void 0 ? null : /* @__PURE__ */ O("input", {
|
|
329
332
|
ref: t === 0 ? x : void 0,
|
|
330
333
|
type: "hidden",
|
|
331
334
|
name: e.name,
|
|
@@ -335,62 +338,62 @@ function le(e) {
|
|
|
335
338
|
]
|
|
336
339
|
})] });
|
|
337
340
|
}
|
|
338
|
-
function
|
|
339
|
-
let { type: r = "date", value: i, defaultValue: a = null, onValueChange: o, zone: h, locale: g, hourCycle: y, granularity: b, disambiguation: S, min: C, max:
|
|
341
|
+
function M(e, t) {
|
|
342
|
+
let { type: r = "date", value: i, defaultValue: a = null, onValueChange: o, zone: h, locale: g, hourCycle: y, granularity: b, disambiguation: S, min: C, max: w, isDateUnavailable: T, disabled: E = !1, readOnly: D = !1, required: ne, invalid: re, name: M, label: N, labelledBy: P, describedBy: F, open: ue, defaultOpen: de, onOpenChange: fe, closeOnSelect: I = !0, firstDayOfWeek: L, weekNumbers: pe, side: R = "bottom", align: me = "start", matchWidth: he = r === "time", emptyTimesLabel: ge = "No times available", clearable: _e = !1, pickOnly: z = !1, triggerLabel: ve, clearLabel: ye = "Clear", tabIndex: B, step: V = 30, defaultTime: H = "00:00", presets: U, showZone: W, ...be } = e, G = ee({
|
|
340
343
|
locale: g,
|
|
341
344
|
zone: h === "none" ? void 0 : h
|
|
342
|
-
}), { locale:
|
|
345
|
+
}), { locale: K } = G, q = r === "datetime" && h !== "none" ? G.zone : null, J = q ?? G.zone, [Y, X] = _({
|
|
343
346
|
value: i,
|
|
344
347
|
defaultValue: a,
|
|
345
348
|
onChange: (e, t) => o?.(e, {
|
|
346
349
|
...t,
|
|
347
|
-
...m(e,
|
|
350
|
+
...m(e, J)
|
|
348
351
|
}),
|
|
349
352
|
interaction: {
|
|
350
353
|
component: "datePicker",
|
|
351
354
|
type: "valueChange",
|
|
352
355
|
content: ["value"]
|
|
353
356
|
}
|
|
354
|
-
}),
|
|
357
|
+
}), Z = ve ?? (r === "time" ? "Choose time" : "Choose date"), xe = typeof N == "string" ? N : Z, { attachTrigger: Q, triggerAttributes: Se, triggerElement: Ce, closeOnChoice: we, id: Te, attachField: Ee, panel: De } = oe({
|
|
355
358
|
ref: t,
|
|
356
|
-
open:
|
|
357
|
-
defaultOpen:
|
|
358
|
-
onOpenChange:
|
|
359
|
-
side:
|
|
360
|
-
align:
|
|
359
|
+
open: ue,
|
|
360
|
+
defaultOpen: de,
|
|
361
|
+
onOpenChange: fe,
|
|
362
|
+
side: R,
|
|
363
|
+
align: me,
|
|
361
364
|
matchWidth: he,
|
|
362
|
-
label:
|
|
363
|
-
}), $ =
|
|
364
|
-
locale:
|
|
365
|
-
zone:
|
|
365
|
+
label: xe
|
|
366
|
+
}), $ = Y && r !== "time" ? d(Y, { zone: J }) : null, Oe = Y && r !== "date" ? l(Y, { zone: J }) : null, ke = r === "datetime" ? $ ?? u(J) : null, Ae = (e) => e && (ke === null || d(e, { zone: J }) === ke) ? l(e, { zone: J }) : null, je = Y ? c(Y, {
|
|
367
|
+
locale: K,
|
|
368
|
+
zone: J,
|
|
366
369
|
hourCycle: y === void 0 ? void 0 : y === 12 ? "h12" : "h23",
|
|
367
370
|
...r === "date" ? { dateStyle: "medium" } : r === "time" ? { timeStyle: "short" } : {
|
|
368
371
|
dateStyle: "medium",
|
|
369
372
|
timeStyle: "short"
|
|
370
373
|
}
|
|
371
|
-
}) : "", Me =
|
|
372
|
-
locale:
|
|
374
|
+
}) : "", Me = z && Y && q && (W ?? q !== G.readerZone) ? s(q, {
|
|
375
|
+
locale: K,
|
|
373
376
|
style: "short",
|
|
374
|
-
at:
|
|
375
|
-
}) : null, Ne = we, Pe = (e, t) => p(e, t,
|
|
376
|
-
zone:
|
|
377
|
+
at: Y
|
|
378
|
+
}) : null, Ne = we, Pe = (e, t) => p(e, t, q ? {
|
|
379
|
+
zone: q,
|
|
377
380
|
disambiguation: S
|
|
378
381
|
} : {}), Fe = (e, t) => {
|
|
379
|
-
e && (r === "date" ? (
|
|
382
|
+
e && (r === "date" ? (X(e, {
|
|
380
383
|
reason: "select",
|
|
381
384
|
event: t
|
|
382
|
-
}),
|
|
385
|
+
}), I && Ne(t)) : X(Pe(e, Oe ?? H), {
|
|
383
386
|
reason: "select",
|
|
384
387
|
event: t
|
|
385
388
|
}));
|
|
386
389
|
}, Ie = (e, t) => {
|
|
387
|
-
|
|
390
|
+
X(r === "time" ? e : Pe($ ?? u(J), e), {
|
|
388
391
|
reason: "select",
|
|
389
392
|
event: t
|
|
390
|
-
}),
|
|
391
|
-
}, Le = /* @__PURE__ */
|
|
393
|
+
}), I && Ne(t);
|
|
394
|
+
}, Le = /* @__PURE__ */ O(n, {
|
|
392
395
|
tag: "button",
|
|
393
|
-
ref:
|
|
396
|
+
ref: Q,
|
|
394
397
|
component: "datePicker.trigger",
|
|
395
398
|
display: "inline-flex",
|
|
396
399
|
ai: "center",
|
|
@@ -400,15 +403,15 @@ function j(e, t) {
|
|
|
400
403
|
ms: 2,
|
|
401
404
|
me: -1.5,
|
|
402
405
|
borderRadius: 1.5,
|
|
403
|
-
disabled:
|
|
406
|
+
disabled: E || D,
|
|
404
407
|
props: {
|
|
405
408
|
type: "button",
|
|
406
|
-
"aria-label": je ? `${
|
|
407
|
-
tabIndex:
|
|
409
|
+
"aria-label": je ? `${Z}, ${je}` : Z,
|
|
410
|
+
tabIndex: B,
|
|
408
411
|
...Se
|
|
409
412
|
},
|
|
410
|
-
children:
|
|
411
|
-
}), Re =
|
|
413
|
+
children: O(r === "time" ? j : A, {})
|
|
414
|
+
}), Re = _e && Y && !E && !D && /* @__PURE__ */ O(n, {
|
|
412
415
|
tag: "button",
|
|
413
416
|
component: "datePicker.clear",
|
|
414
417
|
display: "inline-flex",
|
|
@@ -422,46 +425,46 @@ function j(e, t) {
|
|
|
422
425
|
zIndex: 1,
|
|
423
426
|
props: {
|
|
424
427
|
type: "button",
|
|
425
|
-
"aria-label":
|
|
426
|
-
tabIndex:
|
|
427
|
-
onClick: (e) =>
|
|
428
|
+
"aria-label": ye,
|
|
429
|
+
tabIndex: B,
|
|
430
|
+
onClick: (e) => X(null, {
|
|
428
431
|
reason: "clear",
|
|
429
432
|
event: e
|
|
430
433
|
})
|
|
431
434
|
},
|
|
432
|
-
children: /* @__PURE__ */
|
|
433
|
-
}), ze =
|
|
434
|
-
frame:
|
|
435
|
+
children: /* @__PURE__ */ O(ae, {})
|
|
436
|
+
}), ze = Y !== null && (C != null && f(Y, C) < 0 || w != null && f(Y, w) > 0), Be = z ? /* @__PURE__ */ O(le, {
|
|
437
|
+
frame: be,
|
|
435
438
|
attachField: Ee,
|
|
436
|
-
attachTrigger:
|
|
437
|
-
triggerAttributes:
|
|
439
|
+
attachTrigger: D ? void 0 : Q,
|
|
440
|
+
triggerAttributes: D ? void 0 : Se,
|
|
438
441
|
triggerElement: Ce,
|
|
439
442
|
id: Te,
|
|
440
443
|
label: N,
|
|
441
444
|
labelledBy: P,
|
|
442
|
-
describedBy:
|
|
445
|
+
describedBy: F,
|
|
443
446
|
text: Me ? `${je} ${Me}` : je,
|
|
444
|
-
placeholder:
|
|
445
|
-
icon:
|
|
447
|
+
placeholder: Z,
|
|
448
|
+
icon: O(r === "time" ? j : A, {}),
|
|
446
449
|
clear: Re,
|
|
447
|
-
disabled:
|
|
448
|
-
invalid:
|
|
449
|
-
required:
|
|
450
|
-
tabIndex:
|
|
450
|
+
disabled: E,
|
|
451
|
+
invalid: re ?? (ze || $ !== null && !!T?.($)),
|
|
452
|
+
required: ne,
|
|
453
|
+
tabIndex: B,
|
|
451
454
|
inputs: [{
|
|
452
455
|
name: M,
|
|
453
|
-
value:
|
|
456
|
+
value: Y ?? ""
|
|
454
457
|
}],
|
|
455
|
-
onReset: (e) =>
|
|
458
|
+
onReset: (e) => X(a, {
|
|
456
459
|
reason: "reset",
|
|
457
460
|
event: e
|
|
458
461
|
})
|
|
459
|
-
}) : /* @__PURE__ */
|
|
462
|
+
}) : /* @__PURE__ */ O(te, {
|
|
460
463
|
ref: Ee,
|
|
461
|
-
...
|
|
464
|
+
...be,
|
|
462
465
|
type: r,
|
|
463
|
-
value:
|
|
464
|
-
onValueChange: (e, t) =>
|
|
466
|
+
value: Y,
|
|
467
|
+
onValueChange: (e, t) => X(e, {
|
|
465
468
|
reason: t.reason,
|
|
466
469
|
event: t.event
|
|
467
470
|
}),
|
|
@@ -471,63 +474,63 @@ function j(e, t) {
|
|
|
471
474
|
granularity: b,
|
|
472
475
|
disambiguation: S,
|
|
473
476
|
min: C,
|
|
474
|
-
max:
|
|
475
|
-
isDateUnavailable:
|
|
476
|
-
disabled:
|
|
477
|
-
readOnly:
|
|
478
|
-
required:
|
|
479
|
-
invalid:
|
|
477
|
+
max: w,
|
|
478
|
+
isDateUnavailable: T,
|
|
479
|
+
disabled: E,
|
|
480
|
+
readOnly: D,
|
|
481
|
+
required: ne,
|
|
482
|
+
invalid: re,
|
|
480
483
|
name: M,
|
|
481
484
|
label: N,
|
|
482
485
|
labelledBy: P,
|
|
483
|
-
describedBy:
|
|
484
|
-
showZone:
|
|
485
|
-
tabIndex:
|
|
486
|
-
end: /* @__PURE__ */
|
|
486
|
+
describedBy: F,
|
|
487
|
+
showZone: W,
|
|
488
|
+
tabIndex: B,
|
|
489
|
+
end: /* @__PURE__ */ k(ie, { children: [Re, Le] })
|
|
487
490
|
});
|
|
488
|
-
return /* @__PURE__ */
|
|
491
|
+
return /* @__PURE__ */ k(v, { children: [Be, De(/* @__PURE__ */ k(n, {
|
|
489
492
|
display: "flex",
|
|
490
493
|
gap: 3,
|
|
491
494
|
ai: "stretch",
|
|
492
495
|
children: [
|
|
493
|
-
|
|
494
|
-
presets:
|
|
495
|
-
isSelected: (e) =>
|
|
496
|
+
U && U.length > 0 && /* @__PURE__ */ O(ce, {
|
|
497
|
+
presets: U,
|
|
498
|
+
isSelected: (e) => Y !== null && f(e, Y, { zone: J }) === 0,
|
|
496
499
|
onSelect: (e, t) => {
|
|
497
|
-
|
|
500
|
+
X(e, {
|
|
498
501
|
reason: "preset",
|
|
499
502
|
event: t
|
|
500
|
-
}),
|
|
503
|
+
}), I && Ne(t);
|
|
501
504
|
}
|
|
502
505
|
}),
|
|
503
|
-
r !== "time" && /* @__PURE__ */
|
|
506
|
+
r !== "time" && /* @__PURE__ */ O(x, {
|
|
504
507
|
value: $,
|
|
505
508
|
onValueChange: (e, t) => Fe(e, t.event),
|
|
506
|
-
min: C ? d(C, { zone:
|
|
507
|
-
max:
|
|
508
|
-
isDateUnavailable:
|
|
509
|
+
min: C ? d(C, { zone: J }) : void 0,
|
|
510
|
+
max: w ? d(w, { zone: J }) : void 0,
|
|
511
|
+
isDateUnavailable: T,
|
|
509
512
|
locale: g,
|
|
510
513
|
zone: h === "none" ? void 0 : h,
|
|
511
|
-
firstDayOfWeek:
|
|
512
|
-
weekNumbers:
|
|
514
|
+
firstDayOfWeek: L,
|
|
515
|
+
weekNumbers: pe
|
|
513
516
|
}),
|
|
514
|
-
r !== "date" && /* @__PURE__ */
|
|
517
|
+
r !== "date" && /* @__PURE__ */ O(se, {
|
|
515
518
|
value: Oe,
|
|
516
|
-
step:
|
|
517
|
-
locale:
|
|
519
|
+
step: V,
|
|
520
|
+
locale: K,
|
|
518
521
|
hourCycle: y,
|
|
519
|
-
label: r === "time" ?
|
|
522
|
+
label: r === "time" ? xe : "Time",
|
|
520
523
|
min: Ae(C),
|
|
521
|
-
max: Ae(
|
|
522
|
-
emptyLabel:
|
|
524
|
+
max: Ae(w),
|
|
525
|
+
emptyLabel: ge,
|
|
523
526
|
separated: r === "datetime",
|
|
524
527
|
onSelect: Ie
|
|
525
528
|
})
|
|
526
529
|
]
|
|
527
530
|
}))] });
|
|
528
531
|
}
|
|
529
|
-
function
|
|
530
|
-
let { value: r, defaultValue: i = null, onValueChange: a, locale: s, min: c, max: l, isDateUnavailable: u, disabled: d = !1, readOnly: p = !1, required: m, invalid: h, startName: g, endName: y, label: b, labelledBy: S, describedBy: C, startLabel:
|
|
532
|
+
function N(e, t) {
|
|
533
|
+
let { value: r, defaultValue: i = null, onValueChange: a, locale: s, min: c, max: l, isDateUnavailable: u, disabled: d = !1, readOnly: p = !1, required: m, invalid: h, startName: g, endName: y, label: b, labelledBy: S, describedBy: C, startLabel: w = "Start date", endLabel: T = "End date", open: E, defaultOpen: D, onOpenChange: ne, closeOnSelect: j = !0, firstDayOfWeek: se, weekNumbers: M, months: N = 2, side: P = "bottom", align: F = "start", matchWidth: ue = !1, emptyTimesLabel: de, clearable: fe = !1, pickOnly: I = !1, triggerLabel: L = "Choose dates", clearLabel: pe = "Clear", tabIndex: R, presets: me, props: he, ...ge } = e, { locale: _e } = ee({ locale: s }), [z, ve] = _({
|
|
531
534
|
value: r,
|
|
532
535
|
defaultValue: i,
|
|
533
536
|
onChange: a,
|
|
@@ -536,39 +539,39 @@ function M(e, t) {
|
|
|
536
539
|
type: "valueChange",
|
|
537
540
|
content: ["value"]
|
|
538
541
|
}
|
|
539
|
-
}), [
|
|
540
|
-
start:
|
|
541
|
-
end:
|
|
542
|
-
source:
|
|
543
|
-
}), { start:
|
|
544
|
-
|
|
545
|
-
start:
|
|
546
|
-
end:
|
|
547
|
-
source:
|
|
542
|
+
}), [ye, B] = re({
|
|
543
|
+
start: z?.start ?? null,
|
|
544
|
+
end: z?.end ?? null,
|
|
545
|
+
source: z
|
|
546
|
+
}), { start: V, end: H } = ye;
|
|
547
|
+
ye.source !== z && (V = z?.start ?? null, H = z?.end ?? null, B({
|
|
548
|
+
start: V,
|
|
549
|
+
end: H,
|
|
550
|
+
source: z
|
|
548
551
|
}));
|
|
549
|
-
let { attachTrigger:
|
|
552
|
+
let { attachTrigger: U, triggerAttributes: W, triggerElement: be, closeOnChoice: G, id: K, attachField: q, panel: J } = oe({
|
|
550
553
|
ref: t,
|
|
551
|
-
open:
|
|
552
|
-
defaultOpen:
|
|
553
|
-
onOpenChange:
|
|
554
|
+
open: E,
|
|
555
|
+
defaultOpen: D,
|
|
556
|
+
onOpenChange: ne,
|
|
554
557
|
side: P,
|
|
555
|
-
align:
|
|
556
|
-
matchWidth:
|
|
557
|
-
label: typeof b == "string" ? b :
|
|
558
|
-
}),
|
|
558
|
+
align: F,
|
|
559
|
+
matchWidth: ue,
|
|
560
|
+
label: typeof b == "string" ? b : L
|
|
561
|
+
}), Y = z ? o(z.start, z.end, { locale: _e }) : "", X = V !== null && H !== null && f(V, H) > 0, Z = (e, t, n, r) => {
|
|
559
562
|
let i = e && t && f(e, t) <= 0 ? {
|
|
560
563
|
start: e,
|
|
561
564
|
end: t
|
|
562
565
|
} : null;
|
|
563
|
-
|
|
566
|
+
B({
|
|
564
567
|
start: e,
|
|
565
568
|
end: t,
|
|
566
569
|
source: i
|
|
567
|
-
}),
|
|
570
|
+
}), ve(i, {
|
|
568
571
|
reason: n,
|
|
569
572
|
event: r
|
|
570
573
|
});
|
|
571
|
-
},
|
|
574
|
+
}, xe = G, Q = {
|
|
572
575
|
locale: s,
|
|
573
576
|
min: c,
|
|
574
577
|
max: l,
|
|
@@ -579,8 +582,8 @@ function M(e, t) {
|
|
|
579
582
|
component: "datePicker.part",
|
|
580
583
|
px: 0,
|
|
581
584
|
py: 0,
|
|
582
|
-
tabIndex:
|
|
583
|
-
}, Se =
|
|
585
|
+
tabIndex: R
|
|
586
|
+
}, Se = fe && z && !d && !p && /* @__PURE__ */ O(n, {
|
|
584
587
|
tag: "button",
|
|
585
588
|
component: "datePicker.clear",
|
|
586
589
|
display: "inline-flex",
|
|
@@ -593,97 +596,97 @@ function M(e, t) {
|
|
|
593
596
|
zIndex: 1,
|
|
594
597
|
props: {
|
|
595
598
|
type: "button",
|
|
596
|
-
"aria-label":
|
|
597
|
-
tabIndex:
|
|
598
|
-
onClick: (e) =>
|
|
599
|
+
"aria-label": pe,
|
|
600
|
+
tabIndex: R,
|
|
601
|
+
onClick: (e) => Z(null, null, "clear", e)
|
|
599
602
|
},
|
|
600
|
-
children: /* @__PURE__ */
|
|
601
|
-
}), Ce =
|
|
603
|
+
children: /* @__PURE__ */ O(ae, {})
|
|
604
|
+
}), Ce = z !== null && (c != null && f(z.start, c) < 0 || l != null && f(z.end, l) > 0), we = I ? /* @__PURE__ */ O(le, {
|
|
602
605
|
frame: {
|
|
603
|
-
...
|
|
606
|
+
...ge,
|
|
604
607
|
props: he
|
|
605
608
|
},
|
|
606
|
-
attachField:
|
|
607
|
-
attachTrigger: p ? void 0 :
|
|
608
|
-
triggerAttributes: p ? void 0 :
|
|
609
|
-
triggerElement:
|
|
610
|
-
id:
|
|
609
|
+
attachField: q,
|
|
610
|
+
attachTrigger: p ? void 0 : U,
|
|
611
|
+
triggerAttributes: p ? void 0 : W,
|
|
612
|
+
triggerElement: be,
|
|
613
|
+
id: K,
|
|
611
614
|
label: b,
|
|
612
615
|
labelledBy: S,
|
|
613
616
|
describedBy: C,
|
|
614
|
-
text:
|
|
615
|
-
placeholder:
|
|
616
|
-
icon: /* @__PURE__ */
|
|
617
|
+
text: Y,
|
|
618
|
+
placeholder: L,
|
|
619
|
+
icon: /* @__PURE__ */ O(A, {}),
|
|
617
620
|
clear: Se,
|
|
618
621
|
disabled: d,
|
|
619
622
|
invalid: h ?? Ce,
|
|
620
623
|
required: m,
|
|
621
|
-
tabIndex:
|
|
624
|
+
tabIndex: R,
|
|
622
625
|
inputs: [{
|
|
623
626
|
name: g,
|
|
624
|
-
value:
|
|
627
|
+
value: z?.start ?? ""
|
|
625
628
|
}, {
|
|
626
629
|
name: y,
|
|
627
|
-
value:
|
|
630
|
+
value: z?.end ?? ""
|
|
628
631
|
}],
|
|
629
|
-
onReset: (e) =>
|
|
630
|
-
}) : /* @__PURE__ */
|
|
632
|
+
onReset: (e) => Z(i?.start ?? null, i?.end ?? null, "reset", e)
|
|
633
|
+
}) : /* @__PURE__ */ k(ie, { children: [b !== void 0 && /* @__PURE__ */ O(n, {
|
|
631
634
|
component: "dateField.label",
|
|
632
635
|
display: "block",
|
|
633
636
|
mb: 1.5,
|
|
634
637
|
fontSize: 14,
|
|
635
|
-
id: `${
|
|
638
|
+
id: `${K}-label`,
|
|
636
639
|
children: b
|
|
637
|
-
}), /* @__PURE__ */
|
|
638
|
-
ref:
|
|
640
|
+
}), /* @__PURE__ */ k(n, {
|
|
641
|
+
ref: q,
|
|
639
642
|
component: "dateField",
|
|
640
643
|
display: "inline-flex",
|
|
641
644
|
ai: "center",
|
|
642
645
|
gap: 2,
|
|
643
646
|
px: 3,
|
|
644
647
|
py: 2,
|
|
645
|
-
...
|
|
646
|
-
variant: [
|
|
648
|
+
...ge,
|
|
649
|
+
variant: [ge.variant, {
|
|
647
650
|
disabled: d,
|
|
648
|
-
invalid: h ??
|
|
651
|
+
invalid: h ?? X
|
|
649
652
|
}],
|
|
650
653
|
props: {
|
|
651
654
|
role: "group",
|
|
652
|
-
"aria-labelledby": [b === void 0 ? void 0 : `${
|
|
653
|
-
"aria-invalid": (h ??
|
|
655
|
+
"aria-labelledby": [b === void 0 ? void 0 : `${K}-label`, S].filter(Boolean).join(" ") || void 0,
|
|
656
|
+
"aria-invalid": (h ?? X) || void 0,
|
|
654
657
|
"aria-describedby": C,
|
|
655
658
|
...he
|
|
656
659
|
},
|
|
657
660
|
children: [
|
|
658
|
-
/* @__PURE__ */
|
|
659
|
-
...
|
|
660
|
-
value:
|
|
661
|
-
onValueChange: (e, t) =>
|
|
661
|
+
/* @__PURE__ */ O(te, {
|
|
662
|
+
...Q,
|
|
663
|
+
value: V,
|
|
664
|
+
onValueChange: (e, t) => Z(e, H, t.reason, t.event),
|
|
662
665
|
name: g,
|
|
663
|
-
props: { "aria-label":
|
|
664
|
-
invalid: h ??
|
|
666
|
+
props: { "aria-label": w },
|
|
667
|
+
invalid: h ?? X
|
|
665
668
|
}),
|
|
666
|
-
/* @__PURE__ */
|
|
669
|
+
/* @__PURE__ */ O(n, {
|
|
667
670
|
component: "dateField.literal",
|
|
668
671
|
props: { "aria-hidden": !0 },
|
|
669
672
|
children: "–"
|
|
670
673
|
}),
|
|
671
|
-
/* @__PURE__ */
|
|
672
|
-
...
|
|
673
|
-
value:
|
|
674
|
-
onValueChange: (e, t) =>
|
|
674
|
+
/* @__PURE__ */ O(te, {
|
|
675
|
+
...Q,
|
|
676
|
+
value: H,
|
|
677
|
+
onValueChange: (e, t) => Z(V, e, t.reason, t.event),
|
|
675
678
|
name: y,
|
|
676
|
-
props: { "aria-label":
|
|
677
|
-
invalid: h ??
|
|
679
|
+
props: { "aria-label": T },
|
|
680
|
+
invalid: h ?? X
|
|
678
681
|
}),
|
|
679
|
-
/* @__PURE__ */
|
|
682
|
+
/* @__PURE__ */ k(n, {
|
|
680
683
|
display: "inline-flex",
|
|
681
684
|
ai: "center",
|
|
682
685
|
gap: 2,
|
|
683
686
|
ms: "auto",
|
|
684
|
-
children: [Se, /* @__PURE__ */
|
|
687
|
+
children: [Se, /* @__PURE__ */ O(n, {
|
|
685
688
|
tag: "button",
|
|
686
|
-
ref:
|
|
689
|
+
ref: U,
|
|
687
690
|
component: "datePicker.trigger",
|
|
688
691
|
display: "inline-flex",
|
|
689
692
|
ai: "center",
|
|
@@ -695,42 +698,42 @@ function M(e, t) {
|
|
|
695
698
|
disabled: d || p,
|
|
696
699
|
props: {
|
|
697
700
|
type: "button",
|
|
698
|
-
"aria-label":
|
|
699
|
-
tabIndex:
|
|
700
|
-
...
|
|
701
|
+
"aria-label": Y ? `${L}, ${Y}` : L,
|
|
702
|
+
tabIndex: R,
|
|
703
|
+
...W
|
|
701
704
|
},
|
|
702
|
-
children: /* @__PURE__ */
|
|
705
|
+
children: /* @__PURE__ */ O(A, {})
|
|
703
706
|
})]
|
|
704
707
|
})
|
|
705
708
|
]
|
|
706
709
|
})] });
|
|
707
|
-
return /* @__PURE__ */
|
|
710
|
+
return /* @__PURE__ */ k(v, { children: [we, J(/* @__PURE__ */ k(n, {
|
|
708
711
|
display: "flex",
|
|
709
712
|
gap: 3,
|
|
710
713
|
ai: "stretch",
|
|
711
|
-
children: [
|
|
712
|
-
presets:
|
|
713
|
-
isSelected: (e) =>
|
|
714
|
+
children: [me && me.length > 0 && /* @__PURE__ */ O(ce, {
|
|
715
|
+
presets: me,
|
|
716
|
+
isSelected: (e) => z !== null && e.start === z.start && e.end === z.end,
|
|
714
717
|
onSelect: (e, t) => {
|
|
715
|
-
|
|
718
|
+
Z(e.start, e.end, "preset", t), j && xe(t);
|
|
716
719
|
}
|
|
717
|
-
}), /* @__PURE__ */
|
|
720
|
+
}), /* @__PURE__ */ O(x, {
|
|
718
721
|
mode: "range",
|
|
719
722
|
months: N,
|
|
720
|
-
value:
|
|
721
|
-
defaultFocusedDate:
|
|
723
|
+
value: z,
|
|
724
|
+
defaultFocusedDate: V ?? void 0,
|
|
722
725
|
onValueChange: (e, t) => {
|
|
723
|
-
|
|
726
|
+
Z(e?.start ?? null, e?.end ?? null, "select", t.event), j && e && t.event && xe(t.event);
|
|
724
727
|
},
|
|
725
728
|
min: c,
|
|
726
729
|
max: l,
|
|
727
730
|
isDateUnavailable: u,
|
|
728
731
|
locale: s,
|
|
729
|
-
firstDayOfWeek:
|
|
732
|
+
firstDayOfWeek: se,
|
|
730
733
|
weekNumbers: M
|
|
731
734
|
})]
|
|
732
735
|
}))] });
|
|
733
736
|
}
|
|
734
|
-
var
|
|
737
|
+
var P = e(M, "DatePicker"), F = e(N, "DateRangePicker");
|
|
735
738
|
//#endregion
|
|
736
|
-
export {
|
|
739
|
+
export { F as DateRangePicker, P as default };
|