@kunukn/vue-2-datepicker
Version:
A simple Vue 2 date picker component. Supports disabling of dates, inline mode, translations and custom formatters.
1,857 lines • 52.4 kB
JavaScript
class T {
constructor(t, s, i, a) {
i || (i = (s || []).map((r) => (r || "").slice(0, 3))), this.language = t, this.months = s, this.monthsAbbr = i, this.days = a, this.rtl = !1, this.ymd = !1, this.yearSuffix = "";
}
get language() {
return this._language;
}
set language(t) {
if (typeof t != "string")
throw new TypeError("Language must be a string");
this._language = t;
}
get months() {
return this._months;
}
set months(t) {
if (t.length !== 12)
throw new RangeError(
`There must be 12 months for ${this.language} language`
);
this._months = t;
}
get monthsAbbr() {
return this._monthsAbbr;
}
set monthsAbbr(t) {
if (t.length !== 12)
throw new RangeError(
`There must be 12 abbreviated months for ${this.language} language`
);
this._monthsAbbr = t;
}
get days() {
return this._days;
}
set days(t) {
if (t.length !== 7)
throw new RangeError(`There must be 7 days for ${this.language} language`);
this._days = t;
}
}
const c = new T(
"English",
[
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
],
[
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec"
],
["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]
), C = {
/**
* @type {Boolean}
*/
useUtc: !1,
/**
* Returns the full year, using UTC or not
* @param {Date} date
*/
getFullYear(e) {
return this.useUtc ? e.getUTCFullYear() : e.getFullYear();
},
/**
* Returns the month, using UTC or not
* @param {Date} date
*/
getMonth(e) {
return this.useUtc ? e.getUTCMonth() : e.getMonth();
},
/**
* Returns the date, using UTC or not
* @param {Date} date
*/
getDate(e) {
return this.useUtc ? e.getUTCDate() : e.getDate();
},
/**
* Returns the day, using UTC or not
* @param {Date} date
*/
getDay(e) {
return this.useUtc ? e.getUTCDay() : e.getDay();
},
/**
* Returns the hours, using UTC or not
* @param {Date} date
*/
getHours(e) {
return this.useUtc ? e.getUTCHours() : e.getHours();
},
/**
* Returns the minutes, using UTC or not
* @param {Date} date
*/
getMinutes(e) {
return this.useUtc ? e.getUTCMinutes() : e.getMinutes();
},
/**
* Sets the full year, using UTC or not
* @param {Date} date
*/
setFullYear(e, t) {
return this.useUtc ? e.setUTCFullYear(t) : e.setFullYear(t);
},
/**
* Sets the month, using UTC or not
* @param {Date} date
*/
setMonth(e, t) {
return this.useUtc ? e.setUTCMonth(t) : e.setMonth(t);
},
/**
* Sets the date, using UTC or not
* @param {Date} date
* @param {Number} value
*/
setDate(e, t) {
return this.useUtc ? e.setUTCDate(t) : e.setDate(t);
},
/**
* Check if date1 is equivalent to date2, without comparing the time
* @see https://stackoverflow.com/a/6202196/4455925
* @param {Date} date1
* @param {Date} date2
*/
compareDates(e, t) {
const s = new Date(e.getTime()), i = new Date(t.getTime());
return this.useUtc ? (s.setUTCHours(0, 0, 0, 0), i.setUTCHours(0, 0, 0, 0)) : (s.setHours(0, 0, 0, 0), i.setHours(0, 0, 0, 0)), s.getTime() === i.getTime();
},
/**
* Validates a date object
* @param {Date} date - an object instantiated with the new Date constructor
* @return {Boolean}
*/
isValidDate(e) {
return Object.prototype.toString.call(e) !== "[object Date]" ? !1 : !isNaN(e.getTime());
},
/**
* Return abbreviated week day name
* @param {Date}
* @param {Array}
* @return {String}
*/
getDayNameAbbr(e, t) {
if (typeof e != "object")
throw TypeError("Invalid Type");
return t[this.getDay(e)];
},
/**
* Return name of the month
* @param {Number|Date}
* @param {Array}
* @return {String}
*/
getMonthName(e, t) {
if (!t)
throw Error("missing 2nd parameter Months array");
if (typeof e == "object")
return t[this.getMonth(e)];
if (typeof e == "number")
return t[e];
throw TypeError("Invalid type");
},
/**
* Return an abbreviated version of the month
* @param {Number|Date}
* @return {String}
*/
getMonthNameAbbr(e, t) {
if (!t)
throw Error("missing 2nd paramter Months array");
if (typeof e == "object")
return t[this.getMonth(e)];
if (typeof e == "number")
return t[e];
throw TypeError("Invalid type");
},
/**
* Alternative get total number of days in month
* @param {Number} year
* @param {Number} m
* @return {Number}
*/
daysInMonth(e, t) {
return /8|3|5|10/.test(t) ? 30 : t === 1 ? !(e % 4) && e % 100 || !(e % 400) ? 29 : 28 : 31;
},
/**
* Get nth suffix for date
* @param {Number} day
* @return {String}
*/
getNthSuffix(e) {
switch (e) {
case 1:
case 21:
case 31:
return "st";
case 2:
case 22:
return "nd";
case 3:
case 23:
return "rd";
default:
return "th";
}
},
/**
* Formats date object
* @param {Date}
* @param {String}
* @param {Object}
* @return {String}
*/
formatDate(e, t, s) {
s = s || c;
let i = this.getFullYear(e), a = this.getMonth(e) + 1, r = this.getDate(e);
return t.replace(/dd/, ("0" + r).slice(-2)).replace(/d/, r).replace(/yyyy/, i).replace(/yy/, String(i).slice(2)).replace(
/MMMM/,
this.getMonthName(this.getMonth(e), s.months)
).replace(
/MMM/,
this.getMonthNameAbbr(this.getMonth(e), s.monthsAbbr)
).replace(/MM/, ("0" + a).slice(-2)).replace(/M(?!a|ä|e)/, a).replace(/su/, this.getNthSuffix(this.getDate(e))).replace(/D(?!e|é|i)/, this.getDayNameAbbr(e, s.days));
},
/**
* Creates an array of dates for each day in between two dates.
* @param {Date} start
* @param {Date} end
* @return {Array}
*/
createDateArray(e, t) {
let s = [];
for (; e <= t; )
s.push(new Date(e)), e = this.setDate(new Date(e), this.getDate(new Date(e)) + 1);
return s;
},
/**
* method used as a prop validator for input values
* @param {*} val
* @return {Boolean}
*/
validateDateInput(e) {
return e === null || e instanceof Date || typeof e == "string" || typeof e == "number";
}
}, u = (e) => ({ ...C, useUtc: e }), g = {
...C
};
var S = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("div", {
staticClass: "vdp-datepicker__date-input",
class: {
"input-group": e.bootstrapStyling
}
}, [s("input", {
ref: e.refName,
class: e.computedInputClass,
attrs: {
id: e.id,
type: e.inline ? "hidden" : "text",
name: e.name,
"open-date": e.openDate,
placeholder: e.placeholder,
disabled: e.disabled,
required: e.required,
readonly: !e.typeable,
autocomplete: "off"
},
domProps: {
value: e.formattedValue
},
on: {
click: e.showCalendar,
keyup: e.parseTypedDate,
keydown: e.onKeyDown,
blur: e.inputBlurred
}
}), e._t("afterDateInput")], 2);
}, $ = [];
function h(e, t, s, i, a, r, d, M) {
var n = typeof e == "function" ? e.options : e;
t && (n.render = t, n.staticRenderFns = s, n._compiled = !0), i && (n.functional = !0), r && (n._scopeId = "data-v-" + r);
var o;
if (d ? (o = function(l) {
l = l || // cached call
this.$vnode && this.$vnode.ssrContext || // stateful
this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !l && typeof __VUE_SSR_CONTEXT__ < "u" && (l = __VUE_SSR_CONTEXT__), a && a.call(this, l), l && l._registeredComponents && l._registeredComponents.add(d);
}, n._ssrRegister = o) : a && (o = M ? function() {
a.call(
this,
(n.functional ? this.parent : this).$root.$options.shadowRoot
);
} : a), o)
if (n.functional) {
n._injectStyles = o;
var F = n.render;
n.render = function(Y, p) {
return o.call(p), F(Y, p);
};
} else {
var D = n.beforeCreate;
n.beforeCreate = D ? [].concat(D, o) : [o];
}
return {
exports: e,
options: n
};
}
const x = {
props: {
selectedDate: Date,
resetTypedDate: [Date],
format: [String, Function],
translation: Object,
inline: Boolean,
id: String,
name: String,
refName: String,
openDate: Date,
placeholder: String,
inputClass: [String, Object, Array],
disabled: Boolean,
required: Boolean,
typeable: Boolean,
bootstrapStyling: Boolean,
useUtc: Boolean,
isOpen: Boolean
},
data() {
return {
input: null,
typedDate: !1,
utils: u(this.useUtc),
keypressWasTab: !1
};
},
computed: {
formattedValue() {
return this.selectedDate ? this.typedDate ? this.typedDate : typeof this.format == "function" ? this.format(this.selectedDate) : this.utils.formatDate(
new Date(this.selectedDate),
this.format + "",
this.translation
) : null;
},
computedInputClass() {
return this.bootstrapStyling ? typeof this.inputClass == "string" ? [this.inputClass, "form-control"].join(" ") : { "form-control": !0, ...this.inputClass } : this.inputClass;
}
},
watch: {
resetTypedDate() {
this.typedDate = !1;
},
isOpen() {
this.keypressWasTab = !1;
}
},
mounted() {
this.input = this.$el.querySelector("input");
},
methods: {
showCalendar() {
this.$emit("showCalendar");
},
onKeyDown(e) {
this.keypressWasTab = e.keyCode === 9;
},
/**
* Attempt to parse a typed date
* @param {Event} event
*/
parseTypedDate(e) {
if ([
27,
// escape
13
// enter
].includes(e.keyCode) && this.input.blur(), this.typeable) {
const t = Date.parse(this.input.value);
isNaN(t) || (this.typedDate = this.input.value, this.$emit("typedDate", new Date(this.typedDate)));
}
},
/**
* nullify the typed date to defer to regular formatting
* called once the input is blurred
*/
inputBlurred() {
this.typeable && isNaN(Date.parse(this.input.value)) && (this.clearDate(), this.input.value = null, this.typedDate = null), this.keypressWasTab || this.$emit("closeCalendar");
},
/**
* emit a clearDate event
*/
clearDate() {
this.$emit("clearDate");
}
}
}, f = {};
var k = /* @__PURE__ */ h(
x,
S,
$,
!1,
N,
null,
null,
null
);
function N(e) {
for (let t in f)
this[t] = f[t];
}
const V = /* @__PURE__ */ function() {
return k.exports;
}();
var U = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("div", {
directives: [{
name: "show",
rawName: "v-show",
value: e.showDayView,
expression: "showDayView"
}],
staticClass: "vdp-datepicker__calendar vdp-datepicker__calendar--day",
class: [e.calendarClass],
on: {
mousedown: function(i) {
i.preventDefault();
}
}
}, [e._t("beforeCalendarHeader"), s("header", {
staticClass: "vdp-datepicker__header"
}, [s("button", {
staticClass: "prev",
class: {
disabled: e.isLeftNavDisabled
},
attrs: {
type: "button",
"aria-label": e.isRtl ? "<" : ">"
},
on: {
click: function(i) {
e.isRtl ? e.nextMonth() : e.previousMonth();
}
}
}, [e._t(e.isRtl ? "nextButton" : "prevButton")], 2), e.allowedToShowView("month") ? s("button", {
staticClass: "day__month_btn",
class: e.allowedToShowView("month") ? "up" : "",
attrs: {
type: "button"
},
on: {
click: e.showMonthCalendar
}
}, [e.headlineDayFormatter ? [s("span", {
staticClass: "custom-formatted"
}, [e._v(e._s(e.headlineDayFormatter({
pageDate: e.pageDate,
selectedDate: e.selectedDate
})))])] : [s("span", [e._v(e._s(e.isYmd ? e.currYearName : e.currMonthName))]), s("span", [e._v(e._s(e.isYmd ? e.currMonthName : e.currYearName))])]], 2) : s("span", {
staticClass: "day__month_text"
}, [e.headlineDayFormatter ? [s("span", {
staticClass: "custom-formatted"
}, [e._v(e._s(e.headlineDayFormatter({
pageDate: e.pageDate,
selectedDate: e.selectedDate
})))])] : [s("span", [e._v(e._s(e.isYmd ? e.currYearName : e.currMonthName))]), s("span", [e._v(e._s(e.isYmd ? e.currMonthName : e.currYearName))])]], 2), s("button", {
staticClass: "next",
class: {
disabled: e.isRightNavDisabled
},
attrs: {
type: "button",
"aria-label": e.isRtl ? ">" : "<"
},
on: {
click: function(i) {
e.isRtl ? e.previousMonth() : e.nextMonth();
}
}
}, [e._t(e.isRtl ? "prevButton" : "nextButton")], 2)]), s("div", {
staticClass: "vdp-datepicker__pick-buttons vdp-datepicker__pick-buttons--day",
class: e.isRtl ? "flex-rtl" : ""
}, [s("div", {
staticClass: "vdp-datepicker__day-header-background"
}), e._l(e.daysOfWeekDataSource, function(i, a) {
return s("span", {
key: i.timestamp,
staticClass: "cell day-header"
}, [s("span", [e._v(e._s(e.formatDayHeader(i, a)))])]);
}), e.blankDays > 0 ? e._l(e.blankDays, function(i) {
return s("span", {
key: i.timestamp,
staticClass: "cell day blank"
}, [s("span")]);
}) : e._e(), e._l(e.days, function(i) {
return s("button", {
key: i.timestamp,
staticClass: "cell day",
class: e.dayClasses(i),
attrs: {
type: "button"
},
on: {
click: function(a) {
return e.selectDate(i);
}
}
}, [s("span", {
domProps: {
innerHTML: e._s(e.dayCellContent(i))
}
})]);
})], 2)], 2);
}, R = [];
const P = {
components: {},
props: {
dayFormatter: Function,
headlineDayFormatter: Function,
nextDisabled: Function,
prevDisabled: Function,
showDayView: Boolean,
selectedDate: Date,
pageDate: Date,
pageTimestamp: Number,
fullMonthName: Boolean,
allowedToShowView: Function,
dayCellContent: {
type: Function,
default: (e) => e.date
},
disabledDates: Object,
highlighted: Object,
calendarClass: [String, Object, Array],
translation: Object,
isRtl: Boolean,
mondayFirst: Boolean,
useUtc: Boolean,
daysCustomDisplay: Array
},
data() {
return {
utils: u(this.useUtc)
};
},
computed: {
headlineFormatted() {
return "";
},
/**
* Returns an array of day names
* @return {String[]}
*/
daysOfWeek() {
if (this.mondayFirst) {
const e = this.translation.days.slice();
return e.push(e.shift()), e;
}
return this.translation.days;
},
daysOfWeekDataSource() {
var e;
return ((e = this.daysCustomDisplay) == null ? void 0 : e.length) === 7 ? this.daysCustomDisplay : this.daysOfWeek;
},
/**
* Returns the day number of the week less one for the first of the current month
* Used to show amount of empty cells before the first in the day calendar layout
* @return {Number}
*/
blankDays() {
const e = this.pageDate;
let t = this.useUtc ? new Date(Date.UTC(e.getUTCFullYear(), e.getUTCMonth(), 1)) : new Date(
e.getFullYear(),
e.getMonth(),
1,
e.getHours(),
e.getMinutes()
);
return this.mondayFirst ? this.utils.getDay(t) > 0 ? this.utils.getDay(t) - 1 : 6 : this.utils.getDay(t);
},
/**
* @return {Object[]}
*/
days() {
const e = this.pageDate;
let t = [], s = this.useUtc ? new Date(Date.UTC(e.getUTCFullYear(), e.getUTCMonth(), 1)) : new Date(
e.getFullYear(),
e.getMonth(),
1,
e.getHours(),
e.getMinutes()
), i = this.utils.daysInMonth(
this.utils.getFullYear(s),
this.utils.getMonth(s)
);
for (let a = 0; a < i; a++)
t.push({
date: this.utils.getDate(s),
timestamp: s.getTime(),
isSelected: this.isSelectedDate(s),
isDisabled: this.isDisabledDate(s),
isHighlighted: this.isHighlightedDate(s),
isHighlightStart: this.isHighlightStart(s),
isHighlightEnd: this.isHighlightEnd(s),
isToday: this.utils.compareDates(s, /* @__PURE__ */ new Date()),
isWeekend: this.utils.getDay(s) === 0 || this.utils.getDay(s) === 6,
isSaturday: this.utils.getDay(s) === 6,
isSunday: this.utils.getDay(s) === 0
}), this.utils.setDate(s, this.utils.getDate(s) + 1);
return t;
},
/**
* Gets the name of the month the current page is on
* @return {String}
*/
currMonthName() {
const e = this.fullMonthName ? this.translation.months : this.translation.monthsAbbr;
return this.utils.getMonthNameAbbr(
this.utils.getMonth(this.pageDate),
e
);
},
/**
* Gets the name of the year that current page is on
* @return {Number}
*/
currYearName() {
const e = this.translation.yearSuffix;
return `${this.utils.getFullYear(this.pageDate)}${e}`;
},
/**
* Is this translation using year/month/day format?
* @return {Boolean}
*/
isYmd() {
return this.translation.ymd && this.translation.ymd === !0;
},
/**
* Is the left hand navigation button disabled?
* @return {Boolean}
*/
isLeftNavDisabled() {
return this.isRtl ? this.isNextMonthDisabled(this.pageTimestamp) : this.isPreviousMonthDisabled(this.pageTimestamp);
},
/**
* Is the right hand navigation button disabled?
* @return {Boolean}
*/
isRightNavDisabled() {
return this.isRtl ? this.isPreviousMonthDisabled(this.pageTimestamp) : this.isNextMonthDisabled(this.pageTimestamp);
}
},
methods: {
formatDayHeader(e, t) {
return this.dayFormatter ? this.dayFormatter(e, t) : e;
},
selectDate(e) {
if (e.isDisabled)
return this.$emit("selectedDisabled", e), !1;
this.$emit("selectDate", e);
},
/**
* @return {Number}
*/
getPageMonth() {
return this.utils.getMonth(this.pageDate);
},
/**
* Emit an event to show the month picker
*/
showMonthCalendar() {
this.$emit("showMonthCalendar");
},
/**
* Change the page month
* @param {Number} incrementBy
*/
changeMonth(e) {
let t = this.pageDate;
this.utils.setMonth(t, this.utils.getMonth(t) + e), this.$emit("changedMonth", t);
},
/**
* Decrement the page month
*/
previousMonth() {
this.isPreviousMonthDisabled() || this.changeMonth(-1);
},
/**
* Is the previous month disabled?
* @return {Boolean}
*/
isPreviousMonthDisabled() {
if (this.prevDisabled) {
let t = this.prevDisabled({ view: "day" });
if (t != null)
return t;
}
if (!this.disabledDates || !this.disabledDates.to)
return !1;
let e = this.pageDate;
return this.utils.getMonth(this.disabledDates.to) >= this.utils.getMonth(e) && this.utils.getFullYear(this.disabledDates.to) >= this.utils.getFullYear(e);
},
/**
* Increment the current page month
*/
nextMonth() {
this.isNextMonthDisabled() || this.changeMonth(1);
},
/**
* Is the next month disabled?
* @return {Boolean}
*/
isNextMonthDisabled() {
if (this.nextDisabled) {
let t = this.nextDisabled({ view: "day" });
if (t != null)
return t;
}
if (!this.disabledDates || !this.disabledDates.from)
return !1;
let e = this.pageDate;
return this.utils.getMonth(this.disabledDates.from) <= this.utils.getMonth(e) && this.utils.getFullYear(this.disabledDates.from) <= this.utils.getFullYear(e);
},
/**
* Whether a day is selected
* @param {Date}
* @return {Boolean}
*/
isSelectedDate(e) {
return this.selectedDate && this.utils.compareDates(this.selectedDate, e);
},
/**
* Whether a day is disabled
* @param {Date}
* @return {Boolean}
*/
isDisabledDate(e) {
let t = !1;
return typeof this.disabledDates > "u" ? !1 : (typeof this.disabledDates.dates < "u" && this.disabledDates.dates.forEach((s) => {
if (this.utils.compareDates(e, s))
return t = !0, !0;
}), typeof this.disabledDates.to < "u" && this.disabledDates.to && e < this.disabledDates.to && (t = !0), typeof this.disabledDates.from < "u" && this.disabledDates.from && e > this.disabledDates.from && (t = !0), typeof this.disabledDates.ranges < "u" && this.disabledDates.ranges.forEach((s) => {
if (typeof s.from < "u" && s.from && typeof s.to < "u" && s.to && e < s.to && e > s.from)
return t = !0, !0;
}), typeof this.disabledDates.days < "u" && this.disabledDates.days.indexOf(this.utils.getDay(e)) !== -1 && (t = !0), typeof this.disabledDates.daysOfMonth < "u" && this.disabledDates.daysOfMonth.indexOf(this.utils.getDate(e)) !== -1 && (t = !0), typeof this.disabledDates.customPredictor == "function" && this.disabledDates.customPredictor(e) && (t = !0), t);
},
/**
* Whether a day is highlighted (only if it is not disabled already except when highlighted.includeDisabled is true)
* @param {Date}
* @return {Boolean}
*/
isHighlightedDate(e) {
if (!(this.highlighted && this.highlighted.includeDisabled) && this.isDisabledDate(e))
return !1;
let t = !1;
return typeof this.highlighted > "u" ? !1 : (typeof this.highlighted.dates < "u" && this.highlighted.dates.forEach((s) => {
if (this.utils.compareDates(e, s))
return t = !0, !0;
}), this.isDefined(this.highlighted.from) && this.isDefined(this.highlighted.to) && (t = e >= this.highlighted.from && e <= this.highlighted.to), typeof this.highlighted.days < "u" && this.highlighted.days.indexOf(this.utils.getDay(e)) !== -1 && (t = !0), typeof this.highlighted.daysOfMonth < "u" && this.highlighted.daysOfMonth.indexOf(this.utils.getDate(e)) !== -1 && (t = !0), typeof this.highlighted.customPredictor == "function" && this.highlighted.customPredictor(e) && (t = !0), t);
},
dayClasses(e) {
return {
selected: e.isSelected,
disabled: e.isDisabled,
highlighted: e.isHighlighted,
today: e.isToday,
weekend: e.isWeekend,
sat: e.isSaturday,
sun: e.isSunday,
"highlight-start": e.isHighlightStart,
"highlight-end": e.isHighlightEnd
};
},
/**
* Whether a day is highlighted and it is the first date
* in the highlighted range of dates
* @param {Date}
* @return {Boolean}
*/
isHighlightStart(e) {
return this.isHighlightedDate(e) && this.highlighted.from instanceof Date && this.utils.getFullYear(this.highlighted.from) === this.utils.getFullYear(e) && this.utils.getMonth(this.highlighted.from) === this.utils.getMonth(e) && this.utils.getDate(this.highlighted.from) === this.utils.getDate(e);
},
/**
* Whether a day is highlighted and it is the first date
* in the highlighted range of dates
* @param {Date}
* @return {Boolean}
*/
isHighlightEnd(e) {
return this.isHighlightedDate(e) && this.highlighted.to instanceof Date && this.utils.getFullYear(this.highlighted.to) === this.utils.getFullYear(e) && this.utils.getMonth(this.highlighted.to) === this.utils.getMonth(e) && this.utils.getDate(this.highlighted.to) === this.utils.getDate(e);
},
/**
* Helper
* @param {mixed} prop
* @return {Boolean}
*/
isDefined(e) {
return typeof e < "u" && e;
}
}
}, m = {};
var B = /* @__PURE__ */ h(
P,
U,
R,
!1,
O,
null,
null,
null
);
function O(e) {
for (let t in m)
this[t] = m[t];
}
const I = /* @__PURE__ */ function() {
return B.exports;
}();
var H = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("div", {
directives: [{
name: "show",
rawName: "v-show",
value: e.showMonthView,
expression: "showMonthView"
}],
staticClass: "vdp-datepicker__calendar vdp-datepicker__calendar--month",
class: [e.calendarClass],
on: {
mousedown: function(i) {
i.preventDefault();
}
}
}, [e._t("beforeCalendarHeader"), s("header", {
staticClass: "vdp-datepicker__header"
}, [s("button", {
staticClass: "prev",
class: {
disabled: e.isLeftNavDisabled
},
attrs: {
type: "button",
"aria-label": e.isRtl ? "<" : ">"
},
on: {
click: function(i) {
e.isRtl ? e.nextYear() : e.previousYear();
}
}
}, [e._t(e.isRtl ? "nextButton" : "prevButton")], 2), e.allowedToShowView("year") ? s("button", {
staticClass: "month__year_btn",
class: e.allowedToShowView("year") ? "up" : "",
attrs: {
type: "button"
},
on: {
click: e.showYearCalendar
}
}, [e.headlineMonthFormatter ? s("p", {
staticClass: "custom-formatted"
}, [e._v(" " + e._s(e.headlineMonthFormatter({
pageDate: e.pageDate,
selectedDate: e.selectedDate,
pageYearName: e.pageYearName
})) + " ")]) : s("p", [e._v(e._s(e.pageYearName))])]) : s("span", {
staticClass: "month__year_text"
}, [e.headlineMonthFormatter ? s("p", {
staticClass: "custom-formatted"
}, [e._v(" " + e._s(e.headlineMonthFormatter({
pageDate: e.pageDate,
selectedDate: e.selectedDate,
pageYearName: e.pageYearName
})) + " ")]) : s("p", [e._v(e._s(e.pageYearName))])]), s("button", {
staticClass: "next",
class: {
disabled: e.isRightNavDisabled
},
attrs: {
type: "button",
"aria-label": e.isRtl ? ">" : "<"
},
on: {
click: function(i) {
e.isRtl ? e.previousYear() : e.nextYear();
}
}
}, [e._t(e.isRtl ? "prevButton" : "nextButton")], 2)]), s("div", {
staticClass: "vdp-datepicker__pick-buttons vdp-datepicker__pick-buttons--month"
}, e._l(e.months, function(i, a) {
return s("button", {
key: i.timestamp,
staticClass: "cell month",
class: {
selected: i.isSelected,
disabled: i.isDisabled
},
attrs: {
type: "button"
},
on: {
click: function(r) {
return r.stopPropagation(), e.selectMonth(i);
}
}
}, [e._v(" " + e._s(e.format(i.month, a)) + " ")]);
}), 0)], 2);
}, j = [];
const E = {
props: {
monthFormatter: Function,
headlineMonthFormatter: Function,
nextDisabled: Function,
prevDisabled: Function,
showMonthView: Boolean,
selectedDate: Date,
pageDate: Date,
pageTimestamp: Number,
disabledDates: Object,
calendarClass: [String, Object, Array],
translation: Object,
isRtl: Boolean,
allowedToShowView: Function,
useUtc: Boolean,
monthsCustomDisplay: Array
},
data() {
return {
utils: u(this.useUtc)
};
},
computed: {
months() {
var a;
const e = this.pageDate;
let t = [], s = this.useUtc ? new Date(Date.UTC(e.getUTCFullYear(), 0, e.getUTCDate())) : new Date(
e.getFullYear(),
0,
e.getDate(),
e.getHours(),
e.getMinutes()
), i = ((a = this.monthsCustomDisplay) == null ? void 0 : a.length) === 12 ? this.monthsCustomDisplay : this.translation.months;
for (let r = 0; r <= 11; r++)
t.push({
month: this.utils.getMonthName(r, i),
timestamp: s.getTime(),
isSelected: this.isSelectedMonth(s),
isDisabled: this.isDisabledMonth(s)
}), this.utils.setMonth(s, this.utils.getMonth(s) + 1);
return t;
},
/**
* Get year name on current page.
* @return {String}
*/
pageYearName() {
const e = this.translation.yearSuffix;
return `${this.utils.getFullYear(this.pageDate)}${e}`;
},
/**
* Is the left hand navigation disabled
* @return {Boolean}
*/
isLeftNavDisabled() {
return this.isRtl ? this.isNextYearDisabled(this.pageTimestamp) : this.isPreviousYearDisabled(this.pageTimestamp);
},
/**
* Is the right hand navigation disabled
* @return {Boolean}
*/
isRightNavDisabled() {
return this.isRtl ? this.isPreviousYearDisabled(this.pageTimestamp) : this.isNextYearDisabled(this.pageTimestamp);
}
},
methods: {
format(e, t) {
return this.monthFormatter ? this.monthFormatter(e, t) : e;
},
/**
* Emits a selectMonth event
* @param {Object} month
*/
selectMonth(e) {
if (e.isDisabled)
return !1;
this.$emit("selectMonth", e);
},
/**
* Changes the year up or down
* @param {Number} incrementBy
*/
changeYear(e) {
let t = this.pageDate;
this.utils.setFullYear(t, this.utils.getFullYear(t) + e), this.$emit("changedYear", t);
},
/**
* Decrements the year
*/
previousYear() {
this.isPreviousYearDisabled() || this.changeYear(-1);
},
/**
* Checks if the previous year is disabled or not
* @return {Boolean}
*/
isPreviousYearDisabled() {
if (this.prevDisabled) {
let e = this.prevDisabled({ view: "month" });
if (e != null)
return e;
}
return !this.disabledDates || !this.disabledDates.to ? !1 : this.utils.getFullYear(this.disabledDates.to) >= this.utils.getFullYear(this.pageDate);
},
/**
* Increments the year
*/
nextYear() {
this.isNextYearDisabled() || this.changeYear(1);
},
/**
* Checks if the next year is disabled or not
* @return {Boolean}
*/
isNextYearDisabled() {
if (this.nextDisabled) {
let e = this.nextDisabled({ view: "month" });
if (e != null)
return e;
}
return !this.disabledDates || !this.disabledDates.from ? !1 : this.utils.getFullYear(this.disabledDates.from) <= this.utils.getFullYear(this.pageDate);
},
/**
* Emits an event that shows the year calendar
*/
showYearCalendar() {
this.$emit("showYearCalendar");
},
/**
* Whether the selected date is in this month
* @param {Date}
* @return {Boolean}
*/
isSelectedMonth(e) {
return this.selectedDate && this.utils.getFullYear(this.selectedDate) === this.utils.getFullYear(e) && this.utils.getMonth(this.selectedDate) === this.utils.getMonth(e);
},
/**
* Whether a month is disabled
* @param {Date}
* @return {Boolean}
*/
isDisabledMonth(e) {
let t = !1;
return typeof this.disabledDates > "u" ? !1 : (typeof this.disabledDates.to < "u" && this.disabledDates.to && (this.utils.getMonth(e) < this.utils.getMonth(this.disabledDates.to) && this.utils.getFullYear(e) <= this.utils.getFullYear(this.disabledDates.to) || this.utils.getFullYear(e) < this.utils.getFullYear(this.disabledDates.to)) && (t = !0), typeof this.disabledDates.from < "u" && this.disabledDates.from && (this.utils.getMonth(e) > this.utils.getMonth(this.disabledDates.from) && this.utils.getFullYear(e) >= this.utils.getFullYear(this.disabledDates.from) || this.utils.getFullYear(e) > this.utils.getFullYear(this.disabledDates.from)) && (t = !0), typeof this.disabledDates.customPredictor == "function" && this.disabledDates.customPredictor(e) && (t = !0), t);
}
}
}, b = {};
var A = /* @__PURE__ */ h(
E,
H,
j,
!1,
L,
null,
null,
null
);
function L(e) {
for (let t in b)
this[t] = b[t];
}
const W = /* @__PURE__ */ function() {
return A.exports;
}();
var q = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("div", {
directives: [{
name: "show",
rawName: "v-show",
value: e.showYearView,
expression: "showYearView"
}],
staticClass: "vdp-datepicker__calendar vdp-datepicker__calendar--year",
class: [e.calendarClass],
on: {
mousedown: function(i) {
i.preventDefault();
}
}
}, [e._t("beforeCalendarHeader"), s("header", {
staticClass: "vdp-datepicker__header"
}, [s("button", {
staticClass: "prev",
class: {
disabled: e.isLeftNavDisabled
},
attrs: {
type: "button",
"aria-label": "<"
},
on: {
click: function(i) {
e.isRtl ? e.nextDecade() : e.previousDecade();
}
}
}, [e._t("prevButton")], 2), e.headlineYearFormatter ? s("p", {
staticClass: "custom-formatted page-decade"
}, [e._v(" " + e._s(e.headlineYearFormatter({
pageDate: e.pageDate,
selectedDate: e.selectedDate,
getPageDecade: e.getPageDecade
})) + " ")]) : s("p", {
staticClass: "page-decade"
}, [e._v(e._s(e.getPageDecade))]), s("button", {
staticClass: "next",
class: {
disabled: e.isRightNavDisabled
},
attrs: {
type: "button",
"aria-label": ">"
},
on: {
click: function(i) {
e.isRtl ? e.previousDecade() : e.nextDecade();
}
}
}, [e._t("nextButton")], 2)]), s("div", {
staticClass: "vdp-datepicker__pick-buttons vdp-datepicker__pick-buttons--year"
}, e._l(e.years, function(i) {
return s("button", {
key: i.timestamp,
staticClass: "cell year",
class: {
selected: i.isSelected,
disabled: i.isDisabled
},
attrs: {
type: "button"
},
on: {
click: function(a) {
return a.stopPropagation(), e.selectYear(i);
}
}
}, [s("span", [e._v(e._s(e.format(i.year)))])]);
}), 0)], 2);
}, J = [];
const K = {
props: {
yearFormatter: Function,
headlineYearFormatter: Function,
nextDisabled: Function,
prevDisabled: Function,
showYearView: Boolean,
selectedDate: Date,
pageDate: Date,
pageTimestamp: Number,
disabledDates: Object,
highlighted: Object,
calendarClass: [String, Object, Array],
translation: Object,
isRtl: Boolean,
allowedToShowView: Function,
useUtc: Boolean
},
data() {
return {
utils: u(this.useUtc)
};
},
computed: {
years() {
const e = this.pageDate;
let t = [], s = this.useUtc ? new Date(
Date.UTC(
Math.floor(e.getUTCFullYear() / 10) * 10,
e.getUTCMonth(),
e.getUTCDate()
)
) : new Date(
Math.floor(e.getFullYear() / 10) * 10,
e.getMonth(),
e.getDate(),
e.getHours(),
e.getMinutes()
);
for (let i = 0; i < 10; i++)
t.push({
year: this.utils.getFullYear(s),
timestamp: s.getTime(),
isSelected: this.isSelectedYear(s),
isDisabled: this.isDisabledYear(s)
}), this.utils.setFullYear(s, this.utils.getFullYear(s) + 1);
return t;
},
/**
* @return {String}
*/
getPageDecade() {
const e = Math.floor(this.utils.getFullYear(this.pageDate) / 10) * 10, t = e + 9, s = this.translation.yearSuffix;
return `${e} - ${t}${s}`;
},
/**
* Is the left hand navigation button disabled?
* @return {Boolean}
*/
isLeftNavDisabled() {
return this.isRtl ? this.isNextDecadeDisabled(this.pageTimestamp) : this.isPreviousDecadeDisabled(this.pageTimestamp);
},
/**
* Is the right hand navigation button disabled?
* @return {Boolean}
*/
isRightNavDisabled() {
return this.isRtl ? this.isPreviousDecadeDisabled(this.pageTimestamp) : this.isNextDecadeDisabled(this.pageTimestamp);
}
},
methods: {
format(e) {
return this.yearFormatter ? this.yearFormatter(e) : e;
},
selectYear(e) {
if (e.isDisabled)
return !1;
this.$emit("selectYear", e);
},
changeYear(e) {
let t = this.pageDate;
this.utils.setFullYear(t, this.utils.getFullYear(t) + e), this.$emit("changedDecade", t);
},
previousDecade() {
if (this.isPreviousDecadeDisabled())
return !1;
this.changeYear(-10);
},
isPreviousDecadeDisabled() {
if (this.prevDisabled) {
let s = this.prevDisabled({ view: "year" });
if (s != null)
return s;
}
if (!this.disabledDates || !this.disabledDates.to)
return !1;
const e = this.utils.getFullYear(this.disabledDates.to), t = Math.floor(this.utils.getFullYear(this.pageDate) / 10) * 10 - 1;
return e > t;
},
nextDecade() {
if (this.isNextDecadeDisabled())
return !1;
this.changeYear(10);
},
isNextDecadeDisabled() {
if (this.nextDisabled) {
let s = this.nextDisabled({ view: "year" });
if (s != null)
return s;
}
if (!this.disabledDates || !this.disabledDates.from)
return !1;
const e = this.utils.getFullYear(this.disabledDates.from), t = Math.ceil(this.utils.getFullYear(this.pageDate) / 10) * 10;
return e < t;
},
/**
* Whether the selected date is in this year
* @param {Date}
* @return {Boolean}
*/
isSelectedYear(e) {
return this.selectedDate && this.utils.getFullYear(this.selectedDate) === this.utils.getFullYear(e);
},
/**
* Whether a year is disabled
* @param {Date}
* @return {Boolean}
*/
isDisabledYear(e) {
let t = !1;
return typeof this.disabledDates > "u" || !this.disabledDates ? !1 : (typeof this.disabledDates.to < "u" && this.disabledDates.to && this.utils.getFullYear(e) < this.utils.getFullYear(this.disabledDates.to) && (t = !0), typeof this.disabledDates.from < "u" && this.disabledDates.from && this.utils.getFullYear(e) > this.utils.getFullYear(this.disabledDates.from) && (t = !0), typeof this.disabledDates.customPredictor == "function" && this.disabledDates.customPredictor(e) && (t = !0), t);
}
}
}, y = {};
var X = /* @__PURE__ */ h(
K,
q,
J,
!1,
Z,
null,
null,
null
);
function Z(e) {
for (let t in y)
this[t] = y[t];
}
const z = /* @__PURE__ */ function() {
return X.exports;
}();
var G = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("svg", {
attrs: {
width: "14",
height: "14",
viewBox: "0 0 14 14",
fill: "none"
}
}, [s("path", {
attrs: {
"fill-rule": "evenodd",
"clip-rule": "evenodd",
d: "M9.0016 0.71811C9.37534 0.32692 10 0.32692 10.3737 0.71811C10.7241 1.08485 10.7241 1.6623 10.3737 2.02904L5.62456 7L10.3737 11.971C10.7241 12.3377 10.7241 12.9152 10.3737 13.2819C10 13.6731 9.37534 13.6731 9.0016 13.2819L2.99997 7L9.0016 0.71811Z",
fill: "currentColor"
}
})]);
}, Q = [];
const ee = {}, _ = {};
var te = /* @__PURE__ */ h(
ee,
G,
Q,
!1,
se,
null,
null,
null
);
function se(e) {
for (let t in _)
this[t] = _[t];
}
const ie = /* @__PURE__ */ function() {
return te.exports;
}();
var ae = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("svg", {
attrs: {
width: "14",
height: "14",
viewBox: "0 0 14 14",
fill: "none"
}
}, [s("path", {
attrs: {
"fill-rule": "evenodd",
"clip-rule": "evenodd",
d: "M4.9984 0.71811C4.62466 0.32692 3.99999 0.32692 3.62625 0.71811C3.27587 1.08485 3.27587 1.6623 3.62625 2.02904L8.37544 7L3.62625 11.971C3.27587 12.3377 3.27587 12.9152 3.62625 13.2819C3.99999 13.6731 4.62466 13.6731 4.9984 13.2819L11 7L4.9984 0.71811Z",
fill: "currentColor"
}
})]);
}, ne = [];
const re = {}, w = {};
var le = /* @__PURE__ */ h(
re,
ae,
ne,
!1,
oe,
null,
null,
null
);
function oe(e) {
for (let t in w)
this[t] = w[t];
}
const he = /* @__PURE__ */ function() {
return le.exports;
}();
var ue = function() {
var e = this, t = e.$createElement, s = e._self._c || t;
return s("div", {
staticClass: "vdp-datepicker",
class: [e.wrapperClass],
attrs: {
"data-rtl": !!e.isRtl + "",
"data-inline": !!e.isInline + "",
"data-min-height": !!e.ensureMinHeight + "",
"data-is-open": !!e.isOpen + ""
}
}, [s("DateInput", {
attrs: {
id: e.id,
selectedDate: e.selectedDate,
resetTypedDate: e.resetTypedDate,
format: e.format,
translation: e.translation,
inline: e.inline,
name: e.name,
refName: e.refName,
openDate: e.openDate,
placeholder: e.placeholder,
inputClass: e.inputClass,
typeable: e.typeable,
disabled: e.disabled,
required: e.required,
bootstrapStyling: e.bootstrapStyling,
useUtc: e.useUtc,
isOpen: e.isOpen
},
on: {
showCalendar: e.showCalendar,
closeCalendar: e.close,
typedDate: e.setTypedDate,
clearDate: e.clearDate
}
}, [e._t("afterDateInput", null, {
slot: "afterDateInput"
})], 2), s("div", {
staticClass: "vdp-datepicker__container"
}, [s("div", {
staticClass: "vdp-datepicker__picker"
}, [e.allowedToShowView("day") ? s("PickerDay", {
attrs: {
value: e.value,
dayFormatter: e.dayFormatter,
headlineDayFormatter: e.headlineDayFormatter,
prevDisabled: e.prevDisabled,
nextDisabled: e.nextDisabled,
pageDate: e.pageDate,
selectedDate: e.selectedDate,
showDayView: e.showDayView,
fullMonthName: e.fullMonthName,
allowedToShowView: e.allowedToShowView,
disabledDates: e.disabledDates,
highlighted: e.highlighted,
calendarClass: e.calendarClass,
translation: e.translation,
pageTimestamp: e.pageTimestamp,
isRtl: e.isRtl,
mondayFirst: e.mondayFirst,
dayCellContent: e.dayCellContent,
useUtc: e.useUtc,
daysCustomDisplay: e.daysCustomDisplay
},
on: {
changedMonth: e.handleChangedMonthFromDayPicker,
selectDate: e.selectDate,
showMonthCalendar: e.showMonthCalendar,
selectedDisabled: e.selectDisabledDate
}
}, [e._t("beforeCalendarHeader", null, {
slot: "beforeCalendarHeader"
}), e._t("prevButton", function() {
return [s("IconLeft")];
}, {
slot: "prevButton"
}), e._t("nextButton", function() {
return [s("IconRight")];
}, {
slot: "nextButton"
})], 2) : e._e(), e.allowedToShowView("month") ? s("PickerMonth", {
attrs: {
value: e.value,
monthFormatter: e.monthFormatter,
headlineMonthFormatter: e.headlineMonthFormatter,
prevDisabled: e.prevDisabled,
nextDisabled: e.nextDisabled,
pageDate: e.pageDate,
selectedDate: e.selectedDate,
showMonthView: e.showMonthView,
allowedToShowView: e.allowedToShowView,
disabledDates: e.disabledDates,
calendarClass: e.calendarClass,
translation: e.translation,
isRtl: e.isRtl,
useUtc: e.useUtc,
monthsCustomDisplay: e.monthsCustomDisplay
},
on: {
selectMonth: e.selectMonth,
showYearCalendar: e.showYearCalendar,
changedYear: e.setPageDate
}
}, [e._t("beforeCalendarHeader", null, {
slot: "beforeCalendarHeader"
}), e._t("prevButton", function() {
return [s("IconLeft")];
}, {
slot: "prevButton"
}), e._t("nextButton", function() {
return [s("IconRight")];
}, {
slot: "nextButton"
})], 2) : e._e(), e.allowedToShowView("year") ? s("PickerYear", {
attrs: {
value: e.value,
yearFormatter: e.yearFormatter,
headlineYearFormatter: e.headlineYearFormatter,
prevDisabled: e.prevDisabled,
nextDisabled: e.nextDisabled,
pageDate: e.pageDate,
selectedDate: e.selectedDate,
showYearView: e.showYearView,
allowedToShowView: e.allowedToShowView,
disabledDates: e.disabledDates,
calendarClass: e.calendarClass,
translation: e.translation,
isRtl: e.isRtl,
useUtc: e.useUtc
},
on: {
selectYear: e.selectYear,
changedDecade: e.setPageDate
}
}, [e._t("beforeCalendarHeader", null, {
slot: "beforeCalendarHeader"
}), e._t("prevButton", function() {
return [s("IconLeft")];
}, {
slot: "prevButton"
}), e._t("nextButton", function() {
return [s("IconRight")];
}, {
slot: "nextButton"
})], 2) : e._e()], 1)])], 1);
}, de = [];
const ce = {
components: {
DateInput: V,
PickerDay: I,
PickerMonth: W,
PickerYear: z,
IconLeft: ie,
IconRight: he
},
props: {
value: {
validator: (e) => g.validateDateInput(e)
},
name: String,
refName: String,
id: String,
format: {
type: [String, Function],
default: "dd MMM yyyy"
},
language: {
type: Object,
default: () => c
},
openDate: {
validator: (e) => g.validateDateInput(e)
},
dayCellContent: Function,
dayFormatter: Function,
monthFormatter: Function,
yearFormatter: Function,
headlineDayFormatter: Function,
headlineMonthFormatter: Function,
headlineYearFormatter: Function,
nextDisabled: Function,
prevDisabled: Function,
fullMonthName: Boolean,
disabledDates: Object,
highlighted: Object,
placeholder: String,
inline: Boolean,
calendarClass: [String, Object, Array],
inputClass: [String, Object, Array],
wrapperClass: [String, Object, Array],
mondayFirst: Boolean,
ensureMinHeight: Boolean,
bootstrapStyling: Boolean,
initialView: String,
disabled: Boolean,
required: Boolean,
typeable: Boolean,
useUtc: Boolean,
useRtl: {
type: Boolean,
default: null
},
minimumView: {
type: String,
default: "day"
},
maximumView: {
type: String,
default: "year"
},
daysCustomDisplay: Array,
monthsCustomDisplay: Array
},
data() {
const e = this.openDate ? new Date(this.openDate) : /* @__PURE__ */ new Date(), t = u(this.useUtc);
return {
/*
* Vue cannot observe changes to a Date Object so date must be stored as a timestamp
* This represents the first day of the current viewing month
* {Number}
*/
pageTimestamp: t.setDate(e, 1),
/*
* Selected Date
* {Date}
*/
selectedDate: null,
/*
* Flags to show calendar views
* {Boolean}
*/
showDayView: !1,
showMonthView: !1,
showYearView: !1,
/*
* Positioning
*/
calendarHeight: 0,
resetTypedDate: /* @__PURE__ */ new Date(),
utils: t
};
},
computed: {
computedInitialView() {
return this.initialView ? this.initialView : this.minimumView;
},
pageDate() {
return new Date(this.pageTimestamp);
},
translation() {
return this.language || c;
},
isOpen() {
return this.showDayView || this.showMonthView || this.showYearView;
},
isInline() {
return !!this.inline;
},
isRtl() {
return this.useRtl != null ? this.useRtl : this.translation.rtl === !0;
}
},
watch: {
value(e) {
this.setValue(e);
},
openDate() {
this.setPageDate();
},
initialView() {
this.setInitialView();
}
},
mounted() {
this.init();
},
methods: {
/**
* Called in the event that the user navigates to date pages and
* closes the picker without selecting a date.
*/
resetDefaultPageDate() {
if (this.selectedDate === null) {
this.setPageDate();
return;
}
this.setPageDate(this.selectedDate);
},
/**
* Effectively a toggle to show/hide the calendar
* @return {mixed}
*/
showCalendar() {
if (this.disabled || this.isInline)
return !1;
if (this.isOpen)
return this.close(!0);
this.setInitialView();
},
/**
* Sets the initial picker page view: day, month or year
*/
setInitialView() {
const e = this.computedInitialView;
if (!this.allowedToShowView(e))
throw new Error(
`initialView '${this.initialView}' cannot be rendered based on minimum '${this.minimumView}' and maximum '${this.maximumView}'`
);
switch (e) {
case "year":
this.showYearCalendar();
break;
case "month":
this.showMonthCalendar();
break;
default:
this.showDayCalendar();
break;
}
},
/**
* Are we allowed to show a specific picker view?
* @param {String} view
* @return {Boolean}
*/
allowedToShowView(e) {
const t = ["day", "month", "year"], s = t.indexOf(this.minimumView), i = t.indexOf(this.maximumView), a = t.indexOf(e);
return a >= s && a <= i;
},
/**
* Show the day picker
* @return {Boolean}
*/
showDayCalendar() {
return this.allowedToShowView("day") ? (this.close(), this.showDayView = !0, !0) : !1;
},
/**
* Show the month picker
* @return {Boolean}
*/
showMonthCalendar() {
return this.allowedToShowView("month") ? (this.close(), this.showMonthView = !0, !0) : !1;
},
/**
* Show the year picker
* @return {Boolean}
*/
showYearCalendar() {
return this.allowedToShowView("year") ? (this.close(), this.showYearView = !0, !0) : !1;
},
/**
* Set the selected date
* @param {Number} timestamp
*/
setDate(e) {
const t = new Date(e);
this.selectedDate = t, this.setPageDate(t), this.$emit("selected", t), this.$emit("input", t);
},
/**
* Clear the selected date
*/
clearDate() {
this.selectedDate = null, this.setPageDate(), this.$emit("selected", null), this.$emit("input", null), this.$emit("cleared");
},
/**
* @param {Object} date
*/
selectDate(e) {
this.setDate(e.timestamp), this.isInline || this.close(!0), this.resetTypedDate = /* @__PURE__ */ new Date();
},
/**
* @param {Object} date
*/
selectDisabledDate(e) {
this.$emit("selectedDisabled", e);
},
/**
* @param {Object} month
*/
selectMonth(e) {
const t = new Date(e.timestamp);
this.allowedToShowView("day") ? (this.setPageDate(t), this.$emit("changedMonth", e), this.showDayCalendar()) : this.selectDate(e);
},
/**
* @param {Object} year
*/
selectYear(e) {
const t = new Date(e.timestamp);
this.allowedToShowView("month") ? (this.setPageDate(t), this.$emit("changedYear", e), this.showMonthCalendar()) : this.selectDate(e);
},
/**
* Set the datepicker value
* @param {Date|String|Number|null} date
*/
setValue(e) {
if (typeof e == "string" || typeof e == "number") {
let t = new Date(e);
e = isNaN(t.valueOf()) ? null : t;
}
if (!e) {
this.setPageDate(), this.selectedDate = null;
return;
}
this.selectedDate = e, this.setPageDate(e);
},
/**
* Sets the date that the calendar should open on
*/
setPageDate(e) {
e || (this.openDate ? e = new Date(this.openDate) : e = /* @__PURE__ */ new Date()), this.pageTimestamp = this.utils.setDate(new Date(e), 1);
},
/**
* Handles a month change from the day picker
*/
handleChangedMonthFromDayPicker(e) {
this.setPageDate(e), this.$emit("changedMonth", e);
},
/**
* Set the date from a typedDate event
*/
setTypedDate(e) {
this.setDate(e.getTime());
},
/**
* Close all calendar layers
* @param {Boolean} emitEvent - emit close event
*/
close(e) {
this.showDayView = this.showMonthView = this.showYearView = !1, this.isInline || (e && this.$emit("closed"), document.removeEventListener("click", this.clickOutside, !1));
},
/**
* Initiate the component
*/
init() {
this.value && this.setValue(this.value), this.isInline && this.setInitialView();
}
}
}, v = {};
var De = /* @__PURE__ */ h(
ce,
ue,
de,
!1,
pe,
null,
null,
null
);
function pe(e) {
for (let t in v)
this[t] = v[t];
}
const ge = /* @__PURE__ */ function() {
return De.exports;
}();
export {
ge as DatePicker,
T as Language
};