angular-nepali-datepicker
Version:
Simple Nepali datepicker component for angular applications
2 lines • 13.1 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("nepali-date"),require("@angular/forms"),require("@angular/core"),require("@angular/common"),require("@angular/cdk/overlay")):"function"==typeof define&&define.amd?define("angular-nepali-datepicker",["exports","nepali-date","@angular/forms","@angular/core","@angular/common","@angular/cdk/overlay"],t):t(e["angular-nepali-datepicker"]={},e.NepaliDateConverter,e.ng.forms,e.ng.core,e.ng.common,e.ng.cdk.overlay)}(this,function(e,o,t,a,n,r){"use strict";var i=function(){return(i=Object.assign||function(e){for(var t,a=1,n=arguments.length;a<n;a++)for(var r in t=arguments[a])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e}).apply(this,arguments)};function s(e,t){var a="function"==typeof Symbol&&e[Symbol.iterator];if(!a)return e;var n,r,o=a.call(e),i=[];try{for(;(void 0===t||0<t--)&&!(n=o.next()).done;)i.push(n.value)}catch(s){r={error:s}}finally{try{n&&!n.done&&(a=o["return"])&&a.call(o)}finally{if(r)throw r.error}}return i}function c(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(s(arguments[t]));return e}var p=["०","१","२","३","४","५","६","७","८","९"],d={year:"साल",month:"महिना"},l={en:{"default":["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],"short":["Su","Mo","Tu","We","Th","Fr","Sa"]},ne:{"default":["आइत","सोम","मंगल्","बुध","बिही","शुक्र","शनि"],"short":["आ","सो","मं","बु","बि","शु","श"]}},h={en:{"default":["Baisakh","Jestha","Asadh","Shrawan","Bhadra","Ashwin","Kartik","Mangsir","Poush","Marga","Falgun","Chaitra"],modern:["Baisakh","Jeth","Asaar","Saawn","Bhadau","Aashoj","Kartik","Mangsir","Push","Magh","Fagun","Chait"],"short":["Bai","Jes","Asa","Shr","Bha","Ash","Kar","Man","Pou","Mar","Fal","Cha"]},ne:{"default":["बैशाख","जेष्ठ","आषाढ","श्रवण","भाद्र","आश्विन","कार्तिक","मंसिर","पौष","मार्ग","फाल्गुन","चैत्र"],modern:["बैशाख","जेठ","असार","साउन","भदौ","अशोज","कार्तिक","मंसिर","पुष","माघ","फागुन","चैत"],"short":["बै","जे","अ","श्रा","भा","आ","का","मं","पौ","मा","फा","चै"]}},u=function(){function e(){var t=this;this.nepaliDateToday={day:0,month:0,year:0},this.currentNepaliDate={day:0,month:0,year:0},this.formattedDate="",this.currentDate=new Date,this.years=[],this.daysMapping=l,this.monthsMapping=h,this.isOpen=!1,this.hideInput=!1,this.alwaysVisible=!1,this.language="ne",this.monthDisplayType="default",this.dayDisplayType="default",this.dateFormatter=function(e){return(e.day<10?"0"+e.day:e.day)+"/"+(e.month<10?"0"+e.month:e.month)+"/"+t.selectedDate.year},this.propagateChange=function(e){},this.propagateTouch=function(e){}}return e.prototype.ngOnInit=function(){var e=new o(new Date);this.nepaliDateToday={year:e.getYear(),month:e.getMonth(),day:e.getDate()},this.setCurrentDate(),this.populateYears(),this.setCurrentMonthData()},e.prototype.setCurrentDate=function(){var e;if(this.selectedDate){var t=this.selectedDate,a=t.year,n=t.month,r=t.day;e=new o(a,n,r),this.currentDate=e.getEnglishDate()}else e=new o(this.currentDate);this.currentNepaliDate={year:e.getYear(),month:e.getMonth(),day:e.getDate()}},e.prototype.populateYears=function(){for(var e=2001;e<=2088;e++)this.years.push(e)},e.prototype.resetCurrentMonthData=function(){this.currentMonthData={0:[],1:[],2:[],3:[],4:[],5:[],6:[]}},e.prototype.formatValue=function(){this.selectedDate&&(this.formattedDate=this.dateFormatter(this.selectedDate))},e.prototype.writeValue=function(e){e&&(this.selectedDate=e,this.currentNepaliDate=e,this.formatValue())},e.prototype.registerOnTouched=function(){},e.prototype.registerOnChange=function(e){this.propagateChange=e},e.prototype.setCurrentMonthData=function(){this.resetCurrentMonthData();var e=this.currentDate.getDay();this.currentMonthData[e]=[this.currentNepaliDate.day],this.setMonthDataBefore(e-1,this.currentNepaliDate.day-1),this.setMonthDataAfter(e+1,this.currentNepaliDate.day+1),this.createEmptySpaces()},e.prototype.setMonthDataBefore=function(e,t){1<=t&&(e<0&&(e=6),this.currentMonthData[e]=c([t],this.currentMonthData[e]),this.setMonthDataBefore(--e,--t))},e.prototype.setMonthDataAfter=function(e,t){new o(this.currentNepaliDate.year,this.currentNepaliDate.month,t).getMonth()===this.currentNepaliDate.month&&(6<e&&(e=0),this.currentMonthData[e]=c(this.currentMonthData[e],[t]),this.setMonthDataAfter(++e,++t))},e.prototype.createEmptySpaces=function(){var a=0;if(Object.values(this.currentMonthData).find(function(e,t){return e.includes(1)&&(a=t),e.includes(1)}),a)for(;0<a;a--){var e=this.currentMonthData[a-1];this.currentMonthData[a-1]=c([null],e)}},e.prototype.selectDate=function(e){this.selectedDate=i({},this.currentNepaliDate,{day:e}),this.formatValue(),this.close(),this.propagateChange(this.selectedDate)},e.prototype.selectYear=function(e){this.currentNepaliDate.year=+e;var t=new o(this.currentNepaliDate.year,this.currentNepaliDate.month,this.currentNepaliDate.day);this.currentDate=t.getEnglishDate(),this.setCurrentMonthData()},e.prototype.selectMonth=function(e){this.currentNepaliDate.month=this.monthsMapping[this.language][this.monthDisplayType].indexOf(e);var t=new o(this.currentNepaliDate.year,this.currentNepaliDate.month,this.currentNepaliDate.day);this.currentDate=t.getEnglishDate(),this.setCurrentMonthData()},e.prototype.toggleOpen=function(){this.alwaysVisible||(this.isOpen=!this.isOpen)},e.prototype.open=function(){this.isOpen=!0},e.prototype.close=function(){this.isOpen=!1,this.setCurrentDate()},e.decorators=[{type:a.Component,args:[{selector:"np-datepicker",template:'<input\r\n class="datepicker__input"\r\n type="text"\r\n [value]="formattedDate | toNp: language"\r\n [ngClass]="inputClass"\r\n #origin="cdkOverlayOrigin"\r\n cdk-overlay-origin\r\n (focus)="open()"\r\n (keydown)="$event.preventDefault()"\r\n aria-hidden="true"\r\n [hidden]="hideInput">\r\n<ng-template\r\n cdk-connected-overlay\r\n cdkConnectedOverlayLockPosition\r\n cdkConnectedOverlayHasBackdrop\r\n cdkConnectedOverlayBackdropClass="cdk-overlay-transparent-backdrop"\r\n [cdkConnectedOverlayOrigin]="origin"\r\n [cdkConnectedOverlayOpen]="isOpen"\r\n (backdropClick)="close()"\r\n (detach)="close()">\r\n <ng-container [ngTemplateOutlet]="dp"></ng-container>\r\n</ng-template>\r\n\r\n<ng-container [ngTemplateOutlet]="dp" *ngIf="alwaysVisible"></ng-container>\r\n\r\n<ng-template #dp>\r\n <div class="datepicker__container">\r\n <div class="datepicker__options-container">\r\n <span class="datepicker__options-year-container">\r\n <span>\r\n {{\'Year\' | toNp : language : \'word\'}}:\r\n </span>\r\n <select (change)="selectYear($event.target.value)">\r\n <option\r\n *ngFor="let year of years"\r\n [value]="year"\r\n [selected]="year === currentNepaliDate?.year">\r\n {{year | toNp: language }}\r\n </option>\r\n </select>\r\n </span>\r\n <span class="datepicker__options-month-container">\r\n <span>{{\'Month\' | toNp : language : \'word\'}}: </span>\r\n <select (change)="selectMonth($event.target.value)">\r\n <option\r\n *ngFor="let month of monthsMapping[language][monthDisplayType]; index as i"\r\n [value]="month"\r\n [selected]="i === currentNepaliDate?.month">\r\n {{month}}\r\n </option>\r\n </select>\r\n </span>\r\n </div>\r\n <div class="datepicker__days-container">\r\n <div class="datepicker__days" *ngFor="let day of daysMapping[language][dayDisplayType]; index as i">\r\n <div class="datepicker__weekday">{{day}}</div>\r\n <div class="datepicker__date-container" *ngFor="let date of currentMonthData[i]">\r\n <div\r\n class="datepicker__date"\r\n [class.datepicker__date--active]="\r\n date === selectedDate?.day &&\r\n currentNepaliDate.month === selectedDate?.month &&\r\n currentNepaliDate.year === selectedDate?.year\r\n "\r\n [class.datepicker__date--current-day]="\r\n date === nepaliDateToday.day &&\r\n currentNepaliDate.month === nepaliDateToday.month &&\r\n currentNepaliDate.year === nepaliDateToday.year\r\n "\r\n [class.datepicker__date--disabled]="!date"\r\n (click)="selectDate(date)">\r\n <span *ngIf="!date"> </span>\r\n {{date | toNp: language }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>',providers:[{provide:t.NG_VALUE_ACCESSOR,useExisting:a.forwardRef(function(){return e}),multi:!0}],encapsulation:a.ViewEncapsulation.None,styles:['.cdk-global-overlay-wrapper,.cdk-overlay-container{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;top:0;bottom:0;left:0;right:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}@media screen and (-ms-high-contrast:active){.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.datepicker__input{display:block}.datepicker__container{--font-family:arial,sans-serif;--font-size:14px;--container-padding:8px 5px;--container-border-color:lightgray;--container-border:1px solid;--container-background-color:white;--select-height:24px;--option-margin:0 0 7px;--option-year-container-margin:0 10px 0;--days-size:40px;--weekday-margin:0 0 5px;--active-day-color:white;--active-day-background:#27a4f7;--hover-color:#27a4f7;--selected-color:#27a4f7;display:inline-block;font-family:"arial, sans-serif";font-family:var(--font-family);font-size:14px;font-size:var(--font-size);padding:8px 5px;padding:var(--container-padding);border:1px solid #d3d3d3;border:var(--container-border);border-color:var(--container-border-color);background-color:#fff;background-color:var(--container-background-color)}.datepicker__options-container{margin:0 0 7px;margin:var(--option-margin)}.datepicker__options-container select{height:24px;height:var(--select-height)}.datepicker__options-year-container{display:inline-block;margin:0 10px;margin:var(--option-year-container-margin)}.datepicker__days{display:inline-block;vertical-align:top;text-align:center;width:40px;width:var(--days-size)}.datepicker__weekday{margin:0 0 5px;margin:var(--weekday-margin);font-weight:700;text-align:center}.datepicker__date{width:40px;width:var(--days-size);height:40px;height:var(--days-size);line-height:40px;line-height:var(--days-size);cursor:pointer}.datepicker__date--active{color:#fff;color:var(--active-day-color);background:#27a4f7;background:var(--active-day-background)}.datepicker__date--current-day:not(.datepicker__date--active){color:#27a4f7;color:var(--selected-color);font-weight:700}.datepicker__date--disabled{pointer-events:none}.datepicker__date:hover:not(.datepicker__date--active){color:#27a4f7;color:var(--hover-color);transition:color .3s}']}]}],e.ctorParameters=function(){return[]},e.propDecorators={hideInput:[{type:a.Input}],alwaysVisible:[{type:a.Input}],inputClass:[{type:a.Input}],language:[{type:a.Input}],monthDisplayType:[{type:a.Input}],dayDisplayType:[{type:a.Input}],dateFormatter:[{type:a.Input}]},e}(),y=function(){function e(){}return e.prototype.transform=function(e,t,a){if(void 0===t&&(t="ne"),void 0===a&&(a="number"),e){if("ne"===t)switch(a){case"number":return e.toString().split("").map(function(e){return" "===e?" ":p[+e]?p[+e]:e}).join("");case"word":return d[e.toString().toLowerCase()]}return e}return""},e.decorators=[{type:a.Pipe,args:[{name:"toNp"}]}],e}(),g=function(){function e(){}return e.decorators=[{type:a.NgModule,args:[{declarations:[u,y],imports:[n.CommonModule,r.OverlayModule],exports:[u]}]}],e}();e.NpDatepickerModule=g,e.DatepickerComponent=u,e.ToNpPipe=y,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=angular-nepali-datepicker.umd.min.js.map