flatpickr
Version:
A lightweight, powerful javascript datetime picker
1,163 lines (1,148 loc) • 124 kB
JavaScript
/* flatpickr v4.6.13, @license MIT */
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.flatpickr = factory());
}(this, (function () { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
var __assign = function() {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __spreadArrays() {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
}
var HOOKS = [
"onChange",
"onClose",
"onDayCreate",
"onDestroy",
"onKeyDown",
"onMonthChange",
"onOpen",
"onParseConfig",
"onReady",
"onValueUpdate",
"onYearChange",
"onPreCalendarPosition",
];
var defaults = {
_disable: [],
allowInput: false,
allowInvalidPreload: false,
altFormat: "F j, Y",
altInput: false,
altInputClass: "form-control input",
animate: typeof window === "object" &&
window.navigator.userAgent.indexOf("MSIE") === -1,
ariaDateFormat: "F j, Y",
autoFillDefaultTime: true,
clickOpens: true,
closeOnSelect: true,
conjunction: ", ",
dateFormat: "Y-m-d",
defaultHour: 12,
defaultMinute: 0,
defaultSeconds: 0,
disable: [],
disableMobile: false,
enableSeconds: false,
enableTime: false,
errorHandler: function (err) {
return typeof console !== "undefined" && console.warn(err);
},
getWeek: function (givenDate) {
var date = new Date(givenDate.getTime());
date.setHours(0, 0, 0, 0);
// Thursday in current week decides the year.
date.setDate(date.getDate() + 3 - ((date.getDay() + 6) % 7));
// January 4 is always in week 1.
var week1 = new Date(date.getFullYear(), 0, 4);
// Adjust to Thursday in week 1 and count number of weeks from date to week1.
return (1 +
Math.round(((date.getTime() - week1.getTime()) / 86400000 -
3 +
((week1.getDay() + 6) % 7)) /
7));
},
hourIncrement: 1,
ignoredFocusElements: [],
inline: false,
locale: "default",
minuteIncrement: 5,
mode: "single",
monthSelectorType: "dropdown",
nextArrow: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 17 17'><g></g><path d='M13.207 8.472l-7.854 7.854-0.707-0.707 7.146-7.146-7.146-7.148 0.707-0.707 7.854 7.854z' /></svg>",
noCalendar: false,
now: new Date(),
onChange: [],
onClose: [],
onDayCreate: [],
onDestroy: [],
onKeyDown: [],
onMonthChange: [],
onOpen: [],
onParseConfig: [],
onReady: [],
onValueUpdate: [],
onYearChange: [],
onPreCalendarPosition: [],
plugins: [],
position: "auto",
positionElement: undefined,
prevArrow: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 17 17'><g></g><path d='M5.207 8.471l7.146 7.147-0.707 0.707-7.853-7.854 7.854-7.853 0.707 0.707-7.147 7.146z' /></svg>",
shorthandCurrentMonth: false,
showMonths: 1,
static: false,
time_24hr: false,
weekNumbers: false,
wrap: false,
};
var english = {
weekdays: {
shorthand: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
longhand: [
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday",
],
},
months: {
shorthand: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
longhand: [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December",
],
},
daysInMonth: [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31],
firstDayOfWeek: 0,
ordinal: function (nth) {
var s = nth % 100;
if (s > 3 && s < 21)
return "th";
switch (s % 10) {
case 1:
return "st";
case 2:
return "nd";
case 3:
return "rd";
default:
return "th";
}
},
rangeSeparator: " to ",
weekAbbreviation: "Wk",
scrollTitle: "Scroll to increment",
toggleTitle: "Click to toggle",
amPM: ["AM", "PM"],
yearAriaLabel: "Year",
monthAriaLabel: "Month",
hourAriaLabel: "Hour",
minuteAriaLabel: "Minute",
time_24hr: false,
};
var pad = function (number, length) {
if (length === void 0) { length = 2; }
return ("000" + number).slice(length * -1);
};
var int = function (bool) { return (bool === true ? 1 : 0); };
/* istanbul ignore next */
function debounce(fn, wait) {
var t;
return function () {
var _this = this;
var args = arguments;
clearTimeout(t);
t = setTimeout(function () { return fn.apply(_this, args); }, wait);
};
}
var arrayify = function (obj) {
return obj instanceof Array ? obj : [obj];
};
function toggleClass(elem, className, bool) {
if (bool === true)
return elem.classList.add(className);
elem.classList.remove(className);
}
function createElement(tag, className, content) {
var e = window.document.createElement(tag);
className = className || "";
content = content || "";
e.className = className;
if (content !== undefined)
e.textContent = content;
return e;
}
function clearNode(node) {
while (node.firstChild)
node.removeChild(node.firstChild);
}
function findParent(node, condition) {
if (condition(node))
return node;
else if (node.parentNode)
return findParent(node.parentNode, condition);
return undefined; // nothing found
}
function createNumberInput(inputClassName, opts) {
var wrapper = createElement("div", "numInputWrapper"), numInput = createElement("input", "numInput " + inputClassName), arrowUp = createElement("span", "arrowUp"), arrowDown = createElement("span", "arrowDown");
if (navigator.userAgent.indexOf("MSIE 9.0") === -1) {
numInput.type = "number";
}
else {
numInput.type = "text";
numInput.pattern = "\\d*";
}
if (opts !== undefined)
for (var key in opts)
numInput.setAttribute(key, opts[key]);
wrapper.appendChild(numInput);
wrapper.appendChild(arrowUp);
wrapper.appendChild(arrowDown);
return wrapper;
}
function getEventTarget(event) {
try {
if (typeof event.composedPath === "function") {
var path = event.composedPath();
return path[0];
}
return event.target;
}
catch (error) {
return event.target;
}
}
var doNothing = function () { return undefined; };
var monthToStr = function (monthNumber, shorthand, locale) { return locale.months[shorthand ? "shorthand" : "longhand"][monthNumber]; };
var revFormat = {
D: doNothing,
F: function (dateObj, monthName, locale) {
dateObj.setMonth(locale.months.longhand.indexOf(monthName));
},
G: function (dateObj, hour) {
dateObj.setHours((dateObj.getHours() >= 12 ? 12 : 0) + parseFloat(hour));
},
H: function (dateObj, hour) {
dateObj.setHours(parseFloat(hour));
},
J: function (dateObj, day) {
dateObj.setDate(parseFloat(day));
},
K: function (dateObj, amPM, locale) {
dateObj.setHours((dateObj.getHours() % 12) +
12 * int(new RegExp(locale.amPM[1], "i").test(amPM)));
},
M: function (dateObj, shortMonth, locale) {
dateObj.setMonth(locale.months.shorthand.indexOf(shortMonth));
},
S: function (dateObj, seconds) {
dateObj.setSeconds(parseFloat(seconds));
},
U: function (_, unixSeconds) { return new Date(parseFloat(unixSeconds) * 1000); },
W: function (dateObj, weekNum, locale) {
var weekNumber = parseInt(weekNum);
var date = new Date(dateObj.getFullYear(), 0, 2 + (weekNumber - 1) * 7, 0, 0, 0, 0);
date.setDate(date.getDate() - date.getDay() + locale.firstDayOfWeek);
return date;
},
Y: function (dateObj, year) {
dateObj.setFullYear(parseFloat(year));
},
Z: function (_, ISODate) { return new Date(ISODate); },
d: function (dateObj, day) {
dateObj.setDate(parseFloat(day));
},
h: function (dateObj, hour) {
dateObj.setHours((dateObj.getHours() >= 12 ? 12 : 0) + parseFloat(hour));
},
i: function (dateObj, minutes) {
dateObj.setMinutes(parseFloat(minutes));
},
j: function (dateObj, day) {
dateObj.setDate(parseFloat(day));
},
l: doNothing,
m: function (dateObj, month) {
dateObj.setMonth(parseFloat(month) - 1);
},
n: function (dateObj, month) {
dateObj.setMonth(parseFloat(month) - 1);
},
s: function (dateObj, seconds) {
dateObj.setSeconds(parseFloat(seconds));
},
u: function (_, unixMillSeconds) {
return new Date(parseFloat(unixMillSeconds));
},
w: doNothing,
y: function (dateObj, year) {
dateObj.setFullYear(2000 + parseFloat(year));
},
};
var tokenRegex = {
D: "",
F: "",
G: "(\\d\\d|\\d)",
H: "(\\d\\d|\\d)",
J: "(\\d\\d|\\d)\\w+",
K: "",
M: "",
S: "(\\d\\d|\\d)",
U: "(.+)",
W: "(\\d\\d|\\d)",
Y: "(\\d{4})",
Z: "(.+)",
d: "(\\d\\d|\\d)",
h: "(\\d\\d|\\d)",
i: "(\\d\\d|\\d)",
j: "(\\d\\d|\\d)",
l: "",
m: "(\\d\\d|\\d)",
n: "(\\d\\d|\\d)",
s: "(\\d\\d|\\d)",
u: "(.+)",
w: "(\\d\\d|\\d)",
y: "(\\d{2})",
};
var formats = {
// get the date in UTC
Z: function (date) { return date.toISOString(); },
// weekday name, short, e.g. Thu
D: function (date, locale, options) {
return locale.weekdays.shorthand[formats.w(date, locale, options)];
},
// full month name e.g. January
F: function (date, locale, options) {
return monthToStr(formats.n(date, locale, options) - 1, false, locale);
},
// padded hour 1-12
G: function (date, locale, options) {
return pad(formats.h(date, locale, options));
},
// hours with leading zero e.g. 03
H: function (date) { return pad(date.getHours()); },
// day (1-30) with ordinal suffix e.g. 1st, 2nd
J: function (date, locale) {
return locale.ordinal !== undefined
? date.getDate() + locale.ordinal(date.getDate())
: date.getDate();
},
// AM/PM
K: function (date, locale) { return locale.amPM[int(date.getHours() > 11)]; },
// shorthand month e.g. Jan, Sep, Oct, etc
M: function (date, locale) {
return monthToStr(date.getMonth(), true, locale);
},
// seconds 00-59
S: function (date) { return pad(date.getSeconds()); },
// unix timestamp
U: function (date) { return date.getTime() / 1000; },
W: function (date, _, options) {
return options.getWeek(date);
},
// full year e.g. 2016, padded (0001-9999)
Y: function (date) { return pad(date.getFullYear(), 4); },
// day in month, padded (01-30)
d: function (date) { return pad(date.getDate()); },
// hour from 1-12 (am/pm)
h: function (date) { return (date.getHours() % 12 ? date.getHours() % 12 : 12); },
// minutes, padded with leading zero e.g. 09
i: function (date) { return pad(date.getMinutes()); },
// day in month (1-30)
j: function (date) { return date.getDate(); },
// weekday name, full, e.g. Thursday
l: function (date, locale) {
return locale.weekdays.longhand[date.getDay()];
},
// padded month number (01-12)
m: function (date) { return pad(date.getMonth() + 1); },
// the month number (1-12)
n: function (date) { return date.getMonth() + 1; },
// seconds 0-59
s: function (date) { return date.getSeconds(); },
// Unix Milliseconds
u: function (date) { return date.getTime(); },
// number of the day of the week
w: function (date) { return date.getDay(); },
// last two digits of year e.g. 16 for 2016
y: function (date) { return String(date.getFullYear()).substring(2); },
};
var createDateFormatter = function (_a) {
var _b = _a.config, config = _b === void 0 ? defaults : _b, _c = _a.l10n, l10n = _c === void 0 ? english : _c, _d = _a.isMobile, isMobile = _d === void 0 ? false : _d;
return function (dateObj, frmt, overrideLocale) {
var locale = overrideLocale || l10n;
if (config.formatDate !== undefined && !isMobile) {
return config.formatDate(dateObj, frmt, locale);
}
return frmt
.split("")
.map(function (c, i, arr) {
return formats[c] && arr[i - 1] !== "\\"
? formats[c](dateObj, locale, config)
: c !== "\\"
? c
: "";
})
.join("");
};
};
var createDateParser = function (_a) {
var _b = _a.config, config = _b === void 0 ? defaults : _b, _c = _a.l10n, l10n = _c === void 0 ? english : _c;
return function (date, givenFormat, timeless, customLocale) {
if (date !== 0 && !date)
return undefined;
var locale = customLocale || l10n;
var parsedDate;
var dateOrig = date;
if (date instanceof Date)
parsedDate = new Date(date.getTime());
else if (typeof date !== "string" &&
date.toFixed !== undefined // timestamp
)
// create a copy
parsedDate = new Date(date);
else if (typeof date === "string") {
// date string
var format = givenFormat || (config || defaults).dateFormat;
var datestr = String(date).trim();
if (datestr === "today") {
parsedDate = new Date();
timeless = true;
}
else if (config && config.parseDate) {
parsedDate = config.parseDate(date, format);
}
else if (/Z$/.test(datestr) ||
/GMT$/.test(datestr) // datestrings w/ timezone
) {
parsedDate = new Date(date);
}
else {
var matched = void 0, ops = [];
for (var i = 0, matchIndex = 0, regexStr = ""; i < format.length; i++) {
var token_1 = format[i];
var isBackSlash = token_1 === "\\";
var escaped = format[i - 1] === "\\" || isBackSlash;
if (tokenRegex[token_1] && !escaped) {
regexStr += tokenRegex[token_1];
var match = new RegExp(regexStr).exec(date);
if (match && (matched = true)) {
ops[token_1 !== "Y" ? "push" : "unshift"]({
fn: revFormat[token_1],
val: match[++matchIndex],
});
}
}
else if (!isBackSlash)
regexStr += "."; // don't really care
}
parsedDate =
!config || !config.noCalendar
? new Date(new Date().getFullYear(), 0, 1, 0, 0, 0, 0)
: new Date(new Date().setHours(0, 0, 0, 0));
ops.forEach(function (_a) {
var fn = _a.fn, val = _a.val;
return (parsedDate = fn(parsedDate, val, locale) || parsedDate);
});
parsedDate = matched ? parsedDate : undefined;
}
}
/* istanbul ignore next */
if (!(parsedDate instanceof Date && !isNaN(parsedDate.getTime()))) {
config.errorHandler(new Error("Invalid date provided: " + dateOrig));
return undefined;
}
if (timeless === true)
parsedDate.setHours(0, 0, 0, 0);
return parsedDate;
};
};
/**
* Compute the difference in dates, measured in ms
*/
function compareDates(date1, date2, timeless) {
if (timeless === void 0) { timeless = true; }
if (timeless !== false) {
return (new Date(date1.getTime()).setHours(0, 0, 0, 0) -
new Date(date2.getTime()).setHours(0, 0, 0, 0));
}
return date1.getTime() - date2.getTime();
}
var isBetween = function (ts, ts1, ts2) {
return ts > Math.min(ts1, ts2) && ts < Math.max(ts1, ts2);
};
var calculateSecondsSinceMidnight = function (hours, minutes, seconds) {
return hours * 3600 + minutes * 60 + seconds;
};
var parseSeconds = function (secondsSinceMidnight) {
var hours = Math.floor(secondsSinceMidnight / 3600), minutes = (secondsSinceMidnight - hours * 3600) / 60;
return [hours, minutes, secondsSinceMidnight - hours * 3600 - minutes * 60];
};
var duration = {
DAY: 86400000,
};
function getDefaultHours(config) {
var hours = config.defaultHour;
var minutes = config.defaultMinute;
var seconds = config.defaultSeconds;
if (config.minDate !== undefined) {
var minHour = config.minDate.getHours();
var minMinutes = config.minDate.getMinutes();
var minSeconds = config.minDate.getSeconds();
if (hours < minHour) {
hours = minHour;
}
if (hours === minHour && minutes < minMinutes) {
minutes = minMinutes;
}
if (hours === minHour && minutes === minMinutes && seconds < minSeconds)
seconds = config.minDate.getSeconds();
}
if (config.maxDate !== undefined) {
var maxHr = config.maxDate.getHours();
var maxMinutes = config.maxDate.getMinutes();
hours = Math.min(hours, maxHr);
if (hours === maxHr)
minutes = Math.min(maxMinutes, minutes);
if (hours === maxHr && minutes === maxMinutes)
seconds = config.maxDate.getSeconds();
}
return { hours: hours, minutes: minutes, seconds: seconds };
}
if (typeof Object.assign !== "function") {
Object.assign = function (target) {
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
if (!target) {
throw TypeError("Cannot convert undefined or null to object");
}
var _loop_1 = function (source) {
if (source) {
Object.keys(source).forEach(function (key) { return (target[key] = source[key]); });
}
};
for (var _a = 0, args_1 = args; _a < args_1.length; _a++) {
var source = args_1[_a];
_loop_1(source);
}
return target;
};
}
var DEBOUNCED_CHANGE_MS = 300;
function FlatpickrInstance(element, instanceConfig) {
var self = {
config: __assign(__assign({}, defaults), flatpickr.defaultConfig),
l10n: english,
};
self.parseDate = createDateParser({ config: self.config, l10n: self.l10n });
self._handlers = [];
self.pluginElements = [];
self.loadedPlugins = [];
self._bind = bind;
self._setHoursFromDate = setHoursFromDate;
self._positionCalendar = positionCalendar;
self.changeMonth = changeMonth;
self.changeYear = changeYear;
self.clear = clear;
self.close = close;
self.onMouseOver = onMouseOver;
self._createElement = createElement;
self.createDay = createDay;
self.destroy = destroy;
self.isEnabled = isEnabled;
self.jumpToDate = jumpToDate;
self.updateValue = updateValue;
self.open = open;
self.redraw = redraw;
self.set = set;
self.setDate = setDate;
self.toggle = toggle;
function setupHelperFunctions() {
self.utils = {
getDaysInMonth: function (month, yr) {
if (month === void 0) { month = self.currentMonth; }
if (yr === void 0) { yr = self.currentYear; }
if (month === 1 && ((yr % 4 === 0 && yr % 100 !== 0) || yr % 400 === 0))
return 29;
return self.l10n.daysInMonth[month];
},
};
}
function init() {
self.element = self.input = element;
self.isOpen = false;
parseConfig();
setupLocale();
setupInputs();
setupDates();
setupHelperFunctions();
if (!self.isMobile)
build();
bindEvents();
if (self.selectedDates.length || self.config.noCalendar) {
if (self.config.enableTime) {
setHoursFromDate(self.config.noCalendar ? self.latestSelectedDateObj : undefined);
}
updateValue(false);
}
setCalendarWidth();
var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
/* TODO: investigate this further
Currently, there is weird positioning behavior in safari causing pages
to scroll up. https://github.com/chmln/flatpickr/issues/563
However, most browsers are not Safari and positioning is expensive when used
in scale. https://github.com/chmln/flatpickr/issues/1096
*/
if (!self.isMobile && isSafari) {
positionCalendar();
}
triggerEvent("onReady");
}
function getClosestActiveElement() {
var _a;
return (((_a = self.calendarContainer) === null || _a === void 0 ? void 0 : _a.getRootNode())
.activeElement || document.activeElement);
}
function bindToInstance(fn) {
return fn.bind(self);
}
function setCalendarWidth() {
var config = self.config;
if (config.weekNumbers === false && config.showMonths === 1) {
return;
}
else if (config.noCalendar !== true) {
window.requestAnimationFrame(function () {
if (self.calendarContainer !== undefined) {
self.calendarContainer.style.visibility = "hidden";
self.calendarContainer.style.display = "block";
}
if (self.daysContainer !== undefined) {
var daysWidth = (self.days.offsetWidth + 1) * config.showMonths;
self.daysContainer.style.width = daysWidth + "px";
self.calendarContainer.style.width =
daysWidth +
(self.weekWrapper !== undefined
? self.weekWrapper.offsetWidth
: 0) +
"px";
self.calendarContainer.style.removeProperty("visibility");
self.calendarContainer.style.removeProperty("display");
}
});
}
}
/**
* The handler for all events targeting the time inputs
*/
function updateTime(e) {
if (self.selectedDates.length === 0) {
var defaultDate = self.config.minDate === undefined ||
compareDates(new Date(), self.config.minDate) >= 0
? new Date()
: new Date(self.config.minDate.getTime());
var defaults = getDefaultHours(self.config);
defaultDate.setHours(defaults.hours, defaults.minutes, defaults.seconds, defaultDate.getMilliseconds());
self.selectedDates = [defaultDate];
self.latestSelectedDateObj = defaultDate;
}
if (e !== undefined && e.type !== "blur") {
timeWrapper(e);
}
var prevValue = self._input.value;
setHoursFromInputs();
updateValue();
if (self._input.value !== prevValue) {
self._debouncedChange();
}
}
function ampm2military(hour, amPM) {
return (hour % 12) + 12 * int(amPM === self.l10n.amPM[1]);
}
function military2ampm(hour) {
switch (hour % 24) {
case 0:
case 12:
return 12;
default:
return hour % 12;
}
}
/**
* Syncs the selected date object time with user's time input
*/
function setHoursFromInputs() {
if (self.hourElement === undefined || self.minuteElement === undefined)
return;
var hours = (parseInt(self.hourElement.value.slice(-2), 10) || 0) % 24, minutes = (parseInt(self.minuteElement.value, 10) || 0) % 60, seconds = self.secondElement !== undefined
? (parseInt(self.secondElement.value, 10) || 0) % 60
: 0;
if (self.amPM !== undefined) {
hours = ampm2military(hours, self.amPM.textContent);
}
var limitMinHours = self.config.minTime !== undefined ||
(self.config.minDate &&
self.minDateHasTime &&
self.latestSelectedDateObj &&
compareDates(self.latestSelectedDateObj, self.config.minDate, true) ===
0);
var limitMaxHours = self.config.maxTime !== undefined ||
(self.config.maxDate &&
self.maxDateHasTime &&
self.latestSelectedDateObj &&
compareDates(self.latestSelectedDateObj, self.config.maxDate, true) ===
0);
if (self.config.maxTime !== undefined &&
self.config.minTime !== undefined &&
self.config.minTime > self.config.maxTime) {
var minBound = calculateSecondsSinceMidnight(self.config.minTime.getHours(), self.config.minTime.getMinutes(), self.config.minTime.getSeconds());
var maxBound = calculateSecondsSinceMidnight(self.config.maxTime.getHours(), self.config.maxTime.getMinutes(), self.config.maxTime.getSeconds());
var currentTime = calculateSecondsSinceMidnight(hours, minutes, seconds);
if (currentTime > maxBound && currentTime < minBound) {
var result = parseSeconds(minBound);
hours = result[0];
minutes = result[1];
seconds = result[2];
}
}
else {
if (limitMaxHours) {
var maxTime = self.config.maxTime !== undefined
? self.config.maxTime
: self.config.maxDate;
hours = Math.min(hours, maxTime.getHours());
if (hours === maxTime.getHours())
minutes = Math.min(minutes, maxTime.getMinutes());
if (minutes === maxTime.getMinutes())
seconds = Math.min(seconds, maxTime.getSeconds());
}
if (limitMinHours) {
var minTime = self.config.minTime !== undefined
? self.config.minTime
: self.config.minDate;
hours = Math.max(hours, minTime.getHours());
if (hours === minTime.getHours() && minutes < minTime.getMinutes())
minutes = minTime.getMinutes();
if (minutes === minTime.getMinutes())
seconds = Math.max(seconds, minTime.getSeconds());
}
}
setHours(hours, minutes, seconds);
}
/**
* Syncs time input values with a date
*/
function setHoursFromDate(dateObj) {
var date = dateObj || self.latestSelectedDateObj;
if (date && date instanceof Date) {
setHours(date.getHours(), date.getMinutes(), date.getSeconds());
}
}
/**
* Sets the hours, minutes, and optionally seconds
* of the latest selected date object and the
* corresponding time inputs
* @param {Number} hours the hour. whether its military
* or am-pm gets inferred from config
* @param {Number} minutes the minutes
* @param {Number} seconds the seconds (optional)
*/
function setHours(hours, minutes, seconds) {
if (self.latestSelectedDateObj !== undefined) {
self.latestSelectedDateObj.setHours(hours % 24, minutes, seconds || 0, 0);
}
if (!self.hourElement || !self.minuteElement || self.isMobile)
return;
self.hourElement.value = pad(!self.config.time_24hr
? ((12 + hours) % 12) + 12 * int(hours % 12 === 0)
: hours);
self.minuteElement.value = pad(minutes);
if (self.amPM !== undefined)
self.amPM.textContent = self.l10n.amPM[int(hours >= 12)];
if (self.secondElement !== undefined)
self.secondElement.value = pad(seconds);
}
/**
* Handles the year input and incrementing events
* @param {Event} event the keyup or increment event
*/
function onYearInput(event) {
var eventTarget = getEventTarget(event);
var year = parseInt(eventTarget.value) + (event.delta || 0);
if (year / 1000 > 1 ||
(event.key === "Enter" && !/[^\d]/.test(year.toString()))) {
changeYear(year);
}
}
/**
* Essentially addEventListener + tracking
* @param {Element} element the element to addEventListener to
* @param {String} event the event name
* @param {Function} handler the event handler
*/
function bind(element, event, handler, options) {
if (event instanceof Array)
return event.forEach(function (ev) { return bind(element, ev, handler, options); });
if (element instanceof Array)
return element.forEach(function (el) { return bind(el, event, handler, options); });
element.addEventListener(event, handler, options);
self._handlers.push({
remove: function () { return element.removeEventListener(event, handler, options); },
});
}
function triggerChange() {
triggerEvent("onChange");
}
/**
* Adds all the necessary event listeners
*/
function bindEvents() {
if (self.config.wrap) {
["open", "close", "toggle", "clear"].forEach(function (evt) {
Array.prototype.forEach.call(self.element.querySelectorAll("[data-" + evt + "]"), function (el) {
return bind(el, "click", self[evt]);
});
});
}
if (self.isMobile) {
setupMobile();
return;
}
var debouncedResize = debounce(onResize, 50);
self._debouncedChange = debounce(triggerChange, DEBOUNCED_CHANGE_MS);
if (self.daysContainer && !/iPhone|iPad|iPod/i.test(navigator.userAgent))
bind(self.daysContainer, "mouseover", function (e) {
if (self.config.mode === "range")
onMouseOver(getEventTarget(e));
});
bind(self._input, "keydown", onKeyDown);
if (self.calendarContainer !== undefined) {
bind(self.calendarContainer, "keydown", onKeyDown);
}
if (!self.config.inline && !self.config.static)
bind(window, "resize", debouncedResize);
if (window.ontouchstart !== undefined)
bind(window.document, "touchstart", documentClick);
else
bind(window.document, "mousedown", documentClick);
bind(window.document, "focus", documentClick, { capture: true });
if (self.config.clickOpens === true) {
bind(self._input, "focus", self.open);
bind(self._input, "click", self.open);
}
if (self.daysContainer !== undefined) {
bind(self.monthNav, "click", onMonthNavClick);
bind(self.monthNav, ["keyup", "increment"], onYearInput);
bind(self.daysContainer, "click", selectDate);
}
if (self.timeContainer !== undefined &&
self.minuteElement !== undefined &&
self.hourElement !== undefined) {
var selText = function (e) {
return getEventTarget(e).select();
};
bind(self.timeContainer, ["increment"], updateTime);
bind(self.timeContainer, "blur", updateTime, { capture: true });
bind(self.timeContainer, "click", timeIncrement);
bind([self.hourElement, self.minuteElement], ["focus", "click"], selText);
if (self.secondElement !== undefined)
bind(self.secondElement, "focus", function () { return self.secondElement && self.secondElement.select(); });
if (self.amPM !== undefined) {
bind(self.amPM, "click", function (e) {
updateTime(e);
});
}
}
if (self.config.allowInput) {
bind(self._input, "blur", onBlur);
}
}
/**
* Set the calendar view to a particular date.
* @param {Date} jumpDate the date to set the view to
* @param {boolean} triggerChange if change events should be triggered
*/
function jumpToDate(jumpDate, triggerChange) {
var jumpTo = jumpDate !== undefined
? self.parseDate(jumpDate)
: self.latestSelectedDateObj ||
(self.config.minDate && self.config.minDate > self.now
? self.config.minDate
: self.config.maxDate && self.config.maxDate < self.now
? self.config.maxDate
: self.now);
var oldYear = self.currentYear;
var oldMonth = self.currentMonth;
try {
if (jumpTo !== undefined) {
self.currentYear = jumpTo.getFullYear();
self.currentMonth = jumpTo.getMonth();
}
}
catch (e) {
/* istanbul ignore next */
e.message = "Invalid date supplied: " + jumpTo;
self.config.errorHandler(e);
}
if (triggerChange && self.currentYear !== oldYear) {
triggerEvent("onYearChange");
buildMonthSwitch();
}
if (triggerChange &&
(self.currentYear !== oldYear || self.currentMonth !== oldMonth)) {
triggerEvent("onMonthChange");
}
self.redraw();
}
/**
* The up/down arrow handler for time inputs
* @param {Event} e the click event
*/
function timeIncrement(e) {
var eventTarget = getEventTarget(e);
if (~eventTarget.className.indexOf("arrow"))
incrementNumInput(e, eventTarget.classList.contains("arrowUp") ? 1 : -1);
}
/**
* Increments/decrements the value of input associ-
* ated with the up/down arrow by dispatching an
* "increment" event on the input.
*
* @param {Event} e the click event
* @param {Number} delta the diff (usually 1 or -1)
* @param {Element} inputElem the input element
*/
function incrementNumInput(e, delta, inputElem) {
var target = e && getEventTarget(e);
var input = inputElem ||
(target && target.parentNode && target.parentNode.firstChild);
var event = createEvent("increment");
event.delta = delta;
input && input.dispatchEvent(event);
}
function build() {
var fragment = window.document.createDocumentFragment();
self.calendarContainer = createElement("div", "flatpickr-calendar");
self.calendarContainer.tabIndex = -1;
if (!self.config.noCalendar) {
fragment.appendChild(buildMonthNav());
self.innerContainer = createElement("div", "flatpickr-innerContainer");
if (self.config.weekNumbers) {
var _a = buildWeeks(), weekWrapper = _a.weekWrapper, weekNumbers = _a.weekNumbers;
self.innerContainer.appendChild(weekWrapper);
self.weekNumbers = weekNumbers;
self.weekWrapper = weekWrapper;
}
self.rContainer = createElement("div", "flatpickr-rContainer");
self.rContainer.appendChild(buildWeekdays());
if (!self.daysContainer) {
self.daysContainer = createElement("div", "flatpickr-days");
self.daysContainer.tabIndex = -1;
}
buildDays();
self.rContainer.appendChild(self.daysContainer);
self.innerContainer.appendChild(self.rContainer);
fragment.appendChild(self.innerContainer);
}
if (self.config.enableTime) {
fragment.appendChild(buildTime());
}
toggleClass(self.calendarContainer, "rangeMode", self.config.mode === "range");
toggleClass(self.calendarContainer, "animate", self.config.animate === true);
toggleClass(self.calendarContainer, "multiMonth", self.config.showMonths > 1);
self.calendarContainer.appendChild(fragment);
var customAppend = self.config.appendTo !== undefined &&
self.config.appendTo.nodeType !== undefined;
if (self.config.inline || self.config.static) {
self.calendarContainer.classList.add(self.config.inline ? "inline" : "static");
if (self.config.inline) {
if (!customAppend && self.element.parentNode)
self.element.parentNode.insertBefore(self.calendarContainer, self._input.nextSibling);
else if (self.config.appendTo !== undefined)
self.config.appendTo.appendChild(self.calendarContainer);
}
if (self.config.static) {
var wrapper = createElement("div", "flatpickr-wrapper");
if (self.element.parentNode)
self.element.parentNode.insertBefore(wrapper, self.element);
wrapper.appendChild(self.element);
if (self.altInput)
wrapper.appendChild(self.altInput);
wrapper.appendChild(self.calendarContainer);
}
}
if (!self.config.static && !self.config.inline)
(self.config.appendTo !== undefined
? self.config.appendTo
: window.document.body).appendChild(self.calendarContainer);
}
function createDay(className, date, _dayNumber, i) {
var dateIsEnabled = isEnabled(date, true), dayElement = createElement("span", className, date.getDate().toString());
dayElement.dateObj = date;
dayElement.$i = i;
dayElement.setAttribute("aria-label", self.formatDate(date, self.config.ariaDateFormat));
if (className.indexOf("hidden") === -1 &&
compareDates(date, self.now) === 0) {
self.todayDateElem = dayElement;
dayElement.classList.add("today");
dayElement.setAttribute("aria-current", "date");
}
if (dateIsEnabled) {
dayElement.tabIndex = -1;
if (isDateSelected(date)) {
dayElement.classList.add("selected");
self.selectedDateElem = dayElement;
if (self.config.mode === "range") {
toggleClass(dayElement, "startRange", self.selectedDates[0] &&
compareDates(date, self.selectedDates[0], true) === 0);
toggleClass(dayElement, "endRange", self.selectedDates[1] &&
compareDates(date, self.selectedDates[1], true) === 0);
if (className === "nextMonthDay")
dayElement.classList.add("inRange");
}
}
}
else {
dayElement.classList.add("flatpickr-disabled");
}
if (self.config.mode === "range") {
if (isDateInRange(date) && !isDateSelected(date))
dayElement.classList.add("inRange");
}
if (self.weekNumbers &&
self.config.showMonths === 1 &&
className !== "prevMonthDay" &&
i % 7 === 6) {
self.weekNumbers.insertAdjacentHTML("beforeend", "<span class='flatpickr-day'>" + self.config.getWeek(date) + "</span>");
}
triggerEvent("onDayCreate", dayElement);
return dayElement;
}
function focusOnDayElem(targetNode) {
targetNode.focus();
if (self.config.mode === "range")
onMouseOver(targetNode);
}
function getFirstAvailableDay(delta) {
var startMonth = delta > 0 ? 0 : self.config.showMonths - 1;
var endMonth = delta > 0 ? self.config.showMonths : -1;
for (var m = startMonth; m != endMonth; m += delta) {
var month = self.daysContainer.children[m];
var startIndex = delta > 0 ? 0 : month.children.length - 1;
var endIndex = delta > 0 ? month.children.length : -1;
for (var i = startIndex; i != endIndex; i += delta) {
var c = month.children[i];
if (c.className.indexOf("hidden") === -1 && isEnabled(c.dateObj))
return c;
}
}
return undefined;
}
function getNextAvailableDay(current, delta) {
var givenMonth = current.className.indexOf("Month") === -1
? current.dateObj.getMonth()
: self.currentMonth;
var endMonth = delta > 0 ? self.config.showMonths : -1;
var loopDelta = delta > 0 ? 1 : -1;
for (var m = givenMonth - self.currentMonth; m != endMonth; m += loopDelta) {
var month = self.daysContainer.children[m];
var startIndex = givenMonth - self.currentMonth === m
? current.$i + delta
: delta < 0
? month.children.length - 1
: 0;
var numMonthDays = month.children.length;
for (var i = startIndex; i >= 0 && i < numMonthDays && i != (delta > 0 ? numMonthDays : -1); i += loopDelta) {
var c = month.children[i];
if (c.className.indexOf("hidden") === -1 &&
isEnabled(c.dateObj) &&
Math.abs(current.$i - i) >= Math.abs(delta))
return focusOnDayElem(c);
}
}
self.changeMonth(loopDelta);
focusOnDay(getFirstAvailableDay(loopDelta), 0);
return undefined;
}
function focusOnDay(current, offset) {
var activeElement = getClosestActiveElement();
var dayFocused = isInView(activeElement || document.body);
var startElem = current !== undefined
? current
: dayFocused
? activeElement
: self.selectedDateElem !== undefined && isInView(self.selectedDateElem)
? self.selectedDateElem
: self.todayDateElem !== undefined && isInView(self.todayDateElem)
? self.todayDateElem
: getFirstAvailableDay(offset > 0 ? 1 : -1);
if (startElem === undefined) {
self._input.focus();
}
else if (!dayFocused) {
focusOnDayElem(startElem);
}
else {
getNextAvailableDay(startElem, offset);
}
}
function buildMonthDays(year, month) {
var firstOfMonth = (new Date(year, month, 1).getDay() - self.l10n.firstDayOfWeek + 7) % 7;
var prevMonthDays = self.utils.getDaysInMonth((month - 1 + 12) % 12, year);
var daysInMonth = self.utils.getDaysInMonth(month, year), days = window.document.createDocumentFragment(), isMultiMonth = self.config.showMonths > 1, prevMonthDayClass = isMultiMonth ? "prevMonthDay hidden" : "prevMonthDay", nextMonthDayClass = isMultiMonth ? "nextMonthDay hidden" : "nextMonthDay";
var dayNumber = prevMonthDays + 1 - firstOfMonth, dayIndex = 0;
// prepend days from the ending of previous month
for (; dayNumber <= prevMonthDays; dayNumber++, dayIndex++) {
days.appendChild(createDay("flatpickr-day " + prevMonthDayClass, new Date(year,