vue-time-date-range-picker
Version:
a vue time date range picker
1,039 lines (1,038 loc) • 32 kB
JavaScript
var He = Object.defineProperty;
var $e = (a, t, e) => t in a ? He(a, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[t] = e;
var W = (a, t, e) => $e(a, typeof t != "symbol" ? t + "" : t, e);
import { defineComponent as F, computed as D, openBlock as w, createElementBlock as I, createElementVNode as v, unref as O, normalizeClass as A, toDisplayString as N, Fragment as j, renderList as U, ref as T, toRef as $, createCommentVNode as Te, createVNode as E, withDirectives as q, vShow as R } from "vue";
import m from "moment";
const Le = (a) => a;
Object.assign(globalThis, {
defineEmitOptions: Le
});
const B = (a) => typeof a == "object" && Object.prototype.toString.call(a) === "[object Date]", M = (a) => Ve(a) && Object.keys(a).length === 0;
/*!
* is-plain-object <https://github.com/jonschlinkert/is-plain-object>
*
* Copyright (c) 2014-2017, Jon Schlinkert.
* Released under the MIT License.
*/
function ae(a) {
return Object.prototype.toString.call(a) === "[object Object]";
}
function Ve(a) {
if (ae(a) === !1) return !1;
const t = a.constructor;
if (t === void 0) return !0;
const e = t.prototype;
return !(ae(e) === !1 || e.hasOwnProperty("isPrototypeOf") === !1);
}
class H {
constructor(t = "") {
W(this, "lang");
W(this, "localMoment");
this.lang = t, this.localMoment = m().locale(t);
}
createDate(...t) {
return m(...t).locale(this.lang).toDate();
}
now() {
return m().locale(this.lang).toDate();
}
getDayNames() {
return this.localMoment.localeData().weekdays();
}
/**
* Get Abbreviated Day Names
*/
getAbbrDayNames() {
return this.localMoment.localeData().weekdaysShort();
}
getMonthNames() {
return this.localMoment.localeData().months();
}
/**
* Get Abbreviated Month Names
*/
getAbbrMonthNames() {
return this.localMoment.localeData().monthsShort();
}
formatDate(t, e) {
return m(t).locale(this.lang).format(e);
}
/**
* Check if date is the same on DD MM YYYY level
* @param date1
* @param date2
* @returns
*/
isSameDate(t, e) {
return m(t).format("DD MM YYYY") === m(e).format("DD MM YYYY");
}
isAllDay(t, e) {
const n = m(t).startOf("day"), s = m(e).endOf("day");
return m(t).format("DD MM YYYY HH:mm:ss") === n.format("DD MM YYYY HH:mm:ss") && m(e).format("DD MM YYYY HH:mm:ss") === s.format("DD MM YYYY HH:mm:ss");
}
isValidDate(t) {
return B(t) && m(t).isValid();
}
toUnix(t) {
return m(t).unix();
}
fromUnix(t) {
return m.unix(t).toDate();
}
startOf(t, e) {
return m(t).locale(this.lang).startOf(e).toDate();
}
endOf(t, e) {
return m(t).locale(this.lang).endOf(e).toDate();
}
/**
* Check if date is the same as comparing date
* @param date
* @param comparingDate
* @returns
*/
isSame(t, e) {
return m(t).isSame(e);
}
/**
* Check if date is before a comparingDate
*/
isBefore(t, e) {
return m(t).isBefore(e);
}
/**
* Check if date is same or before a comparingDate
*/
isSameOrBefore(t, e) {
return m(t).isSameOrBefore(e);
}
/**
* Check if date is after a comparingDate
*/
isAfter(t, e) {
return m(t).isAfter(e);
}
/**
* Check if date is same or after a comparingDate
*/
isSameOrAfter(t, e) {
return m(t).isSameOrAfter(e);
}
/**
* Check if a date is between fromDate and toDate
*/
isBetween(t, e, n) {
return m(t).isBetween(e, n);
}
/**
* Check if a date is same or between as fromDate and toDate
*/
isSameOrBetween(t, e, n) {
const s = m(t);
return s.isSameOrAfter(e) && s.isSameOrBefore(n);
}
/**
* Add number of timeKey to date
*/
add(t, e, n) {
return m(t).locale(this.lang).add(e, n).toDate();
}
/**
* Subtract number of timeKey to date
*/
subtract(t, e, n) {
return m(t).locale(this.lang).subtract(e, n).toDate();
}
/**
* Get Number of Day in A month from A Date
*/
daysInMonth(t) {
return m(t).daysInMonth();
}
/**
* Get Day 0 - 6 from A Date
*/
day(t) {
return m(t).day();
}
/**
* Get Month 0 - 11 from A Date
*/
month(t) {
return m(t).month();
}
/**
* Get Year from A Date
*/
year(t) {
return m(t).year();
}
}
const je = (a) => {
if (!a || a.length === 0) return !0;
const [t, e] = a;
return t && e ? B(t) && B(e) && e.getTime() >= t.getTime() : t ? B(t) : e ? B(e) : !0;
}, Ue = (a) => !a || a.length === 0 ? !0 : a.every((t) => {
const e = typeof t.name == "string" && t.name !== "", n = B(t.from), s = B(t.to);
return e && n && s;
}), ne = (a) => {
if (!a || M(a)) return !0;
const { dates: t, from: e, to: n, ranges: s, custom: u } = a;
return !(Array.isArray(t) && t.some((i) => !B(i)) || e && !B(e) || n && !B(n) || Array.isArray(s) && s.some((i) => !B(i.from) || !B(i.to)) || u && typeof u != "function");
}, qe = (a) => {
if (!a) return !0;
if (M(a)) return !1;
const { from: t, to: e } = a;
return typeof t == "string" && t !== "" && typeof e == "string" && e !== "";
}, G = {
inputClass: [String, Object, Array],
refName: String,
name: String,
type: String,
placeholder: String,
id: String,
required: Boolean,
format: {
type: String,
default: "DD/MM/YYYY HH:mm"
},
sameDateFormat: {
type: Object,
validator: qe,
default: () => ({
from: "DD/MM/YYYY, HH:mm",
to: "HH:mm"
})
},
language: {
type: String,
default: "en"
},
selectedStartDate: Date,
selectedEndDate: Date
}, Re = defineEmitOptions({
click: (a) => !0
}), We = ["id", "type", "name", "placeholder", "required", "value"], ze = {
inheritAttrs: !0
}, Ge = /* @__PURE__ */ F({
...ze,
props: G,
emits: Re,
setup(a, { emit: t }) {
const e = a, n = D(() => new H(e.language)), s = D(() => {
if (!e.selectedStartDate || !e.selectedEndDate) return "";
if (n.value.isSameDate(e.selectedStartDate, e.selectedEndDate)) {
const o = n.value.formatDate(
e.selectedStartDate,
e.sameDateFormat.from
), c = n.value.formatDate(
e.selectedEndDate,
e.sameDateFormat.to
);
return `${o} - ${c}`;
}
const i = n.value.formatDate(
e.selectedStartDate,
e.format
), h = n.value.formatDate(e.selectedEndDate, e.format);
return `${i} - ${h}`;
}), u = (i) => {
t("click", i);
};
return (i, h) => (w(), I("div", null, [
v("input", {
id: i.id,
type: i.type,
ref: i.refName,
name: i.name,
placeholder: i.placeholder,
required: i.required,
value: O(s),
class: A(i.inputClass),
onClick: u,
readonly: ""
}, null, 10, We)
]));
}
}), re = {
pageDate: {
type: Date,
required: !0
},
days: {
type: Array,
default: () => []
},
dayNames: {
type: Array,
default: () => []
},
isPrevPageDisabled: {
type: Boolean,
default: !1
},
isNextPageDisabled: {
type: Boolean,
default: !1
},
language: {
type: String,
default: "en"
}
}, Je = defineEmitOptions({
"select-disabled-date": (a) => !0,
"select-date": (a) => !0,
"on-prev-calendar": (a) => !0,
"on-next-calendar": (a) => !0
}), Ke = { class: "vdpr-datepicker__calendar" }, Qe = { class: "vdpr-datepicker__calendar-control" }, Xe = { class: "vdpr-datepicker__calendar-month-year" }, Ze = { class: "vdpr-datepicker__calendar-table" }, xe = ["onClick"], et = {
inheritAttrs: !1
}, tt = /* @__PURE__ */ F({
...et,
props: re,
emits: Je,
setup(a, { expose: t, emit: e }) {
const n = a, s = D(() => new H(n.language)), u = D(() => n.pageDate ? s.value.formatDate(n.pageDate, "MMM YYYY") : "MMM YYYY"), i = (p) => {
const b = p * 7, C = b - 7;
return n.days.slice(C, b);
}, h = (p) => p.isDisabled ? e("select-disabled-date", p.date) : e("select-date", p.date), o = (p) => {
n.isPrevPageDisabled || e("on-prev-calendar", p);
}, c = (p) => {
n.isNextPageDisabled || e("on-next-calendar", p);
};
return t({
selectDate: h,
getRowDays: i
}), (p, b) => (w(), I("div", Ke, [
v("div", Qe, [
v("span", {
class: A(["vdpr-datepicker__calendar-control-prev", {
"vdpr-datepicker__calendar-control-disabled": p.isPrevPageDisabled
}]),
onClick: o
}, null, 2),
v("span", Xe, N(O(u)), 1),
v("span", {
class: A(["vdpr-datepicker__calendar-control-next", {
"vdpr-datepicker__calendar-control-disabled": p.isNextPageDisabled
}]),
onClick: c
}, null, 2)
]),
v("table", Ze, [
v("thead", null, [
v("tr", null, [
(w(!0), I(j, null, U(p.dayNames, (C) => (w(), I("th", { key: C }, N(C), 1))), 128))
])
]),
v("tbody", null, [
(w(), I(j, null, U(6, (C) => v("tr", { key: C }, [
(w(!0), I(j, null, U(i(C), (d) => (w(), I("td", {
key: d.timestamp,
class: A({
highlighted: d.isHighlighted,
faded: d.isFaded,
disabled: d.isDisabled
}),
onClick: (r) => h(d)
}, N(d.dateNumber), 11, xe))), 128))
])), 64))
])
])
]));
}
}), at = {
checked: {
type: Boolean
}
}, nt = defineEmitOptions({
change: (a) => !0
}), lt = { class: "vdpr-datepicker__switch" }, st = ["checked"], rt = /* @__PURE__ */ v("span", { class: "vdpr-datepicker__switch-slider" }, null, -1), it = {
inheritAttrs: !1
}, ot = /* @__PURE__ */ F({
...it,
props: at,
emits: nt,
setup(a, { emit: t }) {
return (e, n) => (w(), I("label", lt, [
v("input", {
type: "checkbox",
checked: e.checked,
onChange: n[0] || (n[0] = (s) => t("change", s))
}, null, 40, st),
rt
]));
}
}), ut = {
inputClass: [String, Object, Array],
timestamp: {
type: Number,
default: 0
},
format: {
type: String,
default: "DD/MM/YYYY"
},
language: {
type: String,
default: "en"
}
}, dt = defineEmitOptions({
change: (a) => !0
}), ct = { class: "vdpr-datepicker__calendar-input-date" }, pt = ["value"], ft = {}, le = /* @__PURE__ */ F({
...ft,
props: ut,
emits: dt,
setup(a, { emit: t }) {
const e = a, n = D(() => new H(e.language)), s = D(() => {
if (e.timestamp === 0) return;
const i = n.value.fromUnix(e.timestamp);
return n.value.formatDate(i, e.format);
}), u = (i) => {
const h = i.target;
let o = "00:00:00";
if (e.timestamp !== 0) {
const p = n.value.fromUnix(e.timestamp);
o = n.value.formatDate(p, "HH:mm:ss");
}
const c = n.value.createDate(
`${h.value} ${o}`,
`${e.format} HH:mm:ss`
);
if (n.value.isValidDate(c))
return t("change", c);
};
return (i, h) => (w(), I("div", ct, [
v("input", {
ref: "inputDateRef",
class: A(["vdpr-datepicker__calendar-input-date-elem", i.inputClass]),
type: "text",
value: O(s),
onChange: u
}, null, 42, pt)
]));
}
}), mt = {
inputClass: [String, Object, Array],
readonly: {
type: Boolean,
default: !1
},
timestamp: {
type: Number,
default: 0
},
language: {
type: String,
default: "en"
},
step: {
type: Number,
default: 60
// in minutes
}
}, vt = defineEmitOptions({
change: (a) => !0
}), Dt = { class: "vdpr-datepicker__calendar-input-time" }, ht = ["value", "readonly"], gt = {}, se = /* @__PURE__ */ F({
...gt,
props: mt,
emits: vt,
setup(a, { emit: t }) {
const e = a, n = D(() => new H(e.language)), s = D(() => {
if (e.timestamp === 0) return "";
const o = n.value.fromUnix(e.timestamp);
return n.value.formatDate(o, "HH:mm");
}), u = () => {
if (e.timestamp === 0) return;
const o = n.value.fromUnix(e.timestamp + e.step * 60);
t("change", o);
}, i = () => {
if (e.timestamp === 0) return;
const o = n.value.fromUnix(e.timestamp - e.step * 60);
t("change", o);
}, h = (o) => {
const c = o.target, [p, b] = c.value.trim().split(":"), C = parseInt(p, 10), d = parseInt(b, 10);
if (isNaN(C) || isNaN(d))
return !1;
const r = C * 60 + d, y = n.value.startOf(
n.value.fromUnix(e.timestamp),
"d"
), Y = n.value.add(y, r, "m");
t("change", Y);
};
return (o, c) => (w(), I("div", Dt, [
v("input", {
class: A(["vdpr-datepicker__calendar-input-time-elem", o.inputClass]),
type: "text",
value: O(s),
readonly: o.readonly,
onChange: h
}, null, 42, ht),
v("div", { class: "vdpr-datepicker__calendar-input-time-control" }, [
v("span", {
class: "vdpr-datepicker__calendar-input-time-control-up",
onClick: u
}, " ▲ "),
v("span", {
class: "vdpr-datepicker__calendar-input-time-control-down",
onClick: i
}, " ▼ ")
])
]));
}
}), S = {
language: re.language,
disabledDates: {
type: Object,
validator: ne,
default: () => ({})
},
availableDates: {
type: Object,
validator: ne,
default: () => ({})
},
isMondayFirst: {
type: Boolean,
default: !1
},
initialDates: {
type: Array,
validator: je,
default: () => []
},
inline: {
type: Boolean,
default: !1
},
showHelperButtons: {
type: Boolean,
default: !0
},
helperButtons: {
type: Array,
validator: Ue,
default: () => []
},
timeInput: {
type: Object,
default: () => ({
inputClass: null,
readonly: !1,
step: 60
})
},
dateInput: {
type: Object,
default: () => ({
inputClass: null,
labelStarts: "Starts",
labelEnds: "Ends",
format: "DD/MM/YYYY"
})
},
switchButtonLabel: {
type: String,
default: "All Days"
},
switchButtonInitial: {
type: Boolean,
default: !1
},
applyButtonLabel: {
type: String,
default: "Apply"
},
resetButtonLabel: {
type: String,
default: "Reset"
}
}, yt = defineEmitOptions({
"on-apply": (a, t) => !0,
"on-reset": (a) => !0,
"select-date": (a, t) => !0,
"select-disabled-date": (a) => !0,
"on-prev-calendar": (a) => !0,
"on-next-calendar": (a) => !0
}), bt = (a) => {
var h, o;
const t = D(() => new H(a.language.value)), e = T(
((h = a.initialDates.value) == null ? void 0 : h[0]) ?? null
), n = T(
((o = a.initialDates.value) == null ? void 0 : o[1]) ?? null
), s = D(() => e.value && n.value ? t.value.isAllDay(
e.value,
n.value
) : !1), u = D(() => (c) => {
const p = B(e.value), b = B(n.value);
return p && b ? t.value.isSameOrBetween(
c,
t.value.startOf(e.value, "d"),
t.value.startOf(n.value, "d")
) : p ? t.value.isSameDate(c, e.value) : b ? t.value.isSameDate(c, n.value) : !1;
});
return {
selectedStartDate: e,
selectedEndDate: n,
isAllDay: s,
isDateHighlighted: u,
setDates: (c, p) => {
const b = [
t.value.isValidDate(c) ? c : null,
t.value.isValidDate(p) ? p : null
];
return b[0] && b[1] && t.value.isAfter(b[0], b[1]) && ([b[0], b[1]] = [b[1], b[0]]), [e.value, n.value] = b, {
startDate: e.value,
endDate: n.value
};
}
};
}, _t = (a) => {
var C;
const t = D(() => new H(a.language.value)), e = T(((C = a.pageDate) == null ? void 0 : C.value) ?? t.value.now()), n = D(() => {
var d, r, y;
return !((d = a == null ? void 0 : a.disabledDates) != null && d.value) || M((r = a == null ? void 0 : a.disabledDates) == null ? void 0 : r.value) ? null : ie(
(y = a == null ? void 0 : a.disabledDates) == null ? void 0 : y.value,
t.value
);
}), s = D(() => {
var d, r, y;
return !((d = a == null ? void 0 : a.availableDates) != null && d.value) || M((r = a == null ? void 0 : a.availableDates) == null ? void 0 : r.value) ? null : Ct(
(y = a == null ? void 0 : a.availableDates) == null ? void 0 : y.value,
t.value
);
}), u = D(() => (d) => n.value ? n.value(d) : s.value ? !s.value(d) : !1), i = D(() => kt(
e.value,
a.isMondayFirst.value,
t.value
)), h = D(() => {
var y, Y;
const d = ((y = a == null ? void 0 : a.disabledDates) == null ? void 0 : y.value) ?? {}, r = ((Y = a == null ? void 0 : a.availableDates) == null ? void 0 : Y.value) ?? {};
if (!M(d)) {
const { from: _, to: f } = d;
return !_ || f && t.value.isAfter(f, _) ? !1 : t.value.month(_) <= t.value.month(e.value) && t.value.year(_) <= t.value.year(e.value) || t.value.year(_) < t.value.year(e.value);
}
if (M(d) && !M(r)) {
const { from: _, to: f } = r;
return !f || _ && t.value.isAfter(_, f) ? !1 : t.value.month(f) <= t.value.month(e.value) && t.value.year(f) <= t.value.year(e.value) || t.value.year(f) < t.value.year(e.value);
}
return !1;
}), o = D(() => {
var y, Y;
const d = ((y = a == null ? void 0 : a.disabledDates) == null ? void 0 : y.value) ?? {}, r = ((Y = a == null ? void 0 : a.availableDates) == null ? void 0 : Y.value) ?? {};
if (!M(d)) {
const { from: _, to: f } = d;
return !f || _ && t.value.isBefore(_, f) ? !1 : t.value.month(f) >= t.value.month(e.value) && t.value.year(f) >= t.value.year(e.value) || t.value.year(f) > t.value.year(e.value);
}
if (M(d) && !M(r)) {
const { from: _, to: f } = r;
return !_ || f && t.value.isBefore(f, _) ? !1 : t.value.month(_) >= t.value.month(e.value) && t.value.year(_) >= t.value.year(e.value) || t.value.year(_) > t.value.year(e.value);
}
return !1;
}), c = D(() => {
const d = t.value.getAbbrDayNames();
if (a.isMondayFirst.value) {
const [r, ...y] = d;
return [...y, r];
}
return d;
});
return {
pageDate: e,
dayNames: c,
days: i,
isNextPageDisabled: h,
isPrevPageDisabled: o,
nextPage: () => h.value ? !1 : (e.value = t.value.add(e.value, 1, "month"), !0),
prevPage: () => o.value ? !1 : (e.value = t.value.subtract(e.value, 1, "month"), !0),
isDisabledDate: u
};
}, z = (a, t) => ({
date: a,
timestamp: a.getTime(),
dateNumber: a.getDate(),
isFaded: t
}), kt = (a, t, e) => {
let n = e.startOf(a, "month");
const s = e.daysInMonth(a), u = [], i = [], h = [];
for (let d = 0; d < s; d += 1)
u.push(z(n, !1)), n = e.add(n, 1, "day");
let o = u[0].date;
const b = t ? 1 : 0;
for (; o.getDay() !== b; )
o = e.subtract(o, 1, "day"), i.unshift(z(o, !0));
let C = u[u.length - 1].date;
for (let d = i.length + u.length; d < 42; d += 1)
C = e.add(C, 1, "day"), h.push(z(C, !0));
return [...i, ...u, ...h];
}, ie = (a, t) => {
const e = Ot(
a,
t
);
return (n) => e.length === 0 ? !1 : e.some((s) => s(n));
}, Ct = (a, t) => (e) => !ie(a, t)(e), Ot = (a, t) => {
const e = [], { dates: n, from: s, to: u, ranges: i, custom: h } = a;
return Array.isArray(n) && n.forEach((o) => {
e.push((c) => t.isSameDate(c, o));
}), Array.isArray(i) && i.forEach((o) => {
e.push((c) => t.isSameOrBetween(c, o.from, o.to));
}), s && u && t.isBefore(s, u) ? e.push((o) => t.isSameOrBetween(o, s, u)) : (s && e.push((o) => t.isSameOrAfter(o, s)), u && e.push((o) => t.isSameOrBefore(o, u))), h && typeof h == "function" && e.push((o) => !!h(o)), e;
}, Bt = {
key: 0,
class: "vdpr-datepicker__calendar-button-helper"
}, St = ["onClick"], wt = { class: "vdpr-datepicker__calendar-actions" }, It = { class: "vdpr-datepicker__calendar-input-wrapper" }, Yt = { class: "vdpr-datepicker__calendar-input-wrapper" }, Mt = { class: "vdpr-datepicker__calendar-input-wrapper vdpr-datepicker__calendar-input-wrapper--end" }, At = { class: "vdpr-datepicker__calendar-input-wrapper" }, Nt = { class: "vdpr-datepicker__calendar-input-wrapper vdpr-datepicker__calendar-input-wrapper--end" }, Pt = {
inheritAttrs: !1
}, Et = /* @__PURE__ */ F({
...Pt,
props: S,
emits: yt,
setup(a, { expose: t, emit: e }) {
const n = a, s = D(() => new H(n.language)), {
selectedStartDate: u,
selectedEndDate: i,
isAllDay: h,
isDateHighlighted: o,
setDates: c
} = bt({
initialDates: $(n, "initialDates"),
language: $(n, "language")
}), p = T(
u.value ?? i.value ?? s.value.now()
), {
pageDate: b,
dayNames: C,
days: d,
isPrevPageDisabled: r,
isNextPageDisabled: y,
nextPage: Y,
prevPage: _,
isDisabledDate: f
} = _t({
isMondayFirst: $(n, "isMondayFirst"),
language: $(n, "language"),
availableDates: $(n, "availableDates"),
disabledDates: $(n, "disabledDates"),
pageDate: p
}), V = D(
() => d.value.map((l) => ({
...l,
isDisabled: f.value(l.date),
isHighlighted: o.value(l.date)
}))
), L = T(n.switchButtonInitial || h.value), J = D(() => n.showHelperButtons ? n.helperButtons.length !== 0 ? n.helperButtons : x() : []), K = D(() => u.value ? s.value.toUnix(u.value) : 0), Q = D(() => i.value ? s.value.toUnix(i.value) : 0), X = D(() => !L.value), oe = D(() => !n.inline), ue = (l) => {
const k = l.target.checked;
if (L.value = k, !u.value || !i.value) return;
const g = s.value.startOf(u.value, "d");
k ? P(
g,
s.value.endOf(i.value, "d")
) : P(
g,
s.value.startOf(i.value, "d")
);
}, de = (l) => {
if (f.value(l))
return e("select-disabled-date", l);
P(l, i.value);
}, ce = (l) => {
if (f.value(l))
return e("select-disabled-date", l);
P(u.value, l);
}, pe = (l) => {
if (f.value(l))
return e("select-disabled-date", l);
P(l, i.value);
}, fe = (l) => {
if (f.value(l))
return e("select-disabled-date", l);
P(u.value, l);
}, me = (l, k) => {
if (f.value(l))
return e("select-disabled-date", l);
if (f.value(k))
return e("select-disabled-date", k);
P(l, k);
}, ve = () => {
u.value && i.value && e("on-apply", u.value, i.value);
}, De = (l) => {
c(null, null), e("on-reset", l);
}, Z = (l) => {
let [k, g] = [
u.value,
i.value
];
B(k) && B(g) ? s.value.isSameDate(k, g) ? s.value.isAfter(l, k) ? g = l : k = l : (k = l, g = l) : [k, g] = [k ?? l, g ?? l], L.value && (k = s.value.startOf(k, "d"), g = s.value.endOf(g, "d")), P(k, g);
}, he = (l) => {
e("select-disabled-date", l);
}, P = (l, k) => {
const g = c(l, k);
e("select-date", g.startDate, g.endDate), n.inline && g.startDate && g.endDate && e("on-apply", g.startDate, g.endDate);
}, x = () => {
const l = /* @__PURE__ */ new Date(), k = s.value.subtract(l, 1, "d"), g = s.value.subtract(l, 7, "d"), ee = s.value.subtract(l, 1, "M"), te = s.value.subtract(l, 1, "y"), be = s.value.startOf(l, "d"), _e = s.value.endOf(l, "d"), ke = s.value.startOf(k, "d"), Ce = s.value.endOf(k, "d"), Oe = s.value.startOf(l, "week"), Be = s.value.endOf(l, "week"), Se = s.value.startOf(g, "week"), we = s.value.endOf(g, "week"), Ie = s.value.startOf(l, "month"), Ye = s.value.endOf(l, "month"), Me = s.value.startOf(ee, "month"), Ae = s.value.endOf(ee, "month"), Ne = s.value.startOf(l, "year"), Pe = s.value.endOf(l, "year"), Ee = s.value.startOf(te, "year"), Fe = s.value.endOf(te, "year");
return [
{
name: "Today",
from: be,
to: _e
},
{
name: "Yesterday",
from: ke,
to: Ce
},
{
name: "This Week",
from: Oe,
to: Be
},
{
name: "Last Week",
from: Se,
to: we
},
{
name: "This Month",
from: Ie,
to: Ye
},
{
name: "Last Month",
from: Me,
to: Ae
},
{
name: "This Year",
from: Ne,
to: Pe
},
{
name: "Last Year",
from: Ee,
to: Fe
}
];
}, ge = (l) => {
_() && e("on-prev-calendar", l);
}, ye = (l) => {
Y() && e("on-next-calendar", l);
};
return t({
selectedStartDate: u,
selectedEndDate: i,
isAllDayChecked: L,
dayNames: C,
days: d,
isPrevPageDisabled: r,
isNextPageDisabled: y,
setDates: c,
selectDate: Z,
nextPage: Y,
prevPage: _,
getDefaultHelpers: x
}), (l, k) => (w(), I("div", {
class: A(["vdpr-datepicker__calendar-dialog", {
"vdpr-datepicker__calendar-dialog--inline": l.inline
}])
}, [
O(J).length ? (w(), I("div", Bt, [
(w(!0), I(j, null, U(O(J), (g) => (w(), I("button", {
key: "btn" + g.name,
class: A([
"vdpr-datepicker__button",
"vdpr-datepicker__button--block",
"vdpr-datepicker__button-default"
]),
onClick: () => {
me(g.from, g.to);
}
}, N(g.name), 9, St))), 128))
])) : Te("", !0),
E(tt, {
language: l.language,
days: O(V),
"day-names": O(C),
"page-date": O(b),
"is-next-page-disabled": O(y),
"is-prev-page-disabled": O(r),
onSelectDate: Z,
onSelectDisabledDate: he,
onOnPrevCalendar: ge,
onOnNextCalendar: ye
}, null, 8, ["language", "days", "day-names", "page-date", "is-next-page-disabled", "is-prev-page-disabled"]),
v("div", wt, [
v("div", It, [
v("span", null, N(l.switchButtonLabel), 1),
E(ot, {
checked: L.value,
onChange: ue
}, null, 8, ["checked"])
]),
v("div", Yt, [
v("span", null, N(l.dateInput.labelStarts), 1),
E(le, {
format: l.dateInput.format,
inputClass: l.dateInput.inputClass,
timestamp: O(K),
language: l.language,
onChange: de
}, null, 8, ["format", "inputClass", "timestamp", "language"])
]),
v("div", Mt, [
q(E(se, {
step: l.timeInput.step,
readonly: l.timeInput.readonly,
inputClass: l.timeInput.inputClass,
timestamp: O(K),
onChange: pe
}, null, 8, ["step", "readonly", "inputClass", "timestamp"]), [
[R, O(X)]
])
]),
v("div", At, [
v("span", null, N(l.dateInput.labelEnds), 1),
E(le, {
format: l.dateInput.format,
inputClass: l.dateInput.inputClass,
timestamp: O(Q),
language: l.language,
onChange: ce
}, null, 8, ["format", "inputClass", "timestamp", "language"])
]),
v("div", Nt, [
q(E(se, {
step: l.timeInput.step,
readonly: l.timeInput.readonly,
inputClass: l.timeInput.inputClass,
timestamp: O(Q),
onChange: fe
}, null, 8, ["step", "readonly", "inputClass", "timestamp"]), [
[R, O(X)]
])
]),
q(v("button", {
class: A([
"vdpr-datepicker__button",
"vdpr-datepicker__button--block",
"vdpr-datepicker__button-submit"
]),
onClick: ve
}, N(l.applyButtonLabel), 513), [
[R, O(oe)]
]),
v("button", {
class: A([
"vdpr-datepicker__button",
"vdpr-datepicker__button--block",
"vdpr-datepicker__button-reset"
]),
onClick: De
}, N(l.resetButtonLabel), 1)
])
], 2));
}
}), Ft = {
modelValue: {
type: Array,
default: () => null
},
initialDates: S.initialDates,
inline: S.inline,
language: S.language,
format: G.format,
sameDateFormat: G.sameDateFormat,
dateInput: {
type: Object,
default: () => ({})
},
disabledDates: S.disabledDates,
availableDates: S.availableDates,
showHelperButtons: S.showHelperButtons,
helperButtons: S.helperButtons,
calendarDateInput: S.dateInput,
calendarTimeInput: S.timeInput,
switchButtonLabel: S.switchButtonLabel,
switchButtonInitial: S.switchButtonInitial,
applyButtonLabel: S.applyButtonLabel,
resetButtonLabel: S.resetButtonLabel,
isMondayFirst: S.isMondayFirst
}, Ht = defineEmitOptions({
"update:model-value": (a) => !0,
"date-applied": (a, t) => !0,
"datepicker-opened": () => !0,
"datepicker-closed": () => !0,
"on-prev-calendar": (a) => !0,
"on-next-calendar": (a) => !0,
"select-date": (a, t) => !0,
"select-disabled-date": (a) => !0,
"on-reset": (a) => !0
}), $t = { class: "vdpr-datepicker" }, Tt = {
inheritAttrs: !0
}, Ut = /* @__PURE__ */ F({
...Tt,
props: Ft,
emits: Ht,
setup(a, { expose: t, emit: e }) {
const n = a, s = T(n.inline), u = D(() => !n.inline), i = D(() => s.value || n.inline), h = (r, y) => (e("update:model-value", [r, y]), r && y && (e("date-applied", r, y), n.inline || (s.value = !1)), !0), o = (r) => {
e("update:model-value", null), e("on-reset", r);
}, c = () => {
n.inline || (s.value = !s.value, s.value ? e("datepicker-opened") : e("datepicker-closed"));
}, p = (r) => {
e("on-prev-calendar", r);
}, b = (r) => {
e("on-next-calendar", r);
}, C = (r, y) => (e("update:model-value", [r, y]), e("select-date", r, y), !0), d = (r) => {
e("select-disabled-date", r);
};
return t({
showCalendarDialog: s
}), (r, y) => {
var Y, _, f, V;
return w(), I("div", $t, [
E(Ge, {
type: O(u) ? "text" : "hidden",
language: r.language,
selectedStartDate: ((Y = r.modelValue) == null ? void 0 : Y[0]) ?? ((_ = r.initialDates) == null ? void 0 : _[0]),
selectedEndDate: ((f = r.modelValue) == null ? void 0 : f[1]) ?? ((V = r.initialDates) == null ? void 0 : V[1]),
format: r.format,
sameDateFormat: r.sameDateFormat,
refName: r.dateInput.refName,
inputClass: r.dateInput.inputClass,
name: r.dateInput.name,
id: r.dateInput.id,
placeholder: r.dateInput.placeholder,
required: r.dateInput.required,
onClick: c
}, null, 8, ["type", "language", "selectedStartDate", "selectedEndDate", "format", "sameDateFormat", "refName", "inputClass", "name", "id", "placeholder", "required"]),
q(E(Et, {
language: r.language,
inline: r.inline,
initialDates: r.modelValue ?? r.initialDates,
disabledDates: r.disabledDates,
availableDates: r.availableDates,
showHelperButtons: r.showHelperButtons,
helperButtons: r.helperButtons,
dateInput: r.calendarDateInput,
timeInput: r.calendarTimeInput,
switchButtonLabel: r.switchButtonLabel,
switchButtonInitial: r.switchButtonInitial,
applyButtonLabel: r.applyButtonLabel,
resetButtonLabel: r.resetButtonLabel,
isMondayFirst: r.isMondayFirst,
onOnApply: h,
onOnReset: o,
onSelectDate: C,
onSelectDisabledDate: d,
onOnPrevCalendar: p,
onOnNextCalendar: b
}, null, 8, ["language", "inline", "initialDates", "disabledDates", "availableDates", "showHelperButtons", "helperButtons", "dateInput", "timeInput", "switchButtonLabel", "switchButtonInitial", "applyButtonLabel", "resetButtonLabel", "isMondayFirst"]), [
[R, O(i)]
])
]);
};
}
});
export {
Et as CalendarDialog,
Ut as DatePicker
};
//# sourceMappingURL=vdprDatePicker.js.map