UNPKG

@jermeo/ionic4-datepicker

Version:

ionic4-datepicker inspired by rajeshwar patlolla ionic1 datepicker

2 lines 29.8 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("moment"),require("@angular/common"),require("@angular/core"),require("@angular/forms"),require("@ionic/angular")):"function"==typeof define&&define.amd?define("@jermeo/ionic4-datepicker",["exports","moment","@angular/common","@angular/core","@angular/forms","@ionic/angular"],e):e((t.jermeo=t.jermeo||{},t.jermeo["ionic4-datepicker"]={}),t.moment_,t.ng.common,t.ng.core,t.ng.forms,t.angular)}(this,function(t,e,o,n,i,a){"use strict";var r=(s.decorators=[{type:n.Injectable,args:[{providedIn:"root"}]}],s.ctorParameters=function(){return[]},s.ngInjectableDef=n.ɵɵdefineInjectable({factory:function(){return new s},token:s,providedIn:"root"}),s);function s(){this.isModalOpen=!1}function l(e,r,s,l){return new(s=s||Promise)(function(t,o){function n(t){try{a(l.next(t))}catch(e){o(e)}}function i(t){try{a(l["throw"](t))}catch(e){o(e)}}function a(e){e.done?t(e.value):new s(function(t){t(e.value)}).then(n,i)}a((l=l.apply(e,r||[])).next())})}function c(n,i){var a,r,s,t,l={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]};return t={next:e(0),"throw":e(1),"return":e(2)},"function"==typeof Symbol&&(t[Symbol.iterator]=function(){return this}),t;function e(e){return function(t){return function o(t){if(a)throw new TypeError("Generator is already executing.");for(;l;)try{if(a=1,r&&(s=2&t[0]?r["return"]:t[0]?r["throw"]||((s=r["return"])&&s.call(r),0):r.next)&&!(s=s.call(r,t[1])).done)return s;switch(r=0,s&&(t=[2&t[0],s.value]),t[0]){case 0:case 1:s=t;break;case 4:return l.label++,{value:t[1],done:!1};case 5:l.label++,r=t[1],t=[0];continue;case 7:t=l.ops.pop(),l.trys.pop();continue;default:if(!(s=0<(s=l.trys).length&&s[s.length-1])&&(6===t[0]||2===t[0])){l=0;continue}if(3===t[0]&&(!s||t[1]>s[0]&&t[1]<s[3])){l.label=t[1];break}if(6===t[0]&&l.label<s[1]){l.label=s[1],s=t;break}if(s&&l.label<s[2]){l.label=s[2],l.ops.push(t);break}s[2]&&l.ops.pop(),l.trys.pop();continue}t=i.call(n,l)}catch(e){t=[6,e],r=0}finally{a=s=0}if(5&t[0])throw t[1];return{value:t[0]?t[1]:void 0,done:!0}}([e,t])}}}function d(t,e){var o="function"==typeof Symbol&&t[Symbol.iterator];if(!o)return t;var n,i,a=o.call(t),r=[];try{for(;(void 0===e||0<e--)&&!(n=a.next()).done;)r.push(n.value)}catch(s){i={error:s}}finally{try{n&&!n.done&&(o=a["return"])&&o.call(a)}finally{if(i)throw i.error}}return r}function h(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(d(arguments[e]));return t}var p=e,u=(m.prototype.ngOnInit=function(){this.datePickerService.isModalOpen=!0,this.initDatePicker()},m.prototype.ngOnDestroy=function(){this.datePickerService.isModalOpen=!1},m.prototype.resetHMSM=function(t){return t.setHours(0),t.setMinutes(0),t.setSeconds(0),t.setMilliseconds(0),t},m.prototype.changeToDateList=function(){this.isMonthYearSelectorOpen=!1},m.prototype.selectMonthYear=function(t){this.isMonthYearSelectorOpen=!0,this.isMonthSelect=t,this.scrollingMonthOrYearArray=t?this.mainObj.monthsList:this.yearsList,this.selectedYearOrMonth=t?this.data.currentMonth:this.data.currentYear;var e=this.scrollingMonthOrYearArray.indexOf(this.selectedYearOrMonth)+"list";setTimeout(function(){document.getElementById(e).scrollIntoView()},100)},m.prototype.onChangeMonthYear=function(t){if(t){if(this.isMonthSelect){this.data.currentMonth=t,this.selectedYearOrMonth=this.data.currentMonth;var e=this.monthsList.indexOf(this.data.currentMonth);this.currentDate.setDate(1),this.currentDate.setMonth(e)}else this.data.currentYear=t,this.selectedYearOrMonth=this.data.currentYear,this.currentDate.setFullYear(this.data.currentYear),this.refreshDateList(this.currentDate);this.refreshDateList(this.currentDate)}this.isMonthYearSelectorOpen=!1},m.prototype.prevMonth=function(){var t=this.currentDate.getMonth(),e=this.currentDate.getFullYear();e<=this.yearsList[this.yearsList.length-1]&&0===t||(1===t&&this.currentDate.setFullYear(e),this.currentDate.setMonth(t-1),this.data.currentMonth=this.mainObj.monthsList[t],this.data.currentYear=e,this.refreshDateList(this.currentDate))},m.prototype.nextMonth=function(){var t=this.currentDate.getMonth(),e=this.currentDate.getFullYear();e>=this.yearsList[0]&&11===t||(11===t&&this.currentDate.setFullYear(e),this.currentDate.setDate(1),this.currentDate.setMonth(t+1),this.data.currentMonth=this.mainObj.monthsList[t],this.data.currentYear=e,this.refreshDateList(this.currentDate))},m.prototype.changeDaySelected=function(){var t=new Date(this.selctedDateEpoch);t.setMonth(this.currentDate.getMonth()),t.setYear(this.currentDate.getFullYear()),this.selctedDateEpoch=t.getTime(),this.selectedDateString=this.formatDate()},m.prototype.dateSelected=function(t){if(t&&!t.disabled){if(!t||0===Object.keys(t).length)return;this.isSelectedDateFound=!0,this.selctedDateEpoch=t.epoch,this.selectedDateString=this.formatDate(),this.mainObj.closeOnSelect&&this.closeModal(this.selctedDateEpoch)}},m.prototype.setIonicDatePickerTodayDate=function(){var t=new Date(this.today),e={date:t.getDate(),month:t.getMonth(),year:t.getFullYear(),day:t.getDay(),epoch:t.getTime(),disabled:!1};this.dateSelected(e),this.refreshDateList(new Date),this.selctedDateEpoch=this.resetHMSM(t).getTime(),this.selectedDateString=this.formatDate()},m.prototype.setIonicDatePickerDate=function(){this.closeModal(this.selctedDateEpoch)},m.prototype.setDisabledDates=function(t){if(t.disabledDates&&0!==t.disabledDates.length){this.disabledDates=[];for(var e=0;e<t.disabledDates.length;e++)this.disabledDates.push(this.resetHMSM(new Date(t.disabledDates[e])).getTime())}else this.disabledDates=[]},m.prototype.setHightlightedDates=function(t){if(t.highlightedDates&&0!==t.highlightedDates.length){this.highlightedDates={};for(var e=0;e<t.highlightedDates.length;e++){var o=t.highlightedDates[e].date,n=t.highlightedDates[e].color,i=t.highlightedDates[e].fontColor,a=this.resetHMSM(new Date(o)).getTime();this.highlightedDates[a]={color:n,fontColor:i}}}else this.highlightedDates={}},m.prototype.refreshDateList=function(t){t=this.resetHMSM(t),this.currentDate=t;var e,o,n=new Date(t.getFullYear(),t.getMonth(),1).getDate(),i=new Date(t.getFullYear(),t.getMonth()+1,0).getDate();this.monthsList=[],this.mainObj.monthsList&&12===this.mainObj.monthsList.length?this.monthsList=this.mainObj.monthsList:this.monthsList=this.monthsList,this.yearsList=this.getYearsList(this.mainObj.from,this.mainObj.to),this.daysList=[],this.firstDayEpoch=this.resetHMSM(new Date(t.getFullYear(),t.getMonth(),n)).getTime(),this.lastDayEpoch=this.resetHMSM(new Date(t.getFullYear(),t.getMonth(),i)).getTime();for(var a=n;a<=i;a++){o=!1;var r=(e=new Date(t.getFullYear(),t.getMonth(),a)).getDay();0<this.disableWeekdays.length&&(o=0<=this.disableWeekdays.indexOf(r)&&0<=this.disableWeekdays.indexOf(r)),0<this.disabledDates.length&&0<=this.disabledDates.indexOf(e.getTime())&&(o=!0),this.fromDate&&!o&&(o=e.getTime()<this.fromDate||0<=this.mainObj.disableWeekDays.indexOf(e.getDay())),this.toDate&&!o&&(o=e.getTime()>this.toDate||0<=this.mainObj.disableWeekDays.indexOf(e.getDay()));var s=this.highlightedDates[e.getTime()],l=null;0===e.getDay()&&this.mainObj.isSundayHighlighted&&this.mainObj.isSundayHighlighted.fontColor?l=this.mainObj.isSundayHighlighted.fontColor:s&&s.fontColor&&(l=s.fontColor),this.daysList.push({date:e.getDate(),month:e.getMonth(),year:e.getFullYear(),day:e.getDay(),epoch:e.getTime(),disabled:o,color:s&&s.color?s.color:null,fontColor:l})}var c=this.daysList[0].day-this.mainObj.mondayFirst;c=c<0?6:c;for(var d=0;d<c;d++)this.daysList.unshift({});this.rows=[0,7,14,21,28,35],this.cols=[0,1,2,3,4,5,6],this.data.currentMonth=this.mainObj.monthsList[t.getMonth()],this.data.currentYear=t.getFullYear(),this.data.currentMonthSelected=this.data.currentMonth,this.currentYearSelected=this.data.currentYear,this.numColumns=7},m.prototype.setInitialObj=function(t){this.mainObj=t,this.isSelectedDateFound&&(this.isSelectedDateFound=!0,this.selctedDateEpoch=this.resetHMSM(this.mainObj.inputDate).getTime()),this.selectedDateString=this.formatDate(),this.mainObj.weeksList&&7===this.mainObj.weeksList.length&&(this.weeksList=this.mainObj.weeksList),this.mainObj.mondayFirst&&this.weeksList.push(this.mainObj.weeksList.shift()),this.mainObj.yearInAscending&&(this.yearInAscending=this.mainObj.yearInAscending),this.mainObj.momentLocale&&(this.momentLocale=this.mainObj.momentLocale),this.disableWeekdays=this.mainObj.disableWeekDays,this.setDisabledDates(this.mainObj),this.refreshDateList(this.mainObj.inputDate)},m.prototype.closeModal=function(t){this.modalCtrl.getTop();var e=p(t).format(this.mainObj.dateFormat);this.modalCtrl.dismiss({date:e})},m.prototype.closeIonicDatePickerModal=function(){this.closeModal(null)},m.prototype.getYearsList=function(t,e){var o=[],n=1950,i=(new Date).getFullYear()+1;if(n=t?new Date(t).getFullYear():n,i=e?new Date(e).getFullYear():i,this.yearInAscending)for(var a=n;a<=i;a++)o.push(a);else for(a=i;n<=a;a--)o.push(a);return o},m.prototype.initDatePicker=function(){this.fromDate="",this.toDate="",this.mainObj.from&&(this.fromDate=this.resetHMSM(new Date(this.mainObj.from)).getTime()),this.mainObj.to&&(this.toDate=this.resetHMSM(new Date(this.mainObj.to)).getTime()),this.setInitialObj(this.mainObj)},m.prototype.initDatePickerObj=function(t){t.inputDate&&!this.selectedDate.date&&(this.isSelectedDateFound=!0,this.selectedDate.date=t.inputDate);var e={};if(e.from=t.fromDate?t.fromDate:"",e.to=t.toDate?t.toDate:"",e.showTodayButton=t.showTodayButton===undefined||t.showTodayButton,e.closeOnSelect=!!t.closeOnSelect&&t.closeOnSelect,e.disableWeekDays=t.disableWeekDays?t.disableWeekDays:[],e.mondayFirst=!!t.mondayFirst&&t.mondayFirst,e.setLabel=t.setLabel?t.setLabel:"Set",e.todayLabel=t.todayLabel?t.todayLabel:"Today",e.closeLabel=t.closeLabel?t.closeLabel:"Close",e.disabledDates=t.disabledDates?t.disabledDates:[],e.titleLabel=t.titleLabel?t.titleLabel:null,e.showHeader=t.showHeader===undefined||t.showHeader,e.showFooter=t.showFooter===undefined||t.showFooter,e.showDateInTitle=t.showDateInTitle===undefined||t.showDateInTitle,e.monthsList=t.monthsList?t.monthsList:this.monthsList,e.monthsList=h(e.monthsList),e.weeksList=t.weeksList?t.weeksList:this.weeksList,e.weeksList=h(e.weeksList),e.dateFormat=t.dateFormat?t.dateFormat:"DD MMM YYYY",e.clearButton=!!t.clearButton&&t.clearButton,e.yearInAscending=!!t.yearInAscending&&t.yearInAscending,e.momentLocale=t.momentLocale?t.momentLocale:"en-US",p.locale(e.momentLocale),e.inputDate=this.selectedDate.date?p(this.selectedDate.date,e.dateFormat).toDate():new Date,e.btnCloseSetInReverse=!!t.btnCloseSetInReverse&&t.btnCloseSetInReverse,e.btnProperties={},t.btnProperties){var o=t.btnProperties;e.btnProperties.expand=o.expand?o.expand:"block",e.btnProperties.fill=o.fill?o.fill:"solid",e.btnProperties.size=o.size?o.size:"default",e.btnProperties.color=o.color?o.color:"",e.btnProperties.disabled=!!o.disabled&&o.disabled,e.btnProperties.strong=!!o.strong&&o.strong}else e.btnProperties.expand="block",e.btnProperties.fill="solid",e.btnProperties.size="default",e.btnProperties.disabled=!1,e.btnProperties.strong=!1;if(e.arrowNextPrev={},t.arrowNextPrev){var n=t.arrowNextPrev;e.arrowNextPrev.nextArrowSrc=!!n.nextArrowSrc&&n.nextArrowSrc,e.arrowNextPrev.prevArrowSrc=!!n.prevArrowSrc&&n.prevArrowSrc}if(e.highlightedDates=[],t.highlightedDates&&0<t.highlightedDates.length&&(e.highlightedDates=t.highlightedDates,this.setHightlightedDates(e)),e.isSundayHighlighted={},t.isSundayHighlighted){var i=t.isSundayHighlighted;e.isSundayHighlighted.fontColor=i.fontColor?i.fontColor:null}return e},m.prototype.formatDate=function(){return p(this.selctedDateEpoch).format(this.mainObj.dateFormat)},m.decorators=[{type:n.Component,args:[{selector:"li-ionic4-datepicker-modal",template:'<ion-header [hidden]="!mainObj?.showHeader">\n <ion-toolbar (click)="changeToDateList()" class="ion-no-padding">\n <ion-title>\n <h1 *ngIf="mainObj?.titleLabel">{{mainObj?.titleLabel}}</h1>\n <span *ngIf="mainObj?.showDateInTitle">{{selectedDateString}}</span>\n </ion-title>\n </ion-toolbar>\n</ion-header>\n\n<ion-content forceOverscroll="false" class="ionic_datepicker_modal_content">\n <ion-grid class="dp-month-year-container" [ngClass]="isMonthYearSelectorOpen ? \'dp-virual-scroller-hide\' : \'dp-virual-scroller-show\'">\n <ion-row>\n <ion-col size="1.5" class="dp-left-right-arrow" (click)="prevMonth()">\n <ion-button [ngClass]="{\'pointer_events_none\':((firstDayEpoch - 86400000) < fromDate)}">\n <ion-icon *ngIf="!mainObj?.arrowNextPrev?.prevArrowSrc" name="arrow-back"></ion-icon>\n <ion-icon *ngIf="mainObj?.arrowNextPrev?.prevArrowSrc" src="{{mainObj?.arrowNextPrev?.prevArrowSrc}}"></ion-icon>\n </ion-button>\n </ion-col>\n <ion-col size="9">\n <ion-grid>\n <ion-row>\n <ion-col class="dp-select-month-year" size="5.5" class="ion-no-padding" (click)="selectMonthYear(true)">\n <ion-button class="dp-buttons">\n {{ data.currentMonth }}\n <ion-icon name="md-arrow-dropdown" class="dp-down-arrow"></ion-icon>\n </ion-button>\n </ion-col>\n <ion-col size="1"></ion-col>\n <ion-col class="dp-select-month-year" size="5.5" class="ion-no-padding" (click)="selectMonthYear(false)">\n <ion-button class="dp-buttons">\n {{ data.currentYear }}\n <ion-icon name="md-arrow-dropdown" class="dp-down-arrow"></ion-icon>\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-grid>\n </ion-col>\n <ion-col size="1.5" class="dp-left-right-arrow" (click)="nextMonth()">\n <ion-button [ngClass]="{\'pointer_events_none\':((lastDayEpoch + 86400000)> toDate)}">\n <ion-icon *ngIf="!mainObj?.arrowNextPrev?.nextArrowSrc" name="arrow-forward"></ion-icon>\n <ion-icon *ngIf="mainObj?.arrowNextPrev?.nextArrowSrc" src="{{mainObj?.arrowNextPrev?.nextArrowSrc}}"></ion-icon>\n </ion-button>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n <ion-grid class="dp-weeks-container" *ngIf="daysList" [ngClass]="isMonthYearSelectorOpen ? \'dp-virual-scroller-hide\' : \'dp-virual-scroller-show\'">\n <ion-row class=" dp-weeks-name">\n <ion-col *ngFor="let weekName of mainObj?.weeksList; let i = index">\n \x3c!-- <div class="weeks">{{weekName}} {{i}}</div> --\x3e\n <div class="weeks" *ngIf="mainObj?.mondayFirst"\n [style.color]="mainObj?.isSundayHighlighted && i === 6 ? mainObj?.isSundayHighlighted.fontColor : \'\'">\n {{weekName}}</div>\n <div class="weeks" *ngIf="!mainObj?.mondayFirst"\n [style.color]="mainObj?.isSundayHighlighted && i === 0 ? mainObj?.isSundayHighlighted.fontColor : \'\'">\n {{weekName}}</div>\n </ion-col>\n </ion-row>\n <ion-row *ngFor="let row of rows;" class="dp-days-list">\n <ion-col *ngFor="let col of cols; let i = index ;" (click)="dateSelected(daysList[row + i])"\n [style.background-color]="(daysList[row + i]?.color) ? (daysList[row + i]?.color) : \'\'"\n [style.border-radius]="(daysList[row + i]?.color) ? \'4px\' : \'\'" class="ion-no-padding" [ngClass]="{\n \'dp-selecteddate\': (daysList[row + i]?.epoch === selctedDateEpoch),\n \'dp-today\' : (daysList[row + i]?.epoch == today),\n \'disabled\' : (daysList[row + i]?.disabled)}">\n <div class="days" [style.color]="(daysList[row + i]?.fontColor) ? (daysList[row + i]?.fontColor) : \'\'">\n {{daysList[row + col]?.date}}\n </div>\n </ion-col>\n </ion-row>\n </ion-grid>\n </ion-col>\n </ion-row>\n </ion-grid>\n <ion-list class="dp-month-year-scroll-container" [ngClass]="isMonthYearSelectorOpen ? \'dp-virual-scroller-show\' : \'dp-virual-scroller-hide\'">\n <ion-item *ngFor="let monthYear of scrollingMonthOrYearArray;let i=index;" id="{{i +\'list\'}}" (click)="onChangeMonthYear(monthYear)">\n <ion-label [ngClass]="selectedYearOrMonth === monthYear ? \'dp-selected\' : \'\'">{{ monthYear }}</ion-label>\n </ion-item>\n </ion-list>\n</ion-content>\n\n<ion-footer [hidden]="!mainObj?.showFooter">\n <ion-toolbar class="ion-no-padding">\n <ion-grid class="ion-no-padding">\n <ion-row class="ion-no-padding" [ngClass]="mainObj?.btnCloseSetInReverse ? \'dp-btn-set-close-in-reverse\' : \'\'">\n <ion-col class="ion-no-padding">\n <ion-button class="ion-button" expand="{{mainObj?.btnProperties?.expand}}" fill="{{mainObj?.btnProperties?.fill}}"\n size="{{mainObj?.btnProperties?.size}}" color="{{mainObj?.btnProperties?.color}}" disabled="{{mainObj?.btnProperties?.disabled}}"\n strong="{{mainObj?.btnProperties?.strong}}" (click)="closeIonicDatePickerModal()">\n {{mainObj?.closeLabel}}\n </ion-button>\n </ion-col>\n <ion-col class="ion-no-padding" *ngIf="mainObj?.showTodayButton">\n <ion-button class="ion-button" expand="{{mainObj?.btnProperties?.expand}}" fill="{{mainObj?.btnProperties?.fill}}"\n size="{{mainObj?.btnProperties?.size}}" color="{{mainObj?.btnProperties?.color}}" disabled="{{mainObj?.btnProperties?.disabled}}"\n strong="{{mainObj?.btnProperties?.strong}}" (click)="setIonicDatePickerTodayDate()">\n {{mainObj?.todayLabel}}\n </ion-button>\n </ion-col>\n <ion-col class="ion-no-padding" *ngIf="!mainObj?.closeOnSelect">\n <ion-button class="ion-button" expand="{{mainObj?.btnProperties?.expand}}"\n fill="{{mainObj?.btnProperties?.fill}}" size="{{mainObj?.btnProperties?.size}}"\n color="{{mainObj?.btnProperties?.color}}"\n disabled="{{mainObj?.btnProperties?.disabled || !isSelectedDateFound}}"\n strong="{{mainObj?.btnProperties?.strong}}" (click)="setIonicDatePickerDate()">\n {{mainObj?.setLabel}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-grid>\n </ion-toolbar>\n</ion-footer>',styles:[":host .no-scroll{--overflow:hidden}:host ion-header{height:60px}:host ion-header ion-toolbar{--background:var(--ion-color-primary);-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;color:var(--ion-color-primary-contrast);min-height:60px}:host ion-header ion-toolbar ion-title{font-size:20px;font-weight:700;text-align:center;padding:0;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;height:100%;cursor:pointer}:host ion-header ion-toolbar ion-title h1{font-size:14px;margin:0 0 4px}:host .ionic_datepicker_modal_content .dp-month-year-container ion-col{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center}:host .ionic_datepicker_modal_content .dp-month-year-container ion-col ion-grid{width:100%}:host .ionic_datepicker_modal_content .dp-month-year-container ion-col ion-grid .dp-select-month-year{border-bottom:1.5px solid;border-bottom-color:var(--ion-color-primary)}:host .ionic_datepicker_modal_content .dp-month-year-container ion-col ion-grid .dp-select-month-year .dp-buttons{width:100%;height:40px;margin:0;padding:0;color:var(--ion-color-primary);--background:transparent;--box-shadow:none}:host .ionic_datepicker_modal_content .dp-month-year-container ion-col ion-grid .dp-select-month-year .dp-buttons.activated{--background-activated:transparent;--color-activated:var(--ion-color-primary)}:host .ionic_datepicker_modal_content .dp-month-year-container ion-col ion-grid .dp-select-month-year .dp-down-arrow{position:absolute;width:16px;right:0;top:10px;color:var(--ion-color-primary)}:host .ionic_datepicker_modal_content .dp-month-year-container .dp-left-right-arrow ion-button{--background:transparent;--background-hover:transparent;--box-shadow:0;color:var(--ion-color-primary)}:host .ionic_datepicker_modal_content .dp-month-year-container .dp-left-right-arrow ion-button:focus{outline:0}:host .ionic_datepicker_modal_content .dp-month-year-container .dp-left-right-arrow ion-button.activated{--ion-color-primary-shade:transparent;--ion-color-primary-contrast:var(--ion-color-primary-tint)}:host .ionic_datepicker_modal_content .dp-weeks-container{margin:4px 0}:host .ionic_datepicker_modal_content .dp-weeks-container .dp-weeks-name ion-col{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center}:host .ionic_datepicker_modal_content .dp-weeks-container .dp-weeks-name ion-col .weeks{width:14%;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;font-weight:700}:host .ionic_datepicker_modal_content .dp-weeks-container .dp-days-list ion-col{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;padding:10px;cursor:pointer}:host .ionic_datepicker_modal_content .dp-weeks-container .dp-days-list ion-col .days{width:14%;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center}:host .ionic_datepicker_modal_content .dp-selecteddate{background:var(--ion-color-primary);color:var(--ion-color-primary-contrast);border-radius:4px;font-weight:500}:host .ionic_datepicker_modal_content .dp-today{border-radius:4px;font-weight:500;border:1px solid;border-color:var(--ion-color-primary)}:host .ionic_datepicker_modal_content .dp-month-year-scroll-container{position:absolute;top:0;bottom:0;left:0;right:0;margin:0;overflow-y:scroll}:host .ionic_datepicker_modal_content .dp-month-year-scroll-container ion-item{--padding-start:0;--inner-padding-end:0;--inner-border-width:0;cursor:pointer}:host .ionic_datepicker_modal_content .dp-month-year-scroll-container ion-item ion-label{text-align:center;margin:0;font-size:16px}:host .ionic_datepicker_modal_content .dp-month-year-scroll-container ion-item ion-label.dp-selected{color:var(--ion-color-primary);font-size:20px;font-weight:500}:host .disabled{color:#aaa}:host .dp-virual-scroller-show{-webkit-transition:opacity .3s ease-in;transition:opacity .3s ease-in;opacity:1;visibility:visible}:host .dp-virual-scroller-hide{opacity:0;visibility:hidden;height:auto}:host ion-footer{height:55px}:host ion-footer ion-toolbar{height:100%;--border-width:0;--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px}:host ion-footer ion-toolbar .toolbar-container{height:100%}:host ion-footer ion-toolbar .dp-btn-set-close-in-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;flex-direction:row-reverse}:host ion-footer ion-toolbar ion-button{--border-radius:0;height:55px;margin:0}:host ion-footer ion-toolbar ion-button:focus{outline:0}:host ion-footer ion-toolbar ion-button.activated{--background-activated:var(--ion-color-primary-tint);--color-activated:var(--ion-color-primary-contrast)}"]}]}],m.ctorParameters=function(){return[{type:a.NavParams},{type:a.ModalController},{type:r}]},m.propDecorators={content:[{type:n.ViewChild,args:[a.IonContent,{"static":!0}]}]},m);function m(t,e,o){this.navParams=t,this.modalCtrl=e,this.datePickerService=o,this.mainObj={},this.selectedDate={},this.selctedDateEpoch=0,this.disabledDates=[],this.highlightedDates={},this.disableWeekdays=[],this.data={currentMonth:"",currentYear:"",currentMonthSelected:""},this.rows=[0,7,14,21,28,35],this.cols=[0,1,2,3,4,5,6],this.monthsList=["Jan","Feb","March","April","May","June","July","Aug","Sept","Oct","Nov","Dec"],this.weeksList=["S","M","T","W","T","F","S"],this.yearsList=[],this.daysList=[],this.yearInAscending=!1,this.momentLocale="en-US",this.isMonthYearSelectorOpen=!1,this.scrollingMonthOrYearArray=[],this.isSelectedDateFound=!1,this.today=this.resetHMSM(new Date).getTime(),this.navParams.get("selectedDate")&&(this.selectedDate.date=this.navParams.get("selectedDate"),this.isSelectedDateFound=!0),this.mainObj=this.initDatePickerObj(this.navParams.get("objConfig"))}var b=function(){},g={provide:i.NG_VALUE_ACCESSOR,useExisting:n.forwardRef(function(){return y}),multi:!0},y=(f.prototype.ngOnInit=function(){var e=this;!1!==this.inputDateConfig.clearButton&&(this.closeIcon=document.createElement("ion-icon"),this.closeIcon.name="close-circle",this.closeIcon.className="clearButton",this.closeIcon.style.position="absolute",this.closeIcon.style.right="8px",this.closeIcon.style.bottom="0px",this.closeIcon.style.fontSize="18px",this.closeIcon.style.color="#A9A9A9",this.closeIcon.style.zIndex="5","ION-ITEM"===this.el.nativeElement.parentNode.nodeName&&(this.closeIcon.style.bottom="30%"),this.el.nativeElement.setAttribute("style","position: relative; width: 100%;"),this.el.nativeElement.appendChild(this.closeIcon),this.renderer2.listen(this.closeIcon,"click",function(t){e.selectedDate=new Date,e.value=""}))},f.prototype.onChangeValue=function(t){!1!==this.inputDateConfig.clearButton&&(this.closeIcon.style.visibility=t?"visible":"hidden")},f.prototype.openDatePicker=function(n){return l(this,void 0,void 0,function(){var e,o=this;return c(this,function(t){switch(t.label){case 0:return n&&(this.selectedDate.date=n),[4,this.modalCtrl.create({component:u,cssClass:"li-ionic4-datePicker",componentProps:{objConfig:this.inputDateConfig,selectedDate:this.selectedDate.date}})];case 1:return[4,(e=t.sent()).present()];case 2:return t.sent(),e.onDidDismiss().then(function(t){t.data&&t.data.date&&"Invalid date"!==t.data.date&&(o.selectedDate.date=t.data.date,o.value=t.data.date)}),[2]}})})},Object.defineProperty(f.prototype,"value",{get:function(){return this.innerValue},set:function(t){t!==this.innerValue&&(this.innerValue=t,this.onChangeCallback(t)),this.onChangeValue(t)},enumerable:!0,configurable:!0}),f.prototype.onBlur=function(){this.onTouchedCallback()},f.prototype.writeValue=function(t){t!==this.innerValue&&(this.innerValue=t),this.onChangeValue(t)},f.prototype.registerOnChange=function(t){this.onChangeCallback=t},f.prototype.registerOnTouched=function(t){this.onTouchedCallback=t},f.decorators=[{type:n.Component,args:[{selector:"li-ionic4-datepicker",template:'<input type="text" class="li-dp-input" (focus)="$event.preventDefault()" (click)="openDatePicker(value)" readonly\n [(ngModel)]="value" start />',providers:[g],styles:[":host input{font-size:16px;margin:6px 0;border:0;border-bottom:1px solid #ccc;width:100%;padding:12px}@media (min-width:768px){:host input{font-size:18px}}:host input.has-focus,:host input:focus{outline:0;box-shadow:unset}"]}]}],f.ctorParameters=function(){return[{type:a.ModalController},{type:n.ElementRef},{type:n.Renderer2}]},f.propDecorators={inputDateConfig:[{type:n.Input}]},f);function f(t,e,o){this.modalCtrl=t,this.el=e,this.renderer2=o,this.selectedDate={},this.innerValue="",this.onTouchedCallback=b,this.onChangeCallback=b}var D=(w.prototype.ngOnInit=function(){var e=this;!1!==this.inputDateConfig.clearButton&&(this.closeIcon=document.createElement("ion-icon"),this.closeIcon.name="close-circle",this.closeIcon.className="clearButton",this.closeIcon.style.position="absolute",this.closeIcon.style.right="8px",this.closeIcon.style.bottom="30%",this.closeIcon.style.fontSize="18px",this.closeIcon.style.color="#A9A9A9",this.closeIcon.style.zIndex="5","ION-ITEM"===this.el.nativeElement.parentNode.nodeName&&(this.closeIcon.style.bottom="12px"),this.el.nativeElement.parentNode.appendChild(this.closeIcon),this.renderer2.listen(this.closeIcon,"click",function(t){e.selectedDate.date=new Date,e.control.control.setValue(""),e.ngModel.update.emit("")}));var o=this;this.ngModel.valueChanges.subscribe(function(t){o.selectedDate.date=t,!1!==e.inputDateConfig.clearButton&&(e.closeIcon.style.visibility=t?"visible":"hidden")}),this.control.control.valueChanges.subscribe(function(t){o.selectedDate.date=t,!1!==e.inputDateConfig.clearButton&&(e.closeIcon.style.visibility=t?"visible":"hidden")}),this.control.control.value&&(this.selectedDate.date=this.control.control.value)},w.prototype.onFocus=function(){this.datePickerService.isModalOpen||this.openDatePicker()},w.prototype.openDatePicker=function(){return l(this,void 0,void 0,function(){var e,o=this;return c(this,function(t){switch(t.label){case 0:return[4,this.modalCtrl.create({component:u,cssClass:"li-ionic4-datePicker",componentProps:{objConfig:this.inputDateConfig,selectedDate:this.selectedDate.date}})];case 1:return[4,(e=t.sent()).present()];case 2:return t.sent(),e.onDidDismiss().then(function(t){t.data&&t.data.date&&"Invalid date"!==t.data.date&&(o.selectedDate.date=t.data.date,o.control.control.setValue(t.data.date),o.ngModel.update.emit(t.data.date))}),[2]}})})},w.decorators=[{type:n.Directive,args:[{selector:"[liIonic4Datepicker]",exportAs:"liIonic4Datepicker",providers:[i.NgModel]}]}],w.ctorParameters=function(){return[{type:a.ModalController},{type:i.NgModel},{type:i.NgControl},{type:n.ElementRef},{type:n.Renderer2},{type:r}]},w.propDecorators={inputDateConfig:[{type:n.Input,args:["liIonic4Datepicker"]}],onFocus:[{type:n.HostListener,args:["ionFocus"]}]},w);function w(t,e,o,n,i,a){this.modalCtrl=t,this.ngModel=e,this.control=o,this.el=n,this.renderer2=i,this.datePickerService=a,this.selectedDate={},this.isModalOpen=!1}var v=(k.decorators=[{type:n.NgModule,args:[{imports:[o.CommonModule,i.FormsModule,a.IonicModule],declarations:[y,D,u],exports:[y,D,u,o.CommonModule,i.FormsModule],entryComponents:[u],providers:[]}]}],k);function k(){}t.Ionic4DatepickerService=r,t.CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR=g,t.Ionic4DatepickerComponent=y,t.Ionic4DatepickerModule=v,t.Ionic4DatepickerModalComponent=u,t.ɵa=D,Object.defineProperty(t,"__esModule",{value:!0})}); //# sourceMappingURL=jermeo-ionic4-datepicker.umd.min.js.map