',\n monthHtml = void 0,\n yearHtml = void 0,\n prev = true,\n next = true;\n\n for (arr = [], i = 0; i < 12; i++) {\n arr.push('
');\n }\n\n monthHtml = '
';\n\n if ($.isArray(opts.yearRange)) {\n i = opts.yearRange[0];\n j = opts.yearRange[1] + 1;\n } else {\n i = year - opts.yearRange;\n j = 1 + year + opts.yearRange;\n }\n\n for (arr = []; i < j && i <= opts.maxYear; i++) {\n if (i >= opts.minYear) {\n arr.push(\"
\");\n }\n }\n if (opts.yearRangeReverse) {\n arr.reverse();\n }\n\n yearHtml = \"
\";\n\n var leftArrow = '
';\n html += \"
\";\n\n html += '
';\n if (opts.showMonthAfterYear) {\n html += yearHtml + monthHtml;\n } else {\n html += monthHtml + yearHtml;\n }\n html += '
';\n\n if (isMinYear && (month === 0 || opts.minMonth >= month)) {\n prev = false;\n }\n\n if (isMaxYear && (month === 11 || opts.maxMonth <= month)) {\n next = false;\n }\n\n var rightArrow = '
';\n html += \"
\";\n\n return html += '
';\n }\n\n /**\n * refresh the HTML\n */\n\n }, {\n key: \"draw\",\n value: function draw(force) {\n if (!this.isOpen && !force) {\n return;\n }\n var opts = this.options,\n minYear = opts.minYear,\n maxYear = opts.maxYear,\n minMonth = opts.minMonth,\n maxMonth = opts.maxMonth,\n html = '',\n randId = void 0;\n\n if (this._y <= minYear) {\n this._y = minYear;\n if (!isNaN(minMonth) && this._m < minMonth) {\n this._m = minMonth;\n }\n }\n if (this._y >= maxYear) {\n this._y = maxYear;\n if (!isNaN(maxMonth) && this._m > maxMonth) {\n this._m = maxMonth;\n }\n }\n\n randId = 'datepicker-title-' + Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 2);\n\n for (var c = 0; c < 1; c++) {\n this._renderDateDisplay();\n html += this.renderTitle(this, c, this.calendars[c].year, this.calendars[c].month, this.calendars[0].year, randId) + this.render(this.calendars[c].year, this.calendars[c].month, randId);\n }\n\n this.destroySelects();\n\n this.calendarEl.innerHTML = html;\n\n // Init Materialize Select\n var yearSelect = this.calendarEl.querySelector('.orig-select-year');\n var monthSelect = this.calendarEl.querySelector('.orig-select-month');\n M.FormSelect.init(yearSelect, {\n classes: 'select-year',\n dropdownOptions: { container: document.body, constrainWidth: false }\n });\n M.FormSelect.init(monthSelect, {\n classes: 'select-month',\n dropdownOptions: { container: document.body, constrainWidth: false }\n });\n\n // Add change handlers for select\n yearSelect.addEventListener('change', this._handleYearChange.bind(this));\n monthSelect.addEventListener('change', this._handleMonthChange.bind(this));\n\n if (typeof this.options.onDraw === 'function') {\n this.options.onDraw(this);\n }\n }\n\n /**\n * Setup Event Handlers\n */\n\n }, {\n key: \"_setupEventHandlers\",\n value: function _setupEventHandlers() {\n this._handleInputKeydownBound = this._handleInputKeydown.bind(this);\n this._handleInputClickBound = this._handleInputClick.bind(this);\n this._handleInputChangeBound = this._handleInputChange.bind(this);\n this._handleCalendarClickBound = this._handleCalendarClick.bind(this);\n this._finishSelectionBound = this._finishSelection.bind(this);\n this._handleMonthChange = this._handleMonthChange.bind(this);\n this._closeBound = this.close.bind(this);\n\n this.el.addEventListener('click', this._handleInputClickBound);\n this.el.addEventListener('keydown', this._handleInputKeydownBound);\n this.el.addEventListener('change', this._handleInputChangeBound);\n this.calendarEl.addEventListener('click', this._handleCalendarClickBound);\n this.doneBtn.addEventListener('click', this._finishSelectionBound);\n this.cancelBtn.addEventListener('click', this._closeBound);\n\n if (this.options.showClearBtn) {\n this._handleClearClickBound = this._handleClearClick.bind(this);\n this.clearBtn.addEventListener('click', this._handleClearClickBound);\n }\n }\n }, {\n key: \"_setupVariables\",\n value: function _setupVariables() {\n var _this54 = this;\n\n this.$modalEl = $(Datepicker._template);\n this.modalEl = this.$modalEl[0];\n\n this.calendarEl = this.modalEl.querySelector('.datepicker-calendar');\n\n this.yearTextEl = this.modalEl.querySelector('.year-text');\n this.dateTextEl = this.modalEl.querySelector('.date-text');\n if (this.options.showClearBtn) {\n this.clearBtn = this.modalEl.querySelector('.datepicker-clear');\n }\n this.doneBtn = this.modalEl.querySelector('.datepicker-done');\n this.cancelBtn = this.modalEl.querySelector('.datepicker-cancel');\n\n this.formats = {\n d: function () {\n return _this54.date.getDate();\n },\n dd: function () {\n var d = _this54.date.getDate();\n return (d < 10 ? '0' : '') + d;\n },\n ddd: function () {\n return _this54.options.i18n.weekdaysShort[_this54.date.getDay()];\n },\n dddd: function () {\n return _this54.options.i18n.weekdays[_this54.date.getDay()];\n },\n m: function () {\n return _this54.date.getMonth() + 1;\n },\n mm: function () {\n var m = _this54.date.getMonth() + 1;\n return (m < 10 ? '0' : '') + m;\n },\n mmm: function () {\n return _this54.options.i18n.monthsShort[_this54.date.getMonth()];\n },\n mmmm: function () {\n return _this54.options.i18n.months[_this54.date.getMonth()];\n },\n yy: function () {\n return ('' + _this54.date.getFullYear()).slice(2);\n },\n yyyy: function () {\n return _this54.date.getFullYear();\n }\n };\n }\n\n /**\n * Remove Event Handlers\n */\n\n }, {\n key: \"_removeEventHandlers\",\n value: function _removeEventHandlers() {\n this.el.removeEventListener('click', this._handleInputClickBound);\n this.el.removeEventListener('keydown', this._handleInputKeydownBound);\n this.el.removeEventListener('change', this._handleInputChangeBound);\n this.calendarEl.removeEventListener('click', this._handleCalendarClickBound);\n }\n }, {\n key: \"_handleInputClick\",\n value: function _handleInputClick() {\n this.open();\n }\n }, {\n key: \"_handleInputKeydown\",\n value: function _handleInputKeydown(e) {\n if (e.which === M.keys.ENTER) {\n e.preventDefault();\n this.open();\n }\n }\n }, {\n key: \"_handleCalendarClick\",\n value: function _handleCalendarClick(e) {\n if (!this.isOpen) {\n return;\n }\n\n var $target = $(e.target);\n if (!$target.hasClass('is-disabled')) {\n if ($target.hasClass('datepicker-day-button') && !$target.hasClass('is-empty') && !$target.parent().hasClass('is-disabled')) {\n this.setDate(new Date(e.target.getAttribute('data-year'), e.target.getAttribute('data-month'), e.target.getAttribute('data-day')));\n if (this.options.autoClose) {\n this._finishSelection();\n }\n } else if ($target.closest('.month-prev').length) {\n this.prevMonth();\n } else if ($target.closest('.month-next').length) {\n this.nextMonth();\n }\n }\n }\n }, {\n key: \"_handleClearClick\",\n value: function _handleClearClick() {\n this.date = null;\n this.setInputValue();\n this.close();\n }\n }, {\n key: \"_handleMonthChange\",\n value: function _handleMonthChange(e) {\n this.gotoMonth(e.target.value);\n }\n }, {\n key: \"_handleYearChange\",\n value: function _handleYearChange(e) {\n this.gotoYear(e.target.value);\n }\n\n /**\n * change view to a specific month (zero-index, e.g. 0: January)\n */\n\n }, {\n key: \"gotoMonth\",\n value: function gotoMonth(month) {\n if (!isNaN(month)) {\n this.calendars[0].month = parseInt(month, 10);\n this.adjustCalendars();\n }\n }\n\n /**\n * change view to a specific full year (e.g. \"2012\")\n */\n\n }, {\n key: \"gotoYear\",\n value: function gotoYear(year) {\n if (!isNaN(year)) {\n this.calendars[0].year = parseInt(year, 10);\n this.adjustCalendars();\n }\n }\n }, {\n key: \"_handleInputChange\",\n value: function _handleInputChange(e) {\n var date = void 0;\n\n // Prevent change event from being fired when triggered by the plugin\n if (e.firedBy === this) {\n return;\n }\n if (this.options.parse) {\n date = this.options.parse(this.el.value, this.options.format);\n } else {\n date = new Date(Date.parse(this.el.value));\n }\n\n if (Datepicker._isDate(date)) {\n this.setDate(date);\n }\n }\n }, {\n key: \"renderDayName\",\n value: function renderDayName(opts, day, abbr) {\n day += opts.firstDay;\n while (day >= 7) {\n day -= 7;\n }\n return abbr ? opts.i18n.weekdaysAbbrev[day] : opts.i18n.weekdays[day];\n }\n\n /**\n * Set input value to the selected date and close Datepicker\n */\n\n }, {\n key: \"_finishSelection\",\n value: function _finishSelection() {\n this.setInputValue();\n this.close();\n }\n\n /**\n * Open Datepicker\n */\n\n }, {\n key: \"open\",\n value: function open() {\n if (this.isOpen) {\n return;\n }\n\n this.isOpen = true;\n if (typeof this.options.onOpen === 'function') {\n this.options.onOpen.call(this);\n }\n this.draw();\n this.modal.open();\n return this;\n }\n\n /**\n * Close Datepicker\n */\n\n }, {\n key: \"close\",\n value: function close() {\n if (!this.isOpen) {\n return;\n }\n\n this.isOpen = false;\n if (typeof this.options.onClose === 'function') {\n this.options.onClose.call(this);\n }\n this.modal.close();\n return this;\n }\n }], [{\n key: \"init\",\n value: function init(els, options) {\n return _get(Datepicker.__proto__ || Object.getPrototypeOf(Datepicker), \"init\", this).call(this, this, els, options);\n }\n }, {\n key: \"_isDate\",\n value: function _isDate(obj) {\n return (/Date/.test(Object.prototype.toString.call(obj)) && !isNaN(obj.getTime())\n );\n }\n }, {\n key: \"_isWeekend\",\n value: function _isWeekend(date) {\n var day = date.getDay();\n return day === 0 || day === 6;\n }\n }, {\n key: \"_setToStartOfDay\",\n value: function _setToStartOfDay(date) {\n if (Datepicker._isDate(date)) date.setHours(0, 0, 0, 0);\n }\n }, {\n key: \"_getDaysInMonth\",\n value: function _getDaysInMonth(year, month) {\n return [31, Datepicker._isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month];\n }\n }, {\n key: \"_isLeapYear\",\n value: function _isLeapYear(year) {\n // solution by Matti Virkkunen: http://stackoverflow.com/a/4881951\n return year % 4 === 0 && year % 100 !== 0 || year % 400 === 0;\n }\n }, {\n key: \"_compareDates\",\n value: function _compareDates(a, b) {\n // weak date comparison (use setToStartOfDay(date) to ensure correct result)\n return a.getTime() === b.getTime();\n }\n }, {\n key: \"_setToStartOfDay\",\n value: function _setToStartOfDay(date) {\n if (Datepicker._isDate(date)) date.setHours(0, 0, 0, 0);\n }\n\n /**\n * Get Instance\n */\n\n }, {\n key: \"getInstance\",\n value: function getInstance(el) {\n var domElem = !!el.jquery ? el[0] : el;\n return domElem.M_Datepicker;\n }\n }, {\n key: \"defaults\",\n get: function () {\n return _defaults;\n }\n }]);\n\n return Datepicker;\n }(Component);\n\n Datepicker._template = ['