@adyen/bento-vue3 1.86.0 → 1.86.1

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.
@@ -1,1100 +0,0 @@
1
- import { reactive as he, defineComponent as tt, useSlots as bt, ref as _, computed as p, onMounted as at, openBlock as E, createElementBlock as ge, createElementVNode as V, normalizeClass as Te, unref as D, renderSlot as $e, createCommentVNode as A, createBlock as K, createVNode as H, withCtx as G, createTextVNode as Z, toRaw as Ee, watch as be, toRef as Oe, withDirectives as ht, withKeys as Ye, toDisplayString as Rt, createSlots as kt } from "vue";
2
- import { j as It } from "./index.CbxHJr39.js";
3
- import { B as Mt } from "./divider.BIY84UH7.js";
4
- import { h as St, B as wt } from "./button-actions.BH-J7dux.js";
5
- import { B as Fe, d as je } from "./typography.B3J6_tYk.js";
6
- import { D as Ot } from "./dropdown-default-textbox.B-_dTUVX.js";
7
- import { g as se } from "./generate-uid.NJ8tVoha.js";
8
- import { u as _e } from "./index.B875RXHM.js";
9
- import { f as C, h as nt, i as x, j as Et, k as Le, l as Ft, s as Qe, m as _t, n as oe, o as We, b as W, u as At, p as B, e as F, g as Ct } from "./calendar.DzeJoNc2.js";
10
- import { t as P, c as Bt, n as qt } from "./getTimezoneOffsetInMilliseconds.Tu2wlbTR.js";
11
- import { u as Ut } from "./use-form-layout-loading.CWbjZiwP.js";
12
- import { f as Ge, v as Nt, u as xt } from "./date-input.XSJuuCHe.js";
13
- import { B as $t } from "./directive.rXUeDb8p.js";
14
- import { u as Yt } from "./form-field.D_2g7vaP.js";
15
- import { B as ve } from "./input-field.CNdqlGw6.js";
16
- import { B as jt } from "./dropdown.CU6nfq3V.js";
17
- import { B as Lt } from "./segmented-control.D9rHBysM.js";
18
- import { d as pe } from "./debounce.DUTu11PS.js";
19
- import { u as Qt } from "./use-has-slot.B7eQSabc.js";
20
- import { e as $, a as Ke } from "./differenceInMonths.BR4Z2HIa.js";
21
- import { s as He } from "./startOfWeek.D8Yh4c0G.js";
22
- import { c as Wt } from "./constructNow.B8T1ljs6.js";
23
- import { _ as rt } from "./_plugin-vue_export-helper.CHgC5LLL.js";
24
- import { F as Gt, E as Pe } from "./error-message.BYA2_fPV.js";
25
- import { B as Kt } from "./button-actions.types.BptAXjD8.js";
26
- import "../assets/date-range-picker.css";
27
- function le(a) {
28
- if (a == null)
29
- return C(/* @__PURE__ */ new Date());
30
- const [l, u, r] = a.split("-").map((e) => parseInt(e, 10));
31
- return new Date(l, u - 1, r);
32
- }
33
- function st(a, l, u) {
34
- return nt(a, l * 3, u);
35
- }
36
- function Ht(a, l, u) {
37
- return st(a, -1, u);
38
- }
39
- const Pt = ({
40
- firstDayOfWeek: a,
41
- min: l,
42
- max: u
43
- }) => ({ getGranularCalendarLimits: (e) => {
44
- if (!l && !u)
45
- return { min: null, max: null };
46
- let d = l ? C(l) : null, f = u ? $(u) : null;
47
- if ((e == null ? void 0 : e.type) === "weekly") {
48
- if (e.earliest)
49
- d = C(e.earliest);
50
- else if (d) {
51
- const y = He(d, { weekStartsOn: a });
52
- x(d, y) || (d = C(Et(Le(d, { weekStartsOn: a }), 1)));
53
- }
54
- if (e.latest)
55
- f = $(e.latest);
56
- else if (f) {
57
- const y = Le(f, { weekStartsOn: a });
58
- x(f, y) || (f = $(Ft(He(f, { weekStartsOn: a }), 1)));
59
- }
60
- }
61
- if ((e == null ? void 0 : e.type) === "monthly") {
62
- if (e.earliest)
63
- d = C(e.earliest);
64
- else if (d) {
65
- const y = Qe(d);
66
- x(d, y) || (d = Qe(nt(d, 1)));
67
- }
68
- if (e.latest)
69
- f = $(e.latest);
70
- else if (f) {
71
- const y = Ke(f);
72
- x(f, y) || (f = Ke(_t(f, 1)));
73
- }
74
- }
75
- if ((e == null ? void 0 : e.type) === "quarterly") {
76
- if (e.earliest)
77
- d = oe(e.earliest);
78
- else if (d) {
79
- const y = oe(d);
80
- x(d, y) || (d = oe(st(d, 1)));
81
- }
82
- if (e.latest)
83
- f = $(e.latest);
84
- else if (f) {
85
- const y = We(f);
86
- x(f, y) || (f = We(Ht(f)));
87
- }
88
- }
89
- return { min: d, max: f };
90
- } }), Vt = () => {
91
- const a = he({
92
- daily: null,
93
- weekly: null,
94
- monthly: null,
95
- quarterly: null
96
- });
97
- return {
98
- savedRanges: a,
99
- saveRange: (r, e) => {
100
- a[r] = e;
101
- },
102
- resetSavedRanges: () => {
103
- a.daily = null, a.weekly = null, a.monthly = null, a.quarterly = null;
104
- }
105
- };
106
- };
107
- var v = /* @__PURE__ */ ((a) => (a.CUSTOM_RANGE = "custom-range", a.INPUT = "input", a.ERROR = "error", a.FORM_DATE = "form-date", a.START_DATE_SELECTED = "start-date-selected", a))(v || {});
108
- function zt(a, l, u) {
109
- const r = P(a, u == null ? void 0 : u.in);
110
- return r.setHours(l), r;
111
- }
112
- function Jt(a, l, u) {
113
- const r = P(a, u == null ? void 0 : u.in);
114
- return r.setMinutes(l), r;
115
- }
116
- function Xt(a, l, u) {
117
- const r = P(a, u == null ? void 0 : u.in);
118
- return r.setSeconds(l), r;
119
- }
120
- function Ve(a, l) {
121
- const u = P(a, l == null ? void 0 : l.in);
122
- return u.setMilliseconds(0), u;
123
- }
124
- function ze(a, l) {
125
- return +Ve(a) == +Ve(l);
126
- }
127
- function ye(a, l) {
128
- return +P(a) == +P(l);
129
- }
130
- function Zt(a, l) {
131
- return x(
132
- Bt(a, a),
133
- Wt(a)
134
- );
135
- }
136
- function Je(a, l, u) {
137
- const r = P(a, u == null ? void 0 : u.in);
138
- return r.setMilliseconds(l), r;
139
- }
140
- const ea = /[\d]/, ta = /^\d{2}$/, aa = /^\d{2}:\d{2}$/, na = (a) => {
141
- const { selectionStart: l } = a.target, u = ["Backspace", "Tab", "ArrowLeft", "ArrowRight"], r = ea.test(a.key) || u.includes(a.key), e = [1, 2, 4, 5].includes(l) && a.key === ":";
142
- !r && !e && a.preventDefault();
143
- }, Xe = (a) => {
144
- if (!a)
145
- return a;
146
- let l = a;
147
- if (l.length === 1 && parseInt(a, 10) > 2)
148
- return `0${l}:`;
149
- const [u, r] = l.slice(-2);
150
- return [2, 5].includes(l.length) && r === ":" && (l = `${l.slice(0, l.length - 2)}0${u}`), (ta.test(l) || aa.test(l)) && (l += ":"), l;
151
- }, lt = {
152
- "en-US": {
153
- customRange: "Custom range",
154
- daily: "Daily",
155
- dateFrom: "Date from",
156
- dateTo: "Date to",
157
- lastMonth: "Last month",
158
- lastSevenDays: "Last 7 days",
159
- lastThreeMonths: "Last three months",
160
- monthly: "Monthly",
161
- quarterly: "Quarterly",
162
- timeFrom: "Time from",
163
- timeTo: "Time to",
164
- weekly: "Weekly"
165
- },
166
- "ja-JP": {
167
- customRange: "カスタム範囲",
168
- daily: "毎日",
169
- dateFrom: "開始日",
170
- dateTo: "日付まで",
171
- lastMonth: "先月",
172
- lastSevenDays: "過去7日間",
173
- lastThreeMonths: "過去3か月",
174
- monthly: "毎月",
175
- quarterly: "毎四半期",
176
- timeFrom: "開始時刻",
177
- timeTo: "終了時刻",
178
- weekly: "毎週"
179
- },
180
- "pt-BR": {
181
- customRange: "Intervalo personalizado",
182
- daily: "Diária",
183
- dateFrom: "Data a partir de",
184
- dateTo: "Data até",
185
- lastMonth: "Último mês",
186
- lastSevenDays: "Últimos 7 dias",
187
- lastThreeMonths: "Últimos 3 meses",
188
- monthly: "Mensal",
189
- quarterly: "Trimestral",
190
- timeFrom: "Horário a partir de",
191
- timeTo: "Hora de",
192
- weekly: "Semanal"
193
- }
194
- }, ra = { class: "b-date-range-picker-calendar" }, sa = { class: "b-date-range-picker-calendar__form" }, la = { key: 0 }, oa = {
195
- key: 0,
196
- class: "b-date-range-picker-calendar__calendars-container",
197
- "data-testid": "date-range-picker-calendar-calendar-container"
198
- }, ia = {
199
- name: "date-range-picker-calendar",
200
- i18n: { messages: lt }
201
- }, ua = /* @__PURE__ */ tt({
202
- ...ia,
203
- props: {
204
- /**
205
- * Allows user to enter time values in the form
206
- */
207
- allowTimeInput: { type: Boolean, default: !1 },
208
- /**
209
- * Ranges form persistance data
210
- */
211
- dateFormData: {
212
- type: Object,
213
- default: () => ({ startDate: void 0, endDate: void 0, startTime: void 0, endTime: void 0 })
214
- },
215
- /**
216
- * Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday
217
- */
218
- firstDayOfWeek: W.props.firstDayOfWeek,
219
- /**
220
- * A list of available granularities.
221
- * If present, the date picker will display a segmented control to change granularity.
222
- */
223
- granularities: {
224
- type: Array,
225
- default: null
226
- },
227
- /**
228
- * Indicate if a date should be disabled or not
229
- */
230
- isDateDisabled: W.props.isDateDisabled,
231
- /**
232
- * Set a maximum number of dates to be selectable by the range.
233
- */
234
- maxRange: W.props.maxRange,
235
- /**
236
- * Sets a minimum limit for selectable dates - dates before `min` will not be selectable
237
- */
238
- min: W.props.min,
239
- /**
240
- * Sets a maximum limit for selectable dates - dates after `max` will not be selectable
241
- */
242
- max: W.props.max,
243
- /**
244
- * Number of months rendered on pane
245
- */
246
- numberOfMonths: {
247
- type: W.props.numberOfMonths.type,
248
- default: W.props.numberOfMonths.default,
249
- validator: (a) => a >= 0
250
- },
251
- /**
252
- * Displays the end date's month when the calendar is opened. Defaults to false i.e. the start date's month is displayed.
253
- */
254
- showEndDateOnOpen: { type: Boolean, default: !1 },
255
- /**
256
- * Enables the custom range selector.
257
- * If provided, must be an array that sets the custom range dropdown items. Items are of the structure:
258
- * `label` - label of custom range item.
259
- * `value` - a unique key of the custom range item.
260
- * `data` - an object `{ startDate: Date; endDate: Date }` to set the date picker range to upon selecting.
261
- */
262
- quickSelectRanges: {
263
- type: Array,
264
- default: void 0
265
- },
266
- /**
267
- * Selected date
268
- */
269
- value: { type: Object, default: void 0 },
270
- /**
271
- * The type of calendar to display. Defaults to showing days.
272
- */
273
- variant: W.props.variant
274
- },
275
- emits: [
276
- v.CUSTOM_RANGE,
277
- v.INPUT,
278
- v.ERROR,
279
- v.FORM_DATE,
280
- v.START_DATE_SELECTED
281
- ],
282
- setup(a, { emit: l }) {
283
- var qe, Ue, Ne, xe;
284
- const r = "customRange", e = a, d = l, f = bt(), y = Qt(f), { t: w } = _e({ messages: lt }), I = _({}), te = p(() => e.variant === "month" ? "monthly" : "daily"), ae = p(() => e.numberOfMonths === 0), n = he({
285
- startDate: (qe = e.value) == null ? void 0 : qe.startDate,
286
- endDate: (Ue = e.value) == null ? void 0 : Ue.endDate,
287
- range: (Ne = e.value) == null ? void 0 : Ne.range,
288
- ...e.granularities ? {
289
- granularity: ((xe = e.value) == null ? void 0 : xe.granularity) || te.value
290
- } : {}
291
- });
292
- function b(t) {
293
- return t ? new Date(
294
- t.getUTCFullYear(),
295
- t.getUTCMonth(),
296
- t.getUTCDate(),
297
- t.getUTCHours(),
298
- t.getUTCMinutes(),
299
- t.getUTCSeconds()
300
- ) : null;
301
- }
302
- const h = p(() => {
303
- var t, s;
304
- return (
305
- // eslint-disable-next-line consistent-return
306
- ((s = (t = e == null ? void 0 : e.quickSelectRanges) == null ? void 0 : t.find(({ value: c, data: m }) => {
307
- var M;
308
- if (!m.endDate) {
309
- if (m.isRelativeToNow) {
310
- const O = (M = I.value) == null ? void 0 : M[c];
311
- return O ? ye(
312
- b(O.startDate),
313
- b(n.startDate)
314
- ) && ye(
315
- b(O.endDate),
316
- b(n.endDate)
317
- ) : (
318
- // If not stored calculated dates, fall back to comparing the quick select item's value
319
- // with the internal range's stored range identifier.
320
- c === n.range
321
- );
322
- }
323
- return ye(b(m.startDate), b(n.startDate)) && ye(
324
- b(n.endDate),
325
- b($(n.endDate))
326
- ) && Zt(b(n.endDate)) && (e.granularities ? m.granularity === n.granularity : !0);
327
- }
328
- if (e.allowTimeInput)
329
- return ze(b(m.startDate), b(n.startDate)) && ze(b(m.endDate), b(n.endDate)) && (e.granularities ? m.granularity === n.granularity : !0);
330
- if (m.endDate)
331
- return x(m.startDate, n.startDate) && x(m.endDate, n.endDate) && (e.granularities ? m.granularity === n.granularity : !0);
332
- })) == null ? void 0 : s.value) ?? r
333
- );
334
- }), g = p(() => ({
335
- "b-date-range-picker-calendar__form-input-wrapper": e.allowTimeInput
336
- })), q = p(() => [
337
- { label: w("customRange"), value: r },
338
- ...e.quickSelectRanges ? e.quickSelectRanges : []
339
- ]), R = p(
340
- () => {
341
- var t;
342
- return ((t = e.granularities) == null ? void 0 : t.find(({ type: s }) => s === n.granularity)) || null;
343
- }
344
- ), Re = p(
345
- () => {
346
- var t;
347
- return ((t = e.granularities) == null ? void 0 : t.map(({ type: s, disabled: c }) => ({
348
- label: w(s),
349
- value: s,
350
- disabled: c
351
- }))) ?? [];
352
- }
353
- ), { getGranularCalendarLimits: ie } = Pt(e), T = p(
354
- () => e.granularities ? ie(R.value) : { min: e.min ? C(e.min) : null, max: e.max ? $(e.max) : null }
355
- ), {
356
- adjustDateForQuarterly: ne,
357
- adjustDateForMonthly: ke,
358
- adjustDateForWeekly: Ie,
359
- adjustStartDateInputForWeekly: ue,
360
- adjustEndDateInputForWeekly: re,
361
- adjustStartDateInputForMonthly: k,
362
- adjustEndDateInputForMonthly: Me,
363
- adjustStartDateInputForQuarterly: z,
364
- adjustEndDateInputForQuarterly: Se
365
- } = At(e.firstDayOfWeek), { savedRanges: Y, saveRange: de, resetSavedRanges: j } = Vt(), U = (t) => t ? F(t) : "", J = _(!1), X = _(!1), L = _(!1), Q = _(!1), i = he({
366
- startDate: e.dateFormData.startDate,
367
- endDate: e.dateFormData.endDate,
368
- startTime: e.dateFormData.startTime,
369
- endTime: e.dateFormData.endTime
370
- }), me = (t, s) => {
371
- let c = new Date(t);
372
- const [m, M, O] = s.split(":");
373
- return c = zt(c, parseInt(m, 10)), c = Jt(c, parseInt(M, 10)), c = Xt(c, parseInt(O, 10)), c;
374
- }, ce = (t) => /^(?:[01]\d|2[01234]):(?:[012345]\d):(?:[012345]\d)$/.test(t), ee = (t, s) => {
375
- const c = () => {
376
- if (s && S(s)) {
377
- const m = me(new Date(s), t);
378
- if (e.min && m < Je(e.min, 0) || e.max && m > Je(e.max, 0))
379
- return !1;
380
- }
381
- return !0;
382
- };
383
- return ce(t) && c();
384
- }, N = (t, s) => !s || !ce(s) || e.variant === "month" ? t : me(new Date(t), s), o = (t) => {
385
- i.startTime = B(
386
- e.min && e.allowTimeInput && x(e.min, t.startDate) ? e.min : C(t.startDate)
387
- ), i.endTime = B(
388
- e.max && e.allowTimeInput && x(e.max, t.endDate) ? e.max : $(t.endDate)
389
- ), n.startDate = N(t.startDate, i.startTime), n.endDate = N(t.endDate, i.endTime), n.range = null, e.granularities && j(), d(v.INPUT, {
390
- ...n,
391
- range: h.value
392
- });
393
- }, S = (t) => {
394
- if (!t)
395
- return !1;
396
- const s = (m) => e.min && C(m) < C(e.min) || e.max && C(m) > C(e.max) ? !1 : e.isDateDisabled ? !e.isDateDisabled(C(m)) : !0;
397
- return /^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(t) && s(new Date(t));
398
- };
399
- at(() => {
400
- J.value = !!(e.dateFormData.startDate && !S(e.dateFormData.startDate)), e.allowTimeInput ? L.value = !!(e.dateFormData.startTime && !ee(e.dateFormData.startTime, e.dateFormData.startDate)) : L.value = !1, X.value = !!(e.dateFormData.endDate && !S(e.dateFormData.endDate)), e.allowTimeInput ? Q.value = !!(e.dateFormData.endTime && !ee(e.dateFormData.endTime, e.dateFormData.endDate)) : Q.value = !1;
401
- });
402
- const De = (t) => {
403
- var s;
404
- i.startDate = F(t), i.startTime ? L.value && (i.startTime = (s = e.dateFormData) == null ? void 0 : s.startTime) : i.startTime = B(t), J.value = !1, L.value = !1, d(v.START_DATE_SELECTED, t);
405
- }, ot = (t) => {
406
- var s;
407
- i.endDate = F(t), i.endTime ? Q.value && (i.endTime = (s = e.dateFormData) == null ? void 0 : s.endTime) : i.endTime = B($(t)), X.value = !1, Q.value = !1;
408
- }, we = (t) => {
409
- const s = e.value[t];
410
- if (s)
411
- return s;
412
- if (e.dateFormData[t] && S(e.dateFormData[t]))
413
- return new Date(e.dateFormData[t]);
414
- }, it = pe((t) => {
415
- var s;
416
- if (S(t)) {
417
- let c = t;
418
- switch (J.value = !1, (s = R.value) == null ? void 0 : s.type) {
419
- case "weekly":
420
- c = ue(
421
- t,
422
- U,
423
- T.value.min,
424
- T.value.max
425
- ), i.startDate = c;
426
- break;
427
- case "monthly":
428
- c = k(
429
- t,
430
- U,
431
- T.value.min,
432
- T.value.max
433
- ), i.startDate = c;
434
- break;
435
- case "quarterly":
436
- c = z(
437
- t,
438
- U,
439
- T.value.min,
440
- T.value.max
441
- ), i.startDate = c;
442
- break;
443
- }
444
- const m = le(c);
445
- n.startDate = N(m, i.startTime), n.endDate = N(
446
- le(i.endDate),
447
- i.endTime
448
- ), S(i.endDate) && (n.endDate = N(
449
- le(i.endDate),
450
- i.endTime
451
- ));
452
- const M = we("endDate");
453
- n.range = null, d(v.FORM_DATE, {
454
- startDate: m,
455
- endDate: M
456
- }), d(v.INPUT, {
457
- ...n,
458
- range: h.value
459
- });
460
- } else
461
- J.value = !0, d(v.ERROR, { ...i });
462
- }, 300), ut = (t) => {
463
- i.startDate = Ge(t), it(i.startDate);
464
- }, dt = pe((t) => {
465
- var s;
466
- if (S(t)) {
467
- let c = t;
468
- switch (X.value = !1, (s = R.value) == null ? void 0 : s.type) {
469
- case "weekly":
470
- c = re(
471
- t,
472
- U,
473
- T.value.min,
474
- T.value.max
475
- ), i.endDate = c;
476
- break;
477
- case "monthly":
478
- c = Me(
479
- t,
480
- U,
481
- T.value.min,
482
- T.value.max
483
- ), i.endDate = c;
484
- break;
485
- case "quarterly":
486
- c = Se(
487
- t,
488
- U,
489
- T.value.min,
490
- T.value.max
491
- ), i.endDate = c;
492
- break;
493
- }
494
- const m = le(c);
495
- n.endDate = N(m, i.endTime), S(i.startDate) && (n.startDate = N(
496
- le(i.startDate),
497
- i.startTime
498
- ));
499
- const M = we("startDate");
500
- n.range = null, d(v.FORM_DATE, {
501
- startDate: M,
502
- endDate: m
503
- }), d(v.INPUT, {
504
- ...n,
505
- range: h.value
506
- });
507
- } else
508
- X.value = !0, d(v.ERROR, { ...i });
509
- }, 300), mt = (t) => {
510
- i.endDate = Ge(t), dt(i.endDate);
511
- }, Ce = (t) => {
512
- Nt(t);
513
- }, ct = pe((t) => {
514
- if (ee(t, e.dateFormData.startDate)) {
515
- L.value = !1, n.startDate = N(n.startDate, t);
516
- const s = we("endDate");
517
- d(v.FORM_DATE, {
518
- startDate: n.startDate,
519
- endDate: s,
520
- startTime: t,
521
- endTime: i.endTime ?? e.dateFormData.endTime
522
- }), d(v.INPUT, {
523
- ...n,
524
- range: h.value
525
- });
526
- } else
527
- L.value = !0, d(v.ERROR, { ...i });
528
- }), Dt = pe((t) => {
529
- ee(t, e.dateFormData.endDate) ? (Q.value = !1, n.endDate = N(n.endDate, t), d(v.FORM_DATE, {
530
- startDate: n.startDate,
531
- endDate: n.endDate,
532
- startTime: i.startTime ?? e.dateFormData.startTime,
533
- endTime: t
534
- }), d(v.INPUT, {
535
- ...n,
536
- range: h.value
537
- })) : (Q.value = !0, d(v.ERROR, { ...i }));
538
- }), ft = (t) => {
539
- i.startTime = Xe(t), ct(i.startTime);
540
- }, vt = (t) => {
541
- i.endTime = Xe(t), Dt(i.endTime);
542
- }, Be = (t) => {
543
- na(t);
544
- }, fe = (t, s, c, m) => {
545
- n.startDate = t, n.endDate = s, c && (n.granularity = c), m && (n.range = m);
546
- }, pt = (t) => {
547
- var c;
548
- const s = (c = e.quickSelectRanges) == null ? void 0 : c.find(({ value: m }) => m === t);
549
- if (s) {
550
- j();
551
- const m = s.data, M = m.endDate || (m.isRelativeToNow ? new Date(Date.now()) : $(new Date(Date.now()))), O = m.isRelativeToNow && m.timeDifference ? new Date(M.getTime() - m.timeDifference) : m.startDate;
552
- i.endDate = F(M), i.startDate = F(O), fe(O, M, null, t), e.granularities && (n.granularity = m.granularity || te.value), i.startTime = B(O), i.endTime = B(M), n.startDate = O, n.endDate = M, m.isRelativeToNow && (I.value = {
553
- ...I.value,
554
- [t]: {
555
- startDate: O,
556
- endDate: M
557
- }
558
- }), d(v.CUSTOM_RANGE, {
559
- ...s.data,
560
- startDate: O,
561
- endDate: M,
562
- range: s.value
563
- });
564
- }
565
- }, yt = {
566
- weekly: Ie,
567
- monthly: ke,
568
- quarterly: ne
569
- }, gt = (t) => {
570
- const s = n.granularity;
571
- if (n.granularity = t, s && de(s, structuredClone(Ee(n))), n.startDate && n.endDate) {
572
- switch (t) {
573
- case "quarterly":
574
- case "monthly":
575
- case "weekly": {
576
- if (Y[t]) {
577
- fe(Y[t].startDate, Y[t].endDate, t);
578
- break;
579
- }
580
- const { startDate: c, endDate: m } = yt[t](
581
- n.startDate,
582
- n.endDate,
583
- T.value.min,
584
- T.value.max
585
- );
586
- fe(c, m, t);
587
- break;
588
- }
589
- case "daily":
590
- Y.daily && fe(Y.daily.startDate, Y.daily.endDate, t);
591
- break;
592
- }
593
- i.startDate = F(n.startDate), i.endDate = F(n.endDate), d(v.INPUT, {
594
- ...n,
595
- range: h.value
596
- });
597
- }
598
- }, Tt = p(() => ({
599
- "b-date-range-picker-calendar__form-container--no-calendars": ae.value
600
- }));
601
- return (t, s) => (E(), ge("div", ra, [
602
- V("div", {
603
- class: Te(["b-date-range-picker-calendar__form-container", Tt.value]),
604
- "data-testid": "date-range-picker-calendar-form-container"
605
- }, [
606
- V("div", sa, [
607
- D(y)("title") ? $e(t.$slots, "title", { key: 0 }, void 0, !0) : A("", !0),
608
- a.quickSelectRanges ? (E(), K(jt, {
609
- key: 1,
610
- "aria-label": D(w)("customRange"),
611
- items: q.value,
612
- "model-value": h.value,
613
- "onUpdate:modelValue": pt
614
- }, null, 8, ["aria-label", "items", "model-value"])) : A("", !0),
615
- a.granularities ? (E(), K(D(Lt), {
616
- key: 2,
617
- items: Re.value,
618
- "model-value": n.granularity,
619
- "full-width": "",
620
- "onUpdate:modelValue": gt
621
- }, null, 8, ["items", "model-value"])) : A("", !0),
622
- V("div", null, [
623
- H(D(Fe), {
624
- stronger: "",
625
- el: "span",
626
- class: "b-date-range-picker-calendar__label"
627
- }, {
628
- default: G(() => s[0] || (s[0] = [
629
- Z(" From ")
630
- ])),
631
- _: 1
632
- }),
633
- V("div", {
634
- class: Te(g.value)
635
- }, [
636
- H(D(ve), {
637
- "aria-label": D(w)("dateFrom"),
638
- "model-value": i.startDate,
639
- error: J.value,
640
- class: "b-date-range-picker-calendar__form-input",
641
- "onUpdate:modelValue": ut,
642
- onKeydown: Ce
643
- }, {
644
- description: G(() => s[1] || (s[1] = [
645
- Z("YYYY-MM-DD")
646
- ])),
647
- _: 1
648
- }, 8, ["aria-label", "model-value", "error"]),
649
- a.allowTimeInput ? (E(), K(D(ve), {
650
- key: 0,
651
- "aria-label": D(w)("timeFrom"),
652
- "model-value": i.startTime,
653
- error: L.value,
654
- class: "b-date-range-picker-calendar__form-input",
655
- "onUpdate:modelValue": ft,
656
- onKeydown: Be
657
- }, {
658
- description: G(() => s[2] || (s[2] = [
659
- Z("HH:MM:SS")
660
- ])),
661
- _: 1
662
- }, 8, ["aria-label", "model-value", "error"])) : A("", !0)
663
- ], 2)
664
- ]),
665
- V("div", null, [
666
- H(D(Fe), {
667
- stronger: "",
668
- el: "span",
669
- class: "b-date-range-picker-calendar__label"
670
- }, {
671
- default: G(() => s[3] || (s[3] = [
672
- Z(" To ")
673
- ])),
674
- _: 1
675
- }),
676
- V("div", {
677
- class: Te(g.value)
678
- }, [
679
- H(D(ve), {
680
- class: "b-date-range-picker-calendar__form-input",
681
- "aria-label": D(w)("dateTo"),
682
- "model-value": i.endDate,
683
- error: X.value,
684
- "onUpdate:modelValue": mt,
685
- onKeydown: Ce
686
- }, {
687
- description: G(() => s[4] || (s[4] = [
688
- Z("YYYY-MM-DD")
689
- ])),
690
- _: 1
691
- }, 8, ["aria-label", "model-value", "error"]),
692
- a.allowTimeInput ? (E(), K(D(ve), {
693
- key: 0,
694
- "aria-label": D(w)("timeTo"),
695
- "model-value": i.endTime,
696
- error: Q.value,
697
- class: "b-date-range-picker-calendar__form-input",
698
- "onUpdate:modelValue": vt,
699
- onKeydown: Be
700
- }, {
701
- description: G(() => s[5] || (s[5] = [
702
- Z("HH:MM:SS")
703
- ])),
704
- _: 1
705
- }, 8, ["aria-label", "model-value", "error"])) : A("", !0)
706
- ], 2)
707
- ])
708
- ]),
709
- D(y)("actions") ? (E(), ge("div", la, [
710
- $e(t.$slots, "actions", {}, void 0, !0)
711
- ])) : A("", !0)
712
- ], 2),
713
- ae.value ? A("", !0) : (E(), ge("div", oa, [
714
- H(D(W), {
715
- value: n,
716
- "first-day-of-week": a.firstDayOfWeek,
717
- "is-date-disabled": a.isDateDisabled,
718
- "max-range": a.maxRange,
719
- min: T.value.min,
720
- max: T.value.max,
721
- "number-of-months": a.numberOfMonths,
722
- "show-end-date-on-open": a.showEndDateOnOpen,
723
- granularity: R.value,
724
- variant: a.variant,
725
- "is-range": "",
726
- onInput: o,
727
- onStartDateSelected: De,
728
- onEndDateSelected: ot
729
- }, null, 8, ["value", "first-day-of-week", "is-date-disabled", "max-range", "min", "max", "number-of-months", "show-end-date-on-open", "granularity", "variant"])
730
- ]))
731
- ]));
732
- }
733
- }), da = /* @__PURE__ */ rt(ua, [["__scopeId", "data-v-b404d391"]]);
734
- function Ze(a, l) {
735
- const u = P(a, l == null ? void 0 : l.in);
736
- return Math.trunc(u.getMonth() / 3) + 1;
737
- }
738
- function et(a, l) {
739
- return P(a, l == null ? void 0 : l.in).getFullYear();
740
- }
741
- function ma(a, l, u) {
742
- const [r, e] = qt(
743
- u == null ? void 0 : u.in,
744
- a,
745
- l
746
- );
747
- return +oe(r) == +oe(e);
748
- }
749
- const Ae = {
750
- "en-US": {
751
- apply: "Apply",
752
- cancel: "Cancel",
753
- dateRangePicker: "Date range picker {name}",
754
- provideDateInAFormat: "Provide date in a YYYY-MM-DD format",
755
- quarter: "Q{quarter} {year}",
756
- selectDate: "Select a date",
757
- selectDateRange: "Select a date range",
758
- selectedDateIsNotAvailable: "Selected date is not available"
759
- },
760
- "ja-JP": {
761
- apply: "適用",
762
- cancel: "キャンセル",
763
- dateRangePicker: "日付範囲ピッカー {name}",
764
- provideDateInAFormat: "YYYY-MM-DD形式で日付を入力してください",
765
- quarter: "{year}年第{quarter}四半期",
766
- selectDate: "日付を選択",
767
- selectDateRange: "日付範囲を選択",
768
- selectedDateIsNotAvailable: "選択した日付は利用できません"
769
- },
770
- "pt-BR": {
771
- apply: "Aplicar",
772
- cancel: "Cancelar",
773
- dateRangePicker: "Seletor de intervalo de datas {name}",
774
- provideDateInAFormat: "Forneça a data no formato AAAA-MM-DD",
775
- quarter: "{quarter}º trimestre de {year}",
776
- selectDate: "Selecione uma data",
777
- selectDateRange: "Selecione um intervalo de datas",
778
- selectedDateIsNotAvailable: "A data selecionada não está disponível"
779
- }
780
- }, ca = ({
781
- datePickerValue: a,
782
- isDateIncorrect: l,
783
- quickSelectRanges: u,
784
- isMonthVariant: r,
785
- withTimeInput: e,
786
- placeholder: d
787
- }) => {
788
- const { locale: f, t: y } = _e({ messages: Ae }), w = (n) => !!n && !isNaN(n.getTime()), I = he({
789
- startDate: null,
790
- endDate: null,
791
- startTime: null,
792
- endTime: null
793
- });
794
- return be(
795
- a,
796
- (n) => {
797
- I.startDate = F(n == null ? void 0 : n.startDate), I.endDate = F(n == null ? void 0 : n.endDate), I.startTime = B(n == null ? void 0 : n.startDate), I.endTime = B(n == null ? void 0 : n.endDate);
798
- },
799
- { immediate: !0 }
800
- ), {
801
- // Values
802
- dateDisplayValue: p(() => {
803
- var b;
804
- if (l.value)
805
- return `${I.startDate || ""} - ${I.endDate || ""}`;
806
- if (!a.value || !a.value.startDate && !a.value.endDate)
807
- return (d == null ? void 0 : d.value) || y("selectDateRange");
808
- if ((b = u.value) != null && b.length) {
809
- const h = u.value.find(({ value: g }) => {
810
- var q;
811
- return g === ((q = a.value) == null ? void 0 : q.range);
812
- });
813
- if (h)
814
- return h.label;
815
- }
816
- if (a.value.granularity === "quarterly") {
817
- const { startDate: h, endDate: g } = a.value, q = y("quarter", { quarter: Ze(h), year: et(h) });
818
- if (ma(h, g))
819
- return q;
820
- const R = y("quarter", { quarter: Ze(g), year: et(g) });
821
- return `${q} - ${R}`;
822
- }
823
- if (!w(a.value.startDate) || !w(a.value.endDate))
824
- return `${I.startDate || ""} - ${I.endDate || ""}`;
825
- let n = r != null && r.value ? { month: "long", year: "numeric" } : { month: "short", day: "2-digit", year: "numeric" };
826
- return e.value && (n = {
827
- ...n,
828
- hour: "numeric",
829
- minute: "numeric",
830
- second: "numeric",
831
- hour12: !1
832
- }), Ct(f.value, n).formatRange(
833
- a.value.startDate,
834
- a.value.endDate
835
- );
836
- }),
837
- textInputDisplayValue: I,
838
- // Methods
839
- formatTextInputDisplayValue: () => ""
840
- };
841
- }, Da = { class: "b-date-range-picker" }, fa = { class: "b-date-range-picker__footer" }, va = {
842
- i18n: { messages: Ae },
843
- name: "bento-date-range-picker",
844
- model: { prop: "modelValue" }
845
- }, pa = /* @__PURE__ */ tt({
846
- ...va,
847
- props: {
848
- allowTimeInput: { type: Boolean },
849
- firstDayOfWeek: { default: void 0 },
850
- granularities: {},
851
- isDateDisabled: { type: Function, default: void 0 },
852
- showEndDateOnOpen: { type: Boolean, default: !1 },
853
- quickSelectRanges: { default: void 0 },
854
- maxRange: { default: null },
855
- min: { default: null },
856
- max: { default: null },
857
- numberOfMonths: { default: void 0 },
858
- modelValue: { default: null },
859
- value: { default: null },
860
- variant: { default: void 0 },
861
- hasActions: { type: Boolean, default: !1 },
862
- description: { default: void 0 },
863
- disabled: { type: Boolean, default: !1 },
864
- errorMessage: { default: null },
865
- label: { default: void 0 },
866
- optional: { type: Boolean, default: !1 },
867
- placeholder: { default: null },
868
- readonly: { type: Boolean, default: !1 },
869
- required: { type: Boolean, default: !1 },
870
- tooltipText: { default: null }
871
- },
872
- emits: ["update:model-value", "input"],
873
- setup(a, { emit: l }) {
874
- const u = l, r = a, { t: e } = _e({ messages: Ae }), d = se("bento-date-range-picker-container"), f = se("bento-date-range-picker-label"), y = se("bento-date-range-picker-description"), w = se("bento-date-range-picker-error"), I = se("bento-date-range-picker-date-error"), te = p(() => r.label || e("dateRangePicker", { name: d })), { resolvedFirstDayOfWeek: ae } = xt(Oe(r, "firstDayOfWeek")), n = It({
875
- none: 0,
876
- one: 710,
877
- // width of date range picker with one panes
878
- two: 1030,
879
- // width of date range picker with two panes
880
- three: 1290
881
- // width of date range picker with three panes
882
- }), b = p(() => {
883
- const o = n.active().value, S = {
884
- none: 0,
885
- one: 1,
886
- two: 2
887
- };
888
- if (o in S) {
889
- const De = S[o];
890
- return r.numberOfMonths === void 0 ? De : Math.min(r.numberOfMonths, De);
891
- }
892
- return r.numberOfMonths;
893
- }), h = p(() => (r == null ? void 0 : r.quickSelectRanges) && r.quickSelectRanges.map((o) => {
894
- const S = o.data.endDate ? void 0 : new Date(Date.now()).getTime() - o.data.startDate.getTime();
895
- return {
896
- ...o,
897
- data: {
898
- ...o.data,
899
- // Adding timeDifference to calculate an up-to-date endDate on range selection
900
- timeDifference: S
901
- }
902
- };
903
- })), g = _(!1), q = _(null), R = _(!1), { isReadOnly: Re } = Ut(Oe(r, "readonly")), { emitValue: ie } = Yt(u);
904
- be(
905
- () => r.disabled,
906
- () => {
907
- r.disabled && R.value && (R.value = !1);
908
- }
909
- );
910
- const T = p(() => r.modelValue || r.value), ne = p(() => r.hasActions ? !U.value && g.value : g.value), ke = p(() => ({
911
- "b-date-range-picker__description--error": !!r.errorMessage || ne.value
912
- })), Ie = p(() => r.variant === "month"), ue = p(() => r.allowTimeInput && r.variant !== "month"), { dateDisplayValue: re, textInputDisplayValue: k } = ca({
913
- datePickerValue: T,
914
- isDateIncorrect: g,
915
- quickSelectRanges: h,
916
- isMonthVariant: Ie,
917
- withTimeInput: ue,
918
- placeholder: Oe(r, "placeholder")
919
- }), Me = p(
920
- () => `${r.description ? y : ""} ${r.errorMessage ? w : ""} ${g.value ? I : ""}`.trim() || null
921
- ), z = () => {
922
- R.value = !1;
923
- }, Se = () => {
924
- R.value = !0;
925
- }, Y = _(re.value), de = _(
926
- // textInputDisplayValue is a reactive object
927
- structuredClone(Ee(k))
928
- ), j = _(r.modelValue ?? r.value), U = _(!0), J = p(
929
- () => r.hasActions ? de.value : k
930
- ), X = p(
931
- () => r.hasActions ? Y.value : re.value
932
- );
933
- at(() => {
934
- if (r.hasActions || je(
935
- 'BentoDateRangePicker "hasActions" property',
936
- `Set the BentoDateRangePicker "hasActions" property true which will display the "Apply" and "Cancel" buttons.
937
- This will be the default behavior in the v2 and "hasActions" will be removed.`,
938
- "2.0.0"
939
- ), r.value && je(
940
- 'BentoDateRangePicker "value" property',
941
- 'The use of "value" prop in "BentoDateRangePicker" is no longer supported. Use the "v-model" or "model-value" property instead.',
942
- "2.0.0"
943
- ), r.granularities && r.variant !== "month" && r.granularities.find(({ type: o }) => o === "quarterly"))
944
- throw new Error('Quarterly granularity is only supported by BentoDateRangePicker with variant: "month"');
945
- }), be([() => r.value, () => r.modelValue], () => {
946
- Y.value = re.value, de.value = structuredClone(Ee(k));
947
- });
948
- const L = p(() => [
949
- {
950
- title: e("apply"),
951
- event: () => {
952
- ie(j.value), z(), U.value = !0;
953
- },
954
- disabled: U.value
955
- },
956
- {
957
- title: e("cancel"),
958
- event: z
959
- }
960
- ]);
961
- be(j, (o) => {
962
- if (r.hasActions) {
963
- U.value = g.value;
964
- return;
965
- }
966
- ie(o);
967
- });
968
- const Q = (o) => {
969
- g.value = !1, k.startDate = F(o.startDate), k.endDate = F(o.endDate), k.startTime = B(o.startDate), k.endTime = B(o.endDate), j.value = o;
970
- }, i = async () => {
971
- g.value && (g.value = !1), j.value = null;
972
- }, me = () => {
973
- if (!R.value) {
974
- R.value = !0;
975
- return;
976
- }
977
- g.value || (R.value = !1);
978
- }, ce = (o) => {
979
- g.value = !1, o.startTime && (k.startTime = o.startTime), o.endTime && (k.endTime = o.endTime);
980
- }, ee = (o) => {
981
- g.value = !0, k.startDate = o.startDate, k.endDate = o.endDate, j.value = { startDate: null, endDate: null };
982
- }, N = (o) => {
983
- o && (k.startDate = F(o.startDate), k.endDate = F(o.endDate), k.startTime = B(o.startDate), k.endTime = B(o.endDate), j.value = o);
984
- };
985
- return (o, S) => ht((E(), ge("div", Da, [
986
- o.label ? (E(), K(D(Gt), {
987
- key: 0,
988
- id: D(f),
989
- label: o.label,
990
- "tooltip-text": o.tooltipText,
991
- optional: o.optional,
992
- required: o.required
993
- }, null, 8, ["id", "label", "tooltip-text", "optional", "required"])) : A("", !0),
994
- V("div", {
995
- onKeydown: Ye(me, ["enter"])
996
- }, [
997
- H(D(Ot), {
998
- ref_key: "inputContainerRef",
999
- ref: q,
1000
- "always-combobox-is-input": "",
1001
- ariaControls: D(d),
1002
- ariaExpanded: R.value,
1003
- "aria-labelledby": o.label ? D(f) : null,
1004
- "aria-describedby": Me.value,
1005
- disabled: o.disabled,
1006
- "is-invalid": !!o.errorMessage || ne.value,
1007
- open: R.value,
1008
- "display-value": X.value,
1009
- readonly: D(Re),
1010
- onOpen: Se,
1011
- onClear: i,
1012
- onClose: z
1013
- }, null, 8, ["ariaControls", "ariaExpanded", "aria-labelledby", "aria-describedby", "disabled", "is-invalid", "open", "display-value", "readonly"])
1014
- ], 32),
1015
- ne.value ? (E(), K(D(Pe), {
1016
- key: 1,
1017
- id: D(I),
1018
- "error-message": D(e)("provideDateInAFormat"),
1019
- class: "b-date-range-picker__error-message"
1020
- }, null, 8, ["id", "error-message"])) : A("", !0),
1021
- o.errorMessage ? (E(), K(D(Pe), {
1022
- key: 2,
1023
- id: D(w),
1024
- "error-message": o.errorMessage,
1025
- class: "b-date-range-picker__error-message"
1026
- }, null, 8, ["id", "error-message"])) : A("", !0),
1027
- o.description ? (E(), K(D(Fe), {
1028
- key: 3,
1029
- id: D(y),
1030
- class: Te(["b-date-range-picker__description", ke.value]),
1031
- el: "span"
1032
- }, {
1033
- default: G(() => [
1034
- Z(Rt(o.description), 1)
1035
- ]),
1036
- _: 1
1037
- }, 8, ["id", "class"])) : A("", !0),
1038
- q.value ? (E(), K(D(St), {
1039
- key: 4,
1040
- id: D(d),
1041
- class: "b-date-range-picker__container",
1042
- open: R.value,
1043
- "target-element": q.value,
1044
- "aria-label": te.value,
1045
- position: "bottom-start",
1046
- "without-space": "",
1047
- "fit-content": "",
1048
- "trap-all": "",
1049
- "overflow-visible": "",
1050
- onKeydown: Ye(z, ["esc", "native"])
1051
- }, {
1052
- default: G(() => [
1053
- H(D(da), {
1054
- "allow-time-input": ue.value,
1055
- "quick-select-ranges": h.value,
1056
- value: T.value,
1057
- "first-day-of-week": D(ae),
1058
- granularities: o.granularities,
1059
- "is-date-disabled": o.isDateDisabled,
1060
- "max-range": o.maxRange,
1061
- min: o.min,
1062
- max: o.max,
1063
- "number-of-months": b.value,
1064
- "show-end-date-on-open": o.showEndDateOnOpen,
1065
- "date-form-data": J.value,
1066
- variant: o.variant,
1067
- onCustomRange: N,
1068
- onInput: Q,
1069
- onError: ee,
1070
- onFormDate: ce
1071
- }, kt({ _: 2 }, [
1072
- o.hasActions ? {
1073
- name: "actions",
1074
- fn: G(() => [
1075
- H(D(Mt)),
1076
- V("div", fa, [
1077
- H(D(wt), {
1078
- actions: L.value,
1079
- layout: D(Kt).SPACE_BETWEEN
1080
- }, null, 8, ["actions", "layout"])
1081
- ])
1082
- ]),
1083
- key: "0"
1084
- } : void 0
1085
- ]), 1032, ["allow-time-input", "quick-select-ranges", "value", "first-day-of-week", "granularities", "is-date-disabled", "max-range", "min", "max", "number-of-months", "show-end-date-on-open", "date-form-data", "variant"])
1086
- ]),
1087
- _: 1
1088
- }, 8, ["id", "open", "target-element", "aria-label"])) : A("", !0)
1089
- ])), [
1090
- [D($t), z]
1091
- ]);
1092
- }
1093
- }), La = /* @__PURE__ */ rt(pa, [["__scopeId", "data-v-75f221c8"]]);
1094
- export {
1095
- La as B,
1096
- da as D,
1097
- Zt as a,
1098
- ye as i
1099
- };
1100
- //# sourceMappingURL=date-range-picker.BPCt7cwj.js.map