UNPKG

ng2-date-picker

Version:

[![Build Status](https://travis-ci.org/vlio20/angular-datepicker.svg?branch=master)](https://travis-ci.org/vlio20/angular-datepicker) [![Backers on Open Collective](https://opencollective.com/angular-datepicker/backers/badge.svg)](#backers) [![Sponsor

1,015 lines (998 loc) 151 kB
(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@angular/common'), require('moment')) : typeof define === 'function' && define.amd ? define('ng2-date-picker', ['exports', '@angular/core', '@angular/forms', '@angular/common', 'moment'], factory) : (global = global || self, factory(global['ng2-date-picker'] = {}, global.ng.core, global.ng.forms, global.ng.common, global.momentNs)); }(this, function (exports, core, forms, common, momentNs) { 'use strict'; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */ 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 __decorate(decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; } function __param(paramIndex, decorator) { return function (target, key) { decorator(target, key, paramIndex); } } function __metadata(metadataKey, metadataValue) { if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue); } (function (ECalendarMode) { ECalendarMode[ECalendarMode["Day"] = 0] = "Day"; ECalendarMode[ECalendarMode["DayTime"] = 1] = "DayTime"; ECalendarMode[ECalendarMode["Month"] = 2] = "Month"; ECalendarMode[ECalendarMode["Time"] = 3] = "Time"; })(exports.ECalendarMode || (exports.ECalendarMode = {})); (function (ECalendarValue) { ECalendarValue[ECalendarValue["Moment"] = 1] = "Moment"; ECalendarValue[ECalendarValue["MomentArr"] = 2] = "MomentArr"; ECalendarValue[ECalendarValue["String"] = 3] = "String"; ECalendarValue[ECalendarValue["StringArr"] = 4] = "StringArr"; })(exports.ECalendarValue || (exports.ECalendarValue = {})); (function (SelectEvent) { SelectEvent["INPUT"] = "input"; SelectEvent["SELECTION"] = "selection"; })(exports.SelectEvent || (exports.SelectEvent = {})); var DomHelper = /** @class */ (function () { function DomHelper() { } DomHelper_1 = DomHelper; DomHelper.setYAxisPosition = function (element, container, anchor, drops) { var anchorRect = anchor.getBoundingClientRect(); var containerRect = container.getBoundingClientRect(); var bottom = anchorRect.bottom - containerRect.top; var top = anchorRect.top - containerRect.top; if (drops === 'down') { element.style.top = (bottom + 1 + 'px'); } else { element.style.top = (top - 1 - element.scrollHeight) + 'px'; } }; DomHelper.setXAxisPosition = function (element, container, anchor, dimElem, opens) { var anchorRect = anchor.getBoundingClientRect(); var containerRect = container.getBoundingClientRect(); var left = anchorRect.left - containerRect.left; if (opens === 'right') { element.style.left = left + 'px'; } else { element.style.left = left - dimElem.offsetWidth + anchor.offsetWidth + 'px'; } }; DomHelper.isTopInView = function (el) { var top = el.getBoundingClientRect().top; return (top >= 0); }; DomHelper.isBottomInView = function (el) { var bottom = el.getBoundingClientRect().bottom; return (bottom <= window.innerHeight); }; DomHelper.isLeftInView = function (el) { var left = el.getBoundingClientRect().left; return (left >= 0); }; DomHelper.isRightInView = function (el) { var right = el.getBoundingClientRect().right; return (right <= window.innerWidth); }; DomHelper.prototype.appendElementToPosition = function (config) { var _this = this; var container = config.container, element = config.element; if (!container.style.position || container.style.position === 'static') { container.style.position = 'relative'; } if (element.style.position !== 'absolute') { element.style.position = 'absolute'; } element.style.visibility = 'hidden'; setTimeout(function () { _this.setElementPosition(config); element.style.visibility = 'visible'; }); }; DomHelper.prototype.setElementPosition = function (_a) { var element = _a.element, container = _a.container, anchor = _a.anchor, dimElem = _a.dimElem, drops = _a.drops, opens = _a.opens; DomHelper_1.setYAxisPosition(element, container, anchor, 'down'); DomHelper_1.setXAxisPosition(element, container, anchor, dimElem, 'right'); if (drops !== 'down' && drops !== 'up') { if (DomHelper_1.isBottomInView(dimElem)) { DomHelper_1.setYAxisPosition(element, container, anchor, 'down'); } else if (DomHelper_1.isTopInView(dimElem)) { DomHelper_1.setYAxisPosition(element, container, anchor, 'up'); } } else { DomHelper_1.setYAxisPosition(element, container, anchor, drops); } if (opens !== 'left' && opens !== 'right') { if (DomHelper_1.isRightInView(dimElem)) { DomHelper_1.setXAxisPosition(element, container, anchor, dimElem, 'right'); } else if (DomHelper_1.isLeftInView(dimElem)) { DomHelper_1.setXAxisPosition(element, container, anchor, dimElem, 'left'); } } else { DomHelper_1.setXAxisPosition(element, container, anchor, dimElem, opens); } }; var DomHelper_1; DomHelper = DomHelper_1 = __decorate([ core.Injectable() ], DomHelper); return DomHelper; }()); var moment = momentNs; var UtilsService = /** @class */ (function () { function UtilsService() { } UtilsService.debounce = function (func, wait) { var timeout; return function () { var context = this, args = arguments; timeout = clearTimeout(timeout); setTimeout(function () { func.apply(context, args); }, wait); }; }; UtilsService.prototype.createArray = function (size) { return new Array(size).fill(1); }; UtilsService.prototype.convertToMoment = function (date, format) { if (!date) { return null; } else if (typeof date === 'string') { return moment(date, format); } else { return date.clone(); } }; UtilsService.prototype.isDateValid = function (date, format) { if (date === '') { return true; } return moment(date, format, true).isValid(); }; // todo:: add unit test UtilsService.prototype.getDefaultDisplayDate = function (current, selected, allowMultiSelect, minDate) { if (current) { return current.clone(); } else if (minDate && minDate.isAfter(moment())) { return minDate.clone(); } else if (allowMultiSelect) { if (selected && selected[selected.length]) { return selected[selected.length].clone(); } } else if (selected && selected[0]) { return selected[0].clone(); } return moment(); }; // todo:: add unit test UtilsService.prototype.getInputType = function (value, allowMultiSelect) { if (Array.isArray(value)) { if (!value.length) { return exports.ECalendarValue.MomentArr; } else if (typeof value[0] === 'string') { return exports.ECalendarValue.StringArr; } else if (moment.isMoment(value[0])) { return exports.ECalendarValue.MomentArr; } } else { if (typeof value === 'string') { return exports.ECalendarValue.String; } else if (moment.isMoment(value)) { return exports.ECalendarValue.Moment; } } return allowMultiSelect ? exports.ECalendarValue.MomentArr : exports.ECalendarValue.Moment; }; // todo:: add unit test UtilsService.prototype.convertToMomentArray = function (value, format, allowMultiSelect) { switch (this.getInputType(value, allowMultiSelect)) { case (exports.ECalendarValue.String): return value ? [moment(value, format, true)] : []; case (exports.ECalendarValue.StringArr): return value.map(function (v) { return v ? moment(v, format, true) : null; }).filter(Boolean); case (exports.ECalendarValue.Moment): return value ? [value.clone()] : []; case (exports.ECalendarValue.MomentArr): return (value || []).map(function (v) { return v.clone(); }); default: return []; } }; // todo:: add unit test UtilsService.prototype.convertFromMomentArray = function (format, value, convertTo) { switch (convertTo) { case (exports.ECalendarValue.String): return value[0] && value[0].format(format); case (exports.ECalendarValue.StringArr): return value.filter(Boolean).map(function (v) { return v.format(format); }); case (exports.ECalendarValue.Moment): return value[0] ? value[0].clone() : value[0]; case (exports.ECalendarValue.MomentArr): return value ? value.map(function (v) { return v.clone(); }) : value; default: return value; } }; UtilsService.prototype.convertToString = function (value, format) { var _this = this; var tmpVal; if (typeof value === 'string') { tmpVal = [value]; } else if (Array.isArray(value)) { if (value.length) { tmpVal = value.map(function (v) { return _this.convertToMoment(v, format).format(format); }); } else { tmpVal = value; } } else if (moment.isMoment(value)) { tmpVal = [value.format(format)]; } else { return ''; } return tmpVal.filter(Boolean).join(' | '); }; // todo:: add unit test UtilsService.prototype.clearUndefined = function (obj) { if (!obj) { return obj; } Object.keys(obj).forEach(function (key) { return (obj[key] === undefined) && delete obj[key]; }); return obj; }; UtilsService.prototype.updateSelected = function (isMultiple, currentlySelected, date, granularity) { if (granularity === void 0) { granularity = 'day'; } if (isMultiple) { return !date.selected ? currentlySelected.concat([date.date]) : currentlySelected.filter(function (d) { return !d.isSame(date.date, granularity); }); } else { return !date.selected ? [date.date] : []; } }; UtilsService.prototype.closestParent = function (element, selector) { if (!element) { return undefined; } var match = element.querySelector(selector); return match || this.closestParent(element.parentElement, selector); }; UtilsService.prototype.onlyTime = function (m) { return m && moment.isMoment(m) && moment(m.format('HH:mm:ss'), 'HH:mm:ss'); }; UtilsService.prototype.granularityFromType = function (calendarType) { switch (calendarType) { case 'time': return 'second'; case 'daytime': return 'second'; default: return calendarType; } }; UtilsService.prototype.createValidator = function (_a, format, calendarType) { var _this = this; var minDate = _a.minDate, maxDate = _a.maxDate, minTime = _a.minTime, maxTime = _a.maxTime; var isValid; var value; var validators = []; var granularity = this.granularityFromType(calendarType); if (minDate) { var md_1 = this.convertToMoment(minDate, format); validators.push({ key: 'minDate', isValid: function () { var _isValid = value.every(function (val) { return val.isSameOrAfter(md_1, granularity); }); isValid = isValid ? _isValid : false; return _isValid; } }); } if (maxDate) { var md_2 = this.convertToMoment(maxDate, format); validators.push({ key: 'maxDate', isValid: function () { var _isValid = value.every(function (val) { return val.isSameOrBefore(md_2, granularity); }); isValid = isValid ? _isValid : false; return _isValid; } }); } if (minTime) { var md_3 = this.onlyTime(this.convertToMoment(minTime, format)); validators.push({ key: 'minTime', isValid: function () { var _isValid = value.every(function (val) { return _this.onlyTime(val).isSameOrAfter(md_3); }); isValid = isValid ? _isValid : false; return _isValid; } }); } if (maxTime) { var md_4 = this.onlyTime(this.convertToMoment(maxTime, format)); validators.push({ key: 'maxTime', isValid: function () { var _isValid = value.every(function (val) { return _this.onlyTime(val).isSameOrBefore(md_4); }); isValid = isValid ? _isValid : false; return _isValid; } }); } return function (inputVal) { isValid = true; value = _this.convertToMomentArray(inputVal, format, true).filter(Boolean); if (!value.every(function (val) { return val.isValid(); })) { return { format: { given: inputVal } }; } var errors = validators.reduce(function (map, err) { if (!err.isValid()) { map[err.key] = { given: value }; } return map; }, {}); return !isValid ? errors : null; }; }; UtilsService.prototype.datesStringToStringArray = function (value) { return (value || '').split('|').map(function (m) { return m.trim(); }).filter(Boolean); }; UtilsService.prototype.getValidMomentArray = function (value, format) { var _this = this; return this.datesStringToStringArray(value) .filter(function (d) { return _this.isDateValid(d, format); }) .map(function (d) { return moment(d, format); }); }; UtilsService.prototype.shouldShowCurrent = function (showGoToCurrent, mode, min, max) { return showGoToCurrent && mode !== 'time' && this.isDateInRange(moment(), min, max); }; UtilsService.prototype.isDateInRange = function (date, from, to) { return date.isBetween(from, to, 'day', '[]'); }; UtilsService.prototype.convertPropsToMoment = function (obj, format, props) { var _this = this; props.forEach(function (prop) { if (obj.hasOwnProperty(prop)) { obj[prop] = _this.convertToMoment(obj[prop], format); } }); }; UtilsService.prototype.shouldResetCurrentView = function (prevConf, currentConf) { if (prevConf && currentConf) { if (!prevConf.min && currentConf.min) { return true; } else if (prevConf.min && currentConf.min && !prevConf.min.isSame(currentConf.min, 'd')) { return true; } else if (!prevConf.max && currentConf.max) { return true; } else if (prevConf.max && currentConf.max && !prevConf.max.isSame(currentConf.max, 'd')) { return true; } return false; } return false; }; UtilsService.prototype.getNativeElement = function (elem) { if (!elem) { return null; } else if (typeof elem === 'string') { return document.querySelector(elem); } else { return elem; } }; UtilsService = __decorate([ core.Injectable() ], UtilsService); return UtilsService; }()); var moment$1 = momentNs; var DayCalendarService = /** @class */ (function () { function DayCalendarService(utilsService) { this.utilsService = utilsService; this.DAYS = ['su', 'mo', 'tu', 'we', 'th', 'fr', 'sa']; this.DEFAULT_CONFIG = { showNearMonthDays: true, showWeekNumbers: false, firstDayOfWeek: 'su', weekDayFormat: 'ddd', format: 'DD-MM-YYYY', allowMultiSelect: false, monthFormat: 'MMM, YYYY', enableMonthSelector: true, locale: moment$1.locale(), dayBtnFormat: 'DD', unSelectOnClick: true }; } DayCalendarService.prototype.removeNearMonthWeeks = function (currentMonth, monthArray) { if (monthArray[monthArray.length - 1].find(function (day) { return day.date.isSame(currentMonth, 'month'); })) { return monthArray; } else { return monthArray.slice(0, -1); } }; DayCalendarService.prototype.getConfig = function (config) { var _config = __assign({}, this.DEFAULT_CONFIG, this.utilsService.clearUndefined(config)); this.utilsService.convertPropsToMoment(_config, _config.format, ['min', 'max']); moment$1.locale(_config.locale); return _config; }; DayCalendarService.prototype.generateDaysMap = function (firstDayOfWeek) { var firstDayIndex = this.DAYS.indexOf(firstDayOfWeek); var daysArr = this.DAYS.slice(firstDayIndex, 7).concat(this.DAYS.slice(0, firstDayIndex)); return daysArr.reduce(function (map, day, index) { map[day] = index; return map; }, {}); }; DayCalendarService.prototype.generateMonthArray = function (config, month, selected) { var _this = this; var monthArray = []; var firstDayOfWeekIndex = this.DAYS.indexOf(config.firstDayOfWeek); var firstDayOfBoard = month.clone().startOf('month'); while (firstDayOfBoard.day() !== firstDayOfWeekIndex) { firstDayOfBoard.subtract(1, 'day'); } var current = firstDayOfBoard.clone(); var prevMonth = month.clone().subtract(1, 'month'); var nextMonth = month.clone().add(1, 'month'); var today = moment$1(); var daysOfCalendar = this.utilsService.createArray(42) .reduce(function (array) { array.push({ date: current.clone(), selected: !!selected.find(function (selectedDay) { return current.isSame(selectedDay, 'day'); }), currentMonth: current.isSame(month, 'month'), prevMonth: current.isSame(prevMonth, 'month'), nextMonth: current.isSame(nextMonth, 'month'), currentDay: current.isSame(today, 'day'), disabled: _this.isDateDisabled(current, config) }); current.add(1, 'day'); return array; }, []); daysOfCalendar.forEach(function (day, index) { var weekIndex = Math.floor(index / 7); if (!monthArray[weekIndex]) { monthArray.push([]); } monthArray[weekIndex].push(day); }); if (!config.showNearMonthDays) { monthArray = this.removeNearMonthWeeks(month, monthArray); } return monthArray; }; DayCalendarService.prototype.generateWeekdays = function (firstDayOfWeek) { var weekdayNames = { su: moment$1().day(0), mo: moment$1().day(1), tu: moment$1().day(2), we: moment$1().day(3), th: moment$1().day(4), fr: moment$1().day(5), sa: moment$1().day(6) }; var weekdays = []; var daysMap = this.generateDaysMap(firstDayOfWeek); for (var dayKey in daysMap) { if (daysMap.hasOwnProperty(dayKey)) { weekdays[daysMap[dayKey]] = weekdayNames[dayKey]; } } return weekdays; }; DayCalendarService.prototype.isDateDisabled = function (date, config) { if (config.isDayDisabledCallback) { return config.isDayDisabledCallback(date); } if (config.min && date.isBefore(config.min, 'day')) { return true; } return !!(config.max && date.isAfter(config.max, 'day')); }; // todo:: add unit tests DayCalendarService.prototype.getHeaderLabel = function (config, month) { if (config.monthFormatter) { return config.monthFormatter(month); } return month.format(config.monthFormat); }; // todo:: add unit tests DayCalendarService.prototype.shouldShowLeft = function (min, currentMonthView) { return min ? min.isBefore(currentMonthView, 'month') : true; }; // todo:: add unit tests DayCalendarService.prototype.shouldShowRight = function (max, currentMonthView) { return max ? max.isAfter(currentMonthView, 'month') : true; }; DayCalendarService.prototype.generateDaysIndexMap = function (firstDayOfWeek) { var firstDayIndex = this.DAYS.indexOf(firstDayOfWeek); var daysArr = this.DAYS.slice(firstDayIndex, 7).concat(this.DAYS.slice(0, firstDayIndex)); return daysArr.reduce(function (map, day, index) { map[index] = day; return map; }, {}); }; DayCalendarService.prototype.getMonthCalendarConfig = function (componentConfig) { return this.utilsService.clearUndefined({ min: componentConfig.min, max: componentConfig.max, format: componentConfig.format, isNavHeaderBtnClickable: true, allowMultiSelect: false, yearFormat: componentConfig.yearFormat, yearFormatter: componentConfig.yearFormatter, monthBtnFormat: componentConfig.monthBtnFormat, monthBtnFormatter: componentConfig.monthBtnFormatter, monthBtnCssClassCallback: componentConfig.monthBtnCssClassCallback, multipleYearsNavigateBy: componentConfig.multipleYearsNavigateBy, showMultipleYearsNavigation: componentConfig.showMultipleYearsNavigation, showGoToCurrent: componentConfig.showGoToCurrent }); }; DayCalendarService.prototype.getDayBtnText = function (config, day) { if (config.dayBtnFormatter) { return config.dayBtnFormatter(day); } return day.format(config.dayBtnFormat); }; DayCalendarService.prototype.getDayBtnCssClass = function (config, day) { if (config.dayBtnCssClassCallback) { return config.dayBtnCssClassCallback(day); } return ''; }; DayCalendarService = __decorate([ core.Injectable(), __metadata("design:paramtypes", [UtilsService]) ], DayCalendarService); return DayCalendarService; }()); var moment$2 = momentNs; var DayCalendarComponent = /** @class */ (function () { function DayCalendarComponent(dayCalendarService, utilsService, cd) { this.dayCalendarService = dayCalendarService; this.utilsService = utilsService; this.cd = cd; this.onSelect = new core.EventEmitter(); this.onMonthSelect = new core.EventEmitter(); this.onNavHeaderBtnClick = new core.EventEmitter(); this.onGoToCurrent = new core.EventEmitter(); this.onLeftNav = new core.EventEmitter(); this.onRightNav = new core.EventEmitter(); this.CalendarMode = exports.ECalendarMode; this.isInited = false; this.currentCalendarMode = exports.ECalendarMode.Day; this._shouldShowCurrent = true; this.api = { moveCalendarsBy: this.moveCalendarsBy.bind(this), moveCalendarTo: this.moveCalendarTo.bind(this), toggleCalendarMode: this.toggleCalendarMode.bind(this) }; } DayCalendarComponent_1 = DayCalendarComponent; Object.defineProperty(DayCalendarComponent.prototype, "selected", { get: function () { return this._selected; }, set: function (selected) { this._selected = selected; this.onChangeCallback(this.processOnChangeCallback(selected)); }, enumerable: true, configurable: true }); Object.defineProperty(DayCalendarComponent.prototype, "currentDateView", { get: function () { return this._currentDateView; }, set: function (current) { this._currentDateView = current.clone(); this.weeks = this.dayCalendarService .generateMonthArray(this.componentConfig, this._currentDateView, this.selected); this.navLabel = this.dayCalendarService.getHeaderLabel(this.componentConfig, this._currentDateView); this.showLeftNav = this.dayCalendarService.shouldShowLeft(this.componentConfig.min, this.currentDateView); this.showRightNav = this.dayCalendarService.shouldShowRight(this.componentConfig.max, this.currentDateView); }, enumerable: true, configurable: true }); DayCalendarComponent.prototype.ngOnInit = function () { this.isInited = true; this.init(); this.initValidators(); }; DayCalendarComponent.prototype.init = function () { this.componentConfig = this.dayCalendarService.getConfig(this.config); this.selected = this.selected || []; this.currentDateView = this.displayDate ? this.utilsService.convertToMoment(this.displayDate, this.componentConfig.format).clone() : this.utilsService .getDefaultDisplayDate(this.currentDateView, this.selected, this.componentConfig.allowMultiSelect, this.componentConfig.min); this.weekdays = this.dayCalendarService .generateWeekdays(this.componentConfig.firstDayOfWeek); this.inputValueType = this.utilsService.getInputType(this.inputValue, this.componentConfig.allowMultiSelect); this.monthCalendarConfig = this.dayCalendarService.getMonthCalendarConfig(this.componentConfig); this._shouldShowCurrent = this.shouldShowCurrent(); }; DayCalendarComponent.prototype.ngOnChanges = function (changes) { if (this.isInited) { var minDate = changes.minDate, maxDate = changes.maxDate, config = changes.config; this.handleConfigChange(config); this.init(); if (minDate || maxDate) { this.initValidators(); } } }; DayCalendarComponent.prototype.writeValue = function (value) { this.inputValue = value; if (value) { this.selected = this.utilsService .convertToMomentArray(value, this.componentConfig.format, this.componentConfig.allowMultiSelect); this.inputValueType = this.utilsService .getInputType(this.inputValue, this.componentConfig.allowMultiSelect); } else { this.selected = []; } this.weeks = this.dayCalendarService .generateMonthArray(this.componentConfig, this.currentDateView, this.selected); this.cd.markForCheck(); }; DayCalendarComponent.prototype.registerOnChange = function (fn) { this.onChangeCallback = fn; }; DayCalendarComponent.prototype.onChangeCallback = function (_) { }; DayCalendarComponent.prototype.registerOnTouched = function (fn) { }; DayCalendarComponent.prototype.validate = function (formControl) { if (this.minDate || this.maxDate) { return this.validateFn(formControl.value); } else { return function () { return null; }; } }; DayCalendarComponent.prototype.processOnChangeCallback = function (value) { return this.utilsService.convertFromMomentArray(this.componentConfig.format, value, this.componentConfig.returnedValueType || this.inputValueType); }; DayCalendarComponent.prototype.initValidators = function () { this.validateFn = this.utilsService.createValidator({ minDate: this.minDate, maxDate: this.maxDate }, this.componentConfig.format, 'day'); this.onChangeCallback(this.processOnChangeCallback(this.selected)); }; DayCalendarComponent.prototype.dayClicked = function (day) { if (day.selected && !this.componentConfig.unSelectOnClick) { return; } this.selected = this.utilsService .updateSelected(this.componentConfig.allowMultiSelect, this.selected, day); this.weeks = this.dayCalendarService .generateMonthArray(this.componentConfig, this.currentDateView, this.selected); this.onSelect.emit(day); }; DayCalendarComponent.prototype.getDayBtnText = function (day) { return this.dayCalendarService.getDayBtnText(this.componentConfig, day.date); }; DayCalendarComponent.prototype.getDayBtnCssClass = function (day) { var cssClasses = { 'dp-selected': day.selected, 'dp-current-month': day.currentMonth, 'dp-prev-month': day.prevMonth, 'dp-next-month': day.nextMonth, 'dp-current-day': day.currentDay }; var customCssClass = this.dayCalendarService.getDayBtnCssClass(this.componentConfig, day.date); if (customCssClass) { cssClasses[customCssClass] = true; } return cssClasses; }; DayCalendarComponent.prototype.onLeftNavClick = function () { var from = this.currentDateView.clone(); this.moveCalendarsBy(this.currentDateView, -1, 'month'); var to = this.currentDateView.clone(); this.onLeftNav.emit({ from: from, to: to }); }; DayCalendarComponent.prototype.onRightNavClick = function () { var from = this.currentDateView.clone(); this.moveCalendarsBy(this.currentDateView, 1, 'month'); var to = this.currentDateView.clone(); this.onRightNav.emit({ from: from, to: to }); }; DayCalendarComponent.prototype.onMonthCalendarLeftClick = function (change) { this.onLeftNav.emit(change); }; DayCalendarComponent.prototype.onMonthCalendarRightClick = function (change) { this.onRightNav.emit(change); }; DayCalendarComponent.prototype.onMonthCalendarSecondaryLeftClick = function (change) { this.onRightNav.emit(change); }; DayCalendarComponent.prototype.onMonthCalendarSecondaryRightClick = function (change) { this.onLeftNav.emit(change); }; DayCalendarComponent.prototype.getWeekdayName = function (weekday) { if (this.componentConfig.weekDayFormatter) { return this.componentConfig.weekDayFormatter(weekday.day()); } return weekday.format(this.componentConfig.weekDayFormat); }; DayCalendarComponent.prototype.toggleCalendarMode = function (mode) { if (this.currentCalendarMode !== mode) { this.currentCalendarMode = mode; this.onNavHeaderBtnClick.emit(mode); } this.cd.markForCheck(); }; DayCalendarComponent.prototype.monthSelected = function (month) { this.currentDateView = month.date.clone(); this.currentCalendarMode = exports.ECalendarMode.Day; this.onMonthSelect.emit(month); }; DayCalendarComponent.prototype.moveCalendarsBy = function (current, amount, granularity) { if (granularity === void 0) { granularity = 'month'; } this.currentDateView = current.clone().add(amount, granularity); this.cd.markForCheck(); }; DayCalendarComponent.prototype.moveCalendarTo = function (to) { if (to) { this.currentDateView = this.utilsService.convertToMoment(to, this.componentConfig.format); } this.cd.markForCheck(); }; DayCalendarComponent.prototype.shouldShowCurrent = function () { return this.utilsService.shouldShowCurrent(this.componentConfig.showGoToCurrent, 'day', this.componentConfig.min, this.componentConfig.max); }; DayCalendarComponent.prototype.goToCurrent = function () { this.currentDateView = moment$2(); this.onGoToCurrent.emit(); }; DayCalendarComponent.prototype.handleConfigChange = function (config) { if (config) { var prevConf = this.dayCalendarService.getConfig(config.previousValue); var currentConf = this.dayCalendarService.getConfig(config.currentValue); if (this.utilsService.shouldResetCurrentView(prevConf, currentConf)) { this._currentDateView = null; } } }; var DayCalendarComponent_1; __decorate([ core.Input(), __metadata("design:type", Object) ], DayCalendarComponent.prototype, "config", void 0); __decorate([ core.Input(), __metadata("design:type", Object) ], DayCalendarComponent.prototype, "displayDate", void 0); __decorate([ core.Input(), __metadata("design:type", Object) ], DayCalendarComponent.prototype, "minDate", void 0); __decorate([ core.Input(), __metadata("design:type", Object) ], DayCalendarComponent.prototype, "maxDate", void 0); __decorate([ core.HostBinding('class'), core.Input(), __metadata("design:type", String) ], DayCalendarComponent.prototype, "theme", void 0); __decorate([ core.Output(), __metadata("design:type", core.EventEmitter) ], DayCalendarComponent.prototype, "onSelect", void 0); __decorate([ core.Output(), __metadata("design:type", core.EventEmitter) ], DayCalendarComponent.prototype, "onMonthSelect", void 0); __decorate([ core.Output(), __metadata("design:type", core.EventEmitter) ], DayCalendarComponent.prototype, "onNavHeaderBtnClick", void 0); __decorate([ core.Output(), __metadata("design:type", core.EventEmitter) ], DayCalendarComponent.prototype, "onGoToCurrent", void 0); __decorate([ core.Output(), __metadata("design:type", core.EventEmitter) ], DayCalendarComponent.prototype, "onLeftNav", void 0); __decorate([ core.Output(), __metadata("design:type", core.EventEmitter) ], DayCalendarComponent.prototype, "onRightNav", void 0); DayCalendarComponent = DayCalendarComponent_1 = __decorate([ core.Component({ selector: 'dp-day-calendar', template: "<div class=\"dp-day-calendar-container\" *ngIf=\"currentCalendarMode === CalendarMode.Day\">\n <dp-calendar-nav\n [label]=\"navLabel\"\n [showLeftNav]=\"showLeftNav\"\n [showRightNav]=\"showRightNav\"\n [isLabelClickable]=\"componentConfig.enableMonthSelector\"\n [showGoToCurrent]=\"_shouldShowCurrent\"\n [theme]=\"theme\"\n (onLeftNav)=\"onLeftNavClick()\"\n (onRightNav)=\"onRightNavClick()\"\n (onLabelClick)=\"toggleCalendarMode(CalendarMode.Month)\"\n (onGoToCurrent)=\"goToCurrent()\">\n </dp-calendar-nav>\n\n <div class=\"dp-calendar-wrapper\"\n [ngClass]=\"{'dp-hide-near-month': !componentConfig.showNearMonthDays}\">\n <div class=\"dp-weekdays\">\n <span class=\"dp-calendar-weekday\"\n *ngFor=\"let weekday of weekdays\"\n [innerText]=\"getWeekdayName(weekday)\">\n </span>\n </div>\n <div class=\"dp-calendar-week\" *ngFor=\"let week of weeks\">\n <span class=\"dp-week-number\"\n *ngIf=\"componentConfig.showWeekNumbers\"\n [innerText]=\"week[0].date.isoWeek()\">\n </span>\n <button type=\"button\"\n class=\"dp-calendar-day\"\n *ngFor=\"let day of week\"\n [attr.data-date]=\"day.date.format(componentConfig.format)\"\n (click)=\"dayClicked(day)\"\n [disabled]=\"day.disabled\"\n [ngClass]=\"getDayBtnCssClass(day)\"\n [innerText]=\"getDayBtnText(day)\">\n </button>\n </div>\n </div>\n</div>\n\n<dp-month-calendar\n *ngIf=\"currentCalendarMode === CalendarMode.Month\"\n [config]=\"monthCalendarConfig\"\n [displayDate]=\"_currentDateView\"\n [theme]=\"theme\"\n (onSelect)=\"monthSelected($event)\"\n (onNavHeaderBtnClick)=\"toggleCalendarMode(CalendarMode.Day)\"\n (onLeftNav)=\"onMonthCalendarLeftClick($event)\"\n (onRightNav)=\"onMonthCalendarRightClick($event)\"\n (onLeftSecondaryNav)=\"onMonthCalendarSecondaryLeftClick($event)\"\n (onRightSecondaryNav)=\"onMonthCalendarSecondaryRightClick($event)\">\n</dp-month-calendar>\n", encapsulation: core.ViewEncapsulation.None, changeDetection: core.ChangeDetectionStrategy.OnPush, providers: [ DayCalendarService, { provide: forms.NG_VALUE_ACCESSOR, useExisting: core.forwardRef(function () { return DayCalendarComponent_1; }), multi: true }, { provide: forms.NG_VALIDATORS, useExisting: core.forwardRef(function () { return DayCalendarComponent_1; }), multi: true } ], styles: ["dp-day-calendar{display:inline-block}dp-day-calendar .dp-day-calendar-container{background:#fff}dp-day-calendar .dp-calendar-wrapper{box-sizing:border-box;border:1px solid #000}dp-day-calendar .dp-calendar-wrapper .dp-calendar-weekday:first-child{border-left:none}dp-day-calendar .dp-weekdays{font-size:15px;margin-bottom:5px}dp-day-calendar .dp-calendar-weekday{box-sizing:border-box;display:inline-block;width:30px;text-align:center;border-left:1px solid #000;border-bottom:1px solid #000}dp-day-calendar .dp-calendar-day{box-sizing:border-box;width:30px;height:30px;cursor:pointer}dp-day-calendar .dp-selected{background:#106cc8;color:#fff}dp-day-calendar .dp-next-month,dp-day-calendar .dp-prev-month{opacity:.5}dp-day-calendar .dp-hide-near-month .dp-next-month,dp-day-calendar .dp-hide-near-month .dp-prev-month{visibility:hidden}dp-day-calendar .dp-week-number{position:absolute;font-size:9px}dp-day-calendar.dp-material .dp-calendar-weekday{height:25px;width:30px;line-height:25px;color:#7a7a7a;border:none}dp-day-calendar.dp-material .dp-calendar-wrapper{border:1px solid #e0e0e0}dp-day-calendar.dp-material .dp-calendar-day,dp-day-calendar.dp-material .dp-calendar-month{box-sizing:border-box;background:#fff;border-radius:50%;border:none;outline:0}dp-day-calendar.dp-material .dp-calendar-day:hover,dp-day-calendar.dp-material .dp-calendar-month:hover{background:#e0e0e0}dp-day-calendar.dp-material .dp-selected{background:#106cc8;color:#fff}dp-day-calendar.dp-material .dp-selected:hover{background:#106cc8}dp-day-calendar.dp-material .dp-current-day{border:1px solid #106cc8}"] }), __metadata("design:paramtypes", [DayCalendarService, UtilsService, core.ChangeDetectorRef]) ], DayCalendarComponent); return DayCalendarComponent; }()); var moment$3 = momentNs; var FIRST_PM_HOUR = 12; var TimeSelectService = /** @class */ (function () { function TimeSelectService(utilsService) { this.utilsService = utilsService; this.DEFAULT_CONFIG = { hours12Format: 'hh', hours24Format: 'HH', meridiemFormat: 'A', minutesFormat: 'mm', minutesInterval: 1, secondsFormat: 'ss', secondsInterval: 1, showSeconds: false, showTwentyFourHours: false, timeSeparator: ':', locale: moment$3.locale() }; } TimeSelectService.prototype.getConfig = function (config) { var timeConfigs = { maxTime: this.utilsService.onlyTime(config && config.maxTime), minTime: this.utilsService.onlyTime(config && config.minTime) }; var _config = __assign({}, this.DEFAULT_CONFIG, this.utilsService.clearUndefined(config), timeConfigs); moment$3.locale(_config.locale); return _config; }; TimeSelectService.prototype.getTimeFormat = function (config) { return (config.showTwentyFourHours ? config.hours24Format : config.hours12Format) + config.timeSeparator + config.minutesFormat + (config.showSeconds ? (config.timeSeparator + config.secondsFormat) : '') + (config.showTwentyFourHours ? '' : ' ' + config.meridiemFormat); }; TimeSelectService.prototype.getHours = function (config, t) { var time = t || moment$3(); return time && time.format(config.showTwentyFourHours ? config.hours24Format : config.hours12Format); }; TimeSelectService.prototype.getMinutes = function (config, t) { var time = t || moment$3(); return time && time.format(config.minutesFormat); }; TimeSelectService.prototype.getSeconds = function (config, t) { var time = t || moment$3(); return time && time.format(config.secondsFormat); }; TimeSelectService.prototype.getMeridiem = function (config, time) { return time && time.format(config.meridiemFormat); }; TimeSelectService.prototype.decrease = function (config, time, unit) { var amount = 1; switch (unit) { case 'minute': amount = config.minutesInterval; break; case 'second': amount = config.secondsInterval; break; } return time.clone().subtract(amount, unit); }; TimeSelectService.prototype.increase = function (config, time, unit) { var amount = 1; switch (unit) { case 'minute': amount = config.minutesInterval; break; case 'second': amount = config.secondsInterval; break; } return time.clone().add(amount, unit); }; TimeSelectService.prototype.toggleMeridiem = function (time) { if (time.hours() < FIRST_PM_HOUR) { return time.clone().add(12, 'hour'); } else { return time.clone().subtract(12, 'hour'); } }; TimeSelectService.prototype.shouldShowDecrease = function (config, time, unit) { if (!config.min && !config.minTime) { return true; } var newTime = this.decrease(config, time, unit); return (!config.min || config.min.isSameOrBefore(newTime)) && (!config.minTime || config.minTime.isSameOrBefore(this.utilsService.onlyTime(newTime))); }; TimeSelectService.prototype.shouldShowIncrease = function (config, time, unit) { if (!config.max && !config.maxTime) { return true; } var newTime = this.increase(config, time, unit); return (!config.max || config.max.isSameOrAfter(newTime)) && (!config.maxTime || config.maxTime.isSameOrAfter(this.utilsService.onlyTime(newTime))); }; TimeSelectService.prototype.shouldShowToggleMeridiem = function (config, time) { if (!config.min && !config.max && !config.minTime && !config.maxTime) { return true; } var newTime = this.toggleMeridiem(time); return (!config.max || config.max.isSameOrAfter(newTime)) && (!config.min || config.min.isSameOrBefore(newTime)) && (!config.maxTime || config.maxTime.isSameOrAfter(this.utilsService.onlyTime(newTime))) && (!conf