UNPKG

nep-datepicker

Version:

The Angular Nepali Datepicker is an npm package designed to integrate a Nepali date picker component into Angular applications.

1,127 lines (1,121 loc) 62.4 kB
import * as i0 from '@angular/core'; import { Injectable, Pipe, EventEmitter, Component, ViewEncapsulation, Optional, Inject, ViewChild, Input, Output, HostListener, NgModule } from '@angular/core'; import * as i2 from '@angular/common'; import { CommonModule, DatePipe } from '@angular/common'; const englishMonths = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; const englishLeapMonths = [ 31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31, ]; const nepaliMonths = [ [31, 31, 32, 31, 32, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 31, 29, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 32, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 31, 29, 30, 30, 29, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 32, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [30, 32, 31, 32, 31, 31, 29, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 29, 30, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [31, 31, 31, 32, 31, 31, 30, 29, 30, 29, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 29, 31], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 30, 30, 30, 29, 30, 30, 30], [31, 32, 31, 32, 30, 31, 30, 30, 29, 30, 30, 30], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 31, 30, 30, 29, 30, 30, 30], [30, 31, 32, 32, 30, 31, 30, 30, 29, 30, 30, 30], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 30, 30], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 31, 30, 30, 29, 30, 30, 30], [30, 31, 32, 32, 31, 30, 30, 30, 29, 30, 30, 30], [30, 32, 31, 32, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 31, 30, 29, 30, 30, 30, 30], [30, 31, 32, 32, 31, 30, 30, 29, 30, 29, 30, 30], [31, 32, 31, 32, 31, 30, 30, 30, 29, 30, 30, 30], [31, 31, 32, 31, 31, 31, 29, 30, 29, 30, 29, 31], [31, 31, 32, 31, 31, 31, 30, 29, 29, 30, 30, 30], //2099 ]; class NepaliDatepickerAngularPrivateService { constructor() { this.englishMonths = englishMonths; this.englishLeapMonths = englishLeapMonths; this.nepaliMonths = nepaliMonths; this.dateSeparatedCharacters = ['/', '-']; } setCurrentNepaliDate() { let today = new Date(); return this.engToNepDate(today.getDate(), today.getMonth(), today.getFullYear()); } //English to Nepali date conversion engToNepDate(date, month, year) { if (!this.isEnglishRange(date, month, year)) { throw new Error('Invalid date Only date between 1944 and 2043.'); } this.englishYear = year; this.englishMonth = month + 1; this.englishDate = date; //Setting nepali reference to 2000/1/1 with english date 1943/4/14 this.nepaliYear = 2000; this.nepaliMonth = 1; this.nepaliDate = 1; let difference = this.getEnglishDateDifference(1943, 4, 14); let index = 0; while (difference >= this.nepaliYearDays(index)) { this.nepaliYear++; difference = difference - this.nepaliYearDays(index); index++; } let i = 0; while (difference >= this.nepaliMonths[index][i]) { difference = difference - this.nepaliMonths[index][i]; this.nepaliMonth++; i++; } this.nepaliMonth--; this.nepaliDate = this.nepaliDate + difference; return { day: this.nepaliDate, month: this.nepaliMonth, year: this.nepaliYear, }; } toEnglishString(format) { if (typeof format === 'undefined') format = '-'; return (this.englishYear + format + this.englishMonth + format + this.englishDate); } getEnglishDateDifference(year, month, date) { let difference = this.countTotalEnglishDays(this.englishYear, this.englishMonth, this.englishDate) - this.countTotalEnglishDays(year, month, date); return difference < 0 ? -difference : difference; } countTotalEnglishDays(year, month, date) { let totalDays = year * 365 + date; for (let i = 0; i < month - 1; i++) totalDays = totalDays + this.englishMonths[i]; totalDays = totalDays + this.countleap(year, month); return totalDays; } countleap(year, month) { if (month <= 2) year--; return (Math.floor(year / 4) - Math.floor(year / 100) + Math.floor(year / 400)); } isEnglishRange(date, month, year) { if (year < 1944 || year > 2043) return false; if (month < 0 || month > 11) { throw new Error('Invalid Date'); } if (date < 1 || date > 31) { throw new Error('Invalid Date'); } return true; } isLeapYear(year) { if (year % 4 === 0) { return year % 100 === 0 ? year % 400 === 0 : true; } else return false; } nepToEngDate(date, month, year) { if (!this.isNepaliRange(date, month, year)) { throw new Error('Invalid date, Only date between 2000 and 2099.'); } this.nepaliYear = year; this.nepaliMonth = month + 1; this.nepaliDate = date; this.englishYear = 1944; this.englishMonth = 1; this.englishDate = 1; let difference = this.getNepaliDateDifference(2000, 9, 17); while (difference >= (this.isLeapYear(this.englishYear) ? 366 : 365)) { difference = difference - (this.isLeapYear(this.englishYear) ? 366 : 365); this.englishYear++; } let monthDays = this.isLeapYear(this.englishYear) ? this.englishLeapMonths : this.englishMonths; let i = 0; while (difference >= monthDays[i]) { this.englishMonth++; difference = difference - monthDays[i]; i++; } this.englishDate = this.englishDate + difference; return new Date(this.englishYear + '-' + this.englishMonth + '-' + this.englishDate); } toNepaliString(format) { if (typeof format === 'undefined') format = '-'; return (this.nepaliYear + format + this.nepaliMonth + format + this.nepaliDate); } getNepaliDateDifference(year, month, date) { const a = this.countTotalNepaliDays(this.nepaliYear, this.nepaliMonth, this.nepaliDate); const b = this.countTotalNepaliDays(year, month, date); let difference = a - b; return difference < 0 ? -difference : difference; } countTotalNepaliDays(year, month, date) { let total = 0; if (year < 2000) return 0; total = total + (date - 1); let yearIndex = year - 2000; for (let i = 0; i < month - 1; i++) total = total + this.nepaliMonths[yearIndex][i]; for (let i = 0; i < yearIndex; i++) total = total + this.nepaliYearDays(i); return total; } nepaliYearDays(index) { let total = 0; for (let i = 0; i < 12; i++) total += this.nepaliMonths[index][i]; return total; } isNepaliRange(date, month, year) { if (year < 2000 || year > 2099) return false; if (month < 0 || month > 11) { throw new Error('Invalid Date'); } if (date < 1 || date > this.nepaliMonths[year - 2000][month]) { throw new Error('Invalid Date'); } return true; } formatDate(date, format) { const subDates = date.split('/'); const regex = { year: /y{2,4}/i, month: /m{1,2}/i, day: /d{1,2}/i, }; format = format.replace(regex.year, subDates[0]); format = format.replace(regex.month, subDates[1]); format = format.replace(regex.day, subDates[2]); return format; } changeStructure(value) { value = value.split('T')[0]; let separatedCharacter; for (let i = 0; i < this.dateSeparatedCharacters.length; i++) { const character = this.dateSeparatedCharacters[i]; if (value.indexOf(character) !== -1) { separatedCharacter = character; break; } } if (!separatedCharacter) return; const splittedDate = value.split(separatedCharacter); return { year: Number(splittedDate[0]), month: Number(splittedDate[1]) - 1, day: Number(splittedDate[2]), }; } } NepaliDatepickerAngularPrivateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerAngularPrivateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); NepaliDatepickerAngularPrivateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerAngularPrivateService, providedIn: 'root' }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerAngularPrivateService, decorators: [{ type: Injectable, args: [{ providedIn: 'root', }] }], ctorParameters: function () { return []; } }); class NepaliDatepickerService { constructor(_datePicketService) { this._datePicketService = _datePicketService; } /** * @param dateInAD string value of AD date only * @param format 'yyyy/mm/dd' | 'dd/mm/yyyy' | 'yyyy-mm-dd' | 'dd-mm-yyyy' value in which the dateInAD is formatted with * @returns string BS date with same as provided in format params */ ADToBS(dateInAD, format) { const formattedDate = this._datePicketService.changeStructure(dateInAD); if (!formattedDate) throw new Error('Invalid date value'); const BSDate = this._datePicketService.engToNepDate(formattedDate.day, formattedDate.month, formattedDate.year); return this.formatDate(BSDate, format); } /** * * @param dateInBS string vale of BS date only * @param format 'yyyy/mm/dd' | 'dd/mm/yyyy' | 'yyyy-mm-dd' | 'dd-mm-yyyy' value in which the dateInBS is formatted with * @returns string AD date with same as provided in format params */ BSToAD(dateInBS, format) { const formattedDate = this._datePicketService.changeStructure(dateInBS); if (!formattedDate) throw new Error('Invalid date value'); const ADDate = this._datePicketService.nepToEngDate(formattedDate.day, formattedDate.month, formattedDate.year); return this.formatDate({ day: ADDate.getDate(), month: ADDate.getMonth(), year: ADDate.getFullYear(), }, format); } formatDate(date, format) { const regex = { year: /y{2,4}/i, month: /m{1,2}/i, day: /d{1,2}/i, }; format = format.replace(regex.year, date.year.toString()); format = format.replace(regex.month, this.zeroPad(date.month + 1, 2)); format = format.replace(regex.day, this.zeroPad(date.day, 2)); return format; } zeroPad(num, places) { return String(num).padStart(places, '0'); } } NepaliDatepickerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerService, deps: [{ token: NepaliDatepickerAngularPrivateService }], target: i0.ɵɵFactoryTarget.Injectable }); NepaliDatepickerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerService, providedIn: 'root' }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerService, decorators: [{ type: Injectable, args: [{ providedIn: 'root', }] }], ctorParameters: function () { return [{ type: NepaliDatepickerAngularPrivateService }]; } }); const numberMapping = [ '०', '१', '२', '३', '४', '५', '६', '७', '८', '९', ]; const wordsMapping = { year: 'साल', month: 'महिना', }; const daysMapping = { en: { default: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], short: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'], }, ne: { default: ['आइत', 'सोम', 'मंगल्', 'बुध', 'बिही', 'शुक्र', 'शनि'], short: ['आ', 'सो', 'मं', 'बु', 'बि', 'शु', 'श'], }, }; const monthsMapping = { en: { default: [ 'Baishakh', 'Jestha', 'Asar', 'Shrawan', 'Bhadau', 'Aswin', 'Kartik', 'Mansir', 'Poush', 'Magh', 'Falgun', 'Chaitra', ], short: [ 'Bai', 'Jes', 'Asa', 'Shr', 'Bha', 'Ash', 'Kar', 'Man', 'Pou', 'Mag', 'Fal', 'Cha', ], }, ne: { default: [ 'बैशाख', 'जेठ', 'असार', 'श्रावण', 'भदौ', 'आश्विन', 'कार्तिक', 'मंसिर', 'पुष', 'माघ', 'फाल्गुन', 'चैत्र', ], short: [ 'बै', 'जे', 'अ', 'श्रा', 'भा', 'आ', 'का', 'मं', 'पौ', 'मा', 'फा', 'चै', ], }, }; const englishMonthMapping = { en: { default: [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December', ], short: [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec', ], }, ne: { default: [ 'जनवरी', 'फेब्रुअरी', 'मार्च', 'अप्रिल', 'मे', 'जुन', 'जुलाई', 'अगस्ट', 'सेप्टेम्बर', 'अक्टोबर', 'नोभेम्बर', 'डिसेम्बर', ], short: [ 'जनवरी', 'फेब्रुअरी', 'मार्च', 'अप्रिल', 'मे', 'जुन', 'जुलाई', 'अगस्ट', 'सेप्टेम्बर', 'अक्टोबर', 'नोभेम्बर', 'डिसेम्बर', ], }, }; const CalendarFormat = { ne: [ { label: 'बि.सं.', value: 'BS', }, { label: 'इ.सं.', value: 'AD', }, ], en: [ { label: 'BS', value: 'BS', }, { label: 'AD', value: 'AD', }, ], }; class ToNpPipe { transform(value, language = 'ne', type = 'number') { if (value) { if (language === 'ne') { switch (type) { case 'number': const split = value.toString().split(''); return split .map((n) => { if (n === ' ') { return ' '; } return numberMapping[+n] ? numberMapping[+n] : n; }) .join(''); case 'word': let wrd = value.toString().toLowerCase(); if (wrd === 'month') { return wordsMapping['month']; } else if (wrd === 'year') { return wordsMapping['year']; } else { return wrd; } default: } } else { return value; } } else { return ''; } } } ToNpPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ToNpPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); ToNpPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ToNpPipe, name: "toNp" }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ToNpPipe, decorators: [{ type: Pipe, args: [{ name: 'toNp', }] }] }); class NepaliDatepickerComponent { constructor(_nepaliDate, eRef, _datePipe, config) { this._nepaliDate = _nepaliDate; this.eRef = eRef; this._datePipe = _datePipe; this.placeholder = 'Enter date'; this.language = 'ne'; this.dateIn = 'BS'; this.isError = false; this.darkTheme = false; this.appendTime = false; this.dateFormat = 'yyyy/mm/dd'; this.monthDisplayType = 'default'; this.hasMultipleCalendarView = true; this.dateInAD = new EventEmitter(); this.dateInBS = new EventEmitter(); this.nepaliDateToday = { day: 0, month: 0, year: 0 }; this.englishDateToday = { day: 0, month: 0, year: 0 }; this.currentNepaliDate = { day: 0, month: 0, year: 0 }; this.englishCurrentDate = { day: 0, month: 0, year: 0 }; this.nepaliMaxDate = { day: 0, month: 0, year: 0 }; this.nepaliMinDate = { day: 0, month: 0, year: 0 }; this.englishMaxDate = { day: 0, month: 0, year: 0 }; this.englishMinDate = { day: 0, month: 0, year: 0 }; this.formattedDate = ''; this.years = []; this.daysMapping = daysMapping; this.monthsMapping = monthsMapping; this.isOpen = false; this.calendarType = CalendarFormat.ne; this.dayDisplayType = 'short'; this.calendarView = 'BS'; this.alwaysVisible = false; this.dateSeparatedCharacters = ['/', '-']; this.rootPrimaryColor = '#1d49e7'; this.dateFormatter = (selectedDate) => { const dd = selectedDate.day < 10 ? '0' + selectedDate.day : selectedDate.day; const mm = selectedDate.month < 9 ? '0' + (selectedDate.month + 1) : selectedDate.month + 1; return `${this.selectedDate.year}/${mm}/${dd}`; }; this.initialized = false; if (config && config.primaryColor) { this.rootPrimaryColor = config.primaryColor; } this.currentDate = new Date(); this.setEnglishCurrentDate(); this.setNepaliCurrentDate(); this.nepaliDateToday = _nepaliDate.engToNepDate(this.currentDate.getDate(), this.currentDate.getMonth(), this.currentDate.getFullYear()); this.englishDateToday = { day: this.currentDate.getDate(), month: this.currentDate.getMonth(), year: this.currentDate.getFullYear(), }; this.selectedMonthIndex = this.nepaliDateToday.month; this.selectedYear = this.nepaliDateToday.year; } clickout(event) { if (!this.eRef.nativeElement.contains(event.target)) { this.close(); } } ngOnInit() { this.setCurrentDate(); this.populateYears(); this.setCurrentMonthData(); } ngOnChanges(changes) { if (changes['date'] && this.date) { this.setInputDate(); } if (changes['maxDate'] && this.maxDate) { this.setMaxDate(); } if (changes['minDate'] && this.minDate) { this.setMinDate(); } if (changes['language'] && this.language) { this.calendarType = CalendarFormat[this.language]; } if (changes['primaryColor'] && this.primaryColor) { this.rootPrimaryColor = this.primaryColor; this.setDatepickerColor(); } } ngAfterViewInit() { this.setDatepickerColor(); } setDatepickerColor() { if (this.nepaliDatePicker) { this.nepaliDatePicker.nativeElement.style.setProperty('--ne-datepicker-primary-color', this.rootPrimaryColor); } } setMaxDate() { this.setNepaliMaxDate(); this.setEnglishMaxDate(); } setMinDate() { this.setNepaliMinDate(); this.setEnglishMinDate(); } setInputDate() { if (this.dateIn === 'BS') { this.setCurrentNepaliDate(this.date); } else if (this.dateIn === 'AD') { const engDate = new Date(this.date); const nepaliDate = this._nepaliDate.engToNepDate(engDate.getDate(), engDate.getMonth(), engDate.getFullYear()); this.setCurrentNepaliDate(`${nepaliDate.year}/${nepaliDate.month + 1}/${nepaliDate.day}`); } if (this.calendarView === 'BS') { this.selectedMonthIndex = this.selectedDate.month; this.selectedYear = this.selectedDate.year; } else { this.selectedMonthIndex = new Date(this.date).getMonth(); this.selectedYear = new Date(this.date).getFullYear(); } } setCurrentNepaliDate(date) { const fd = this.changeStructure(date); if (!fd) return; this.selectedDate = fd; this.currentNepaliDate = fd; this.formatValue(); this.currentDate = this._nepaliDate.nepToEngDate(this.selectedDate.day, this.selectedDate.month, this.selectedDate.year); this.englishSelectedDate = { day: this.currentDate.getDate(), month: this.currentDate.getMonth(), year: this.currentDate.getFullYear(), }; this.setEnglishCurrentDate(); this.setCurrentMonthData(); } setNepaliMaxDate() { const maximumDate = new Date(this.maxDate); this.nepaliMaxDate = this._nepaliDate.engToNepDate(maximumDate.getDate(), maximumDate.getMonth(), maximumDate.getFullYear()); } setNepaliMinDate() { const minimumDate = new Date(this.minDate); this.nepaliMinDate = this._nepaliDate.engToNepDate(minimumDate.getDate(), minimumDate.getMonth(), minimumDate.getFullYear()); } setEnglishMinDate() { const minimumDate = new Date(this.minDate); this.englishMinDate = { day: minimumDate.getDate(), month: minimumDate.getMonth(), year: minimumDate.getFullYear(), }; } setEnglishMaxDate() { const maximumDate = new Date(this.maxDate); this.englishMaxDate = { day: maximumDate.getDate(), month: maximumDate.getMonth(), year: maximumDate.getFullYear(), }; } populateYears() { this.years = []; if (this.calendarView === 'BS') { for (let i = 2001; i <= 2099; i++) { this.years.push(i); } } else { for (let i = 1945; i < 2043; i++) { this.years.push(i); } } } selectYear(e) { if (this.calendarView === 'BS') { this.currentNepaliDate.year = parseInt(e.target.value); this.currentDate = this._nepaliDate.nepToEngDate(this.currentNepaliDate.day, this.currentNepaliDate.month, this.currentNepaliDate.year); } else { this.englishCurrentDate.year = parseInt(e.target.value); this.currentDate = new Date(`${this.englishCurrentDate.year}/${this.englishCurrentDate.month + 1}/1`); } this.setEnglishCurrentDate(); this.setCurrentMonthData(); } selectMonth(e) { var _a, _b, _c, _d; let month = e.target.value; if (this.calendarView === 'BS') { this.currentNepaliDate.day = 1; let nep_month_index = (_b = (_a = this.monthsMapping[this.language][this.monthDisplayType]) === null || _a === void 0 ? void 0 : _a.indexOf(month)) !== null && _b !== void 0 ? _b : 0; this.currentNepaliDate.month = nep_month_index; this.currentDate = this._nepaliDate.nepToEngDate(this.currentNepaliDate.day, this.currentNepaliDate.month, this.currentNepaliDate.year); } else { this.englishCurrentDate.day = 1; const monthIndex = (_d = (_c = englishMonthMapping[this.language][this.monthDisplayType]) === null || _c === void 0 ? void 0 : _c.indexOf(month)) !== null && _d !== void 0 ? _d : 0; this.englishCurrentDate.month = monthIndex; this.currentDate = new Date(`${this.englishCurrentDate.year}/${this.englishCurrentDate.month + 1}/1`); } this.setEnglishCurrentDate(); this.setCurrentMonthData(); } resetCurrentMonthData() { this.currentMonthData = { 0: [], 1: [], 2: [], 3: [], 4: [], 5: [], 6: [], }; } formatValue() { if (this.selectedDate) { this.formattedDate = this.dateFormatter(this.selectedDate); } } changeStructure(value) { let separatedCharacter; for (let i = 0; i < this.dateSeparatedCharacters.length; i++) { const character = this.dateSeparatedCharacters[i]; if (value.indexOf(character) !== -1) { separatedCharacter = character; break; } } if (!separatedCharacter) return; const splittedDate = value.split(separatedCharacter); return { year: Number(splittedDate[0]), month: Number(splittedDate[1]) - 1, day: Number(splittedDate[2]), }; } setCurrentDate() { if (!this.selectedDate) { this.currentNepaliDate = this._nepaliDate.engToNepDate(this.currentDate.getDate(), this.currentDate.getMonth(), this.currentDate.getFullYear()); this.setEnglishCurrentDate(); } else { const { day, month, year } = this.selectedDate; this.currentNepaliDate = { day, month, year }; this.currentDate = this._nepaliDate.nepToEngDate(this.selectedDate.day, this.selectedDate.month, this.selectedDate.year); this.setEnglishCurrentDate(); } } setCurrentMonthData() { this.resetCurrentMonthData(); if (this.calendarView === 'BS') { this.fillNepaliCalendar(); } else { this.fillEnglishCalendar(); } this.createEmptySpaces(); } fillNepaliCalendar() { const day = this._nepaliDate .nepToEngDate(this.currentNepaliDate.day, this.currentNepaliDate.month, this.currentNepaliDate.year) .getDay(); this.currentMonthData[day] = [this.currentNepaliDate.day]; this.setMonthDataBefore(day - 1, this.currentNepaliDate.day - 1); let currentMonthMaxValue = this._nepaliDate.nepaliMonths[this.currentNepaliDate.year - 2000][this.currentNepaliDate.month]; this.setMonthDataAfter(day + 1, this.currentNepaliDate.day + 1, currentMonthMaxValue); } fillEnglishCalendar() { const day = new Date(`${this.englishCurrentDate.year}/${this.englishCurrentDate.month + 1}/${this.englishCurrentDate.day || 1}`).getDay(); const currentEnglishDate = this.englishCurrentDate.day; this.currentMonthData[day] = [currentEnglishDate]; this.setMonthDataBefore(day - 1, currentEnglishDate - 1); const monthIndex = this.englishCurrentDate.month; const currentMonthMaxValue = this._nepaliDate.isLeapYear(this.englishCurrentDate.year) ? englishLeapMonths[monthIndex] : englishMonths[monthIndex]; this.setMonthDataAfter(day + 1, currentEnglishDate + 1, currentMonthMaxValue); } setMonthDataBefore(day, date) { if (date >= 1) { if (day < 0) { day = 6; } this.currentMonthData[day] = [date, ...this.currentMonthData[day]]; this.setMonthDataBefore(--day, --date); } } setMonthDataAfter(day, date, currentMonthMaxValue) { if (date <= currentMonthMaxValue) { if (day > 6) { day = 0; } this.currentMonthData[day] = [...this.currentMonthData[day], date]; this.setMonthDataAfter(++day, ++date, currentMonthMaxValue); } } createEmptySpaces() { let dayIndex = 0; let value; Object.values(this.currentMonthData).map((item, index) => { value = item; if (value.includes(1)) { dayIndex = index; } return value.includes(1); }); if (dayIndex) { for (dayIndex; dayIndex > 0; dayIndex--) { const monthData = this.currentMonthData[dayIndex - 1]; this.currentMonthData[dayIndex - 1] = [null, ...monthData]; } } } selectDate(day) { if (this.calendarView == 'BS') { this.selectedDate = Object.assign(Object.assign({}, this.currentNepaliDate), { day }); const en = this._nepaliDate.nepToEngDate(this.selectedDate.day, this.selectedDate.month, this.selectedDate.year); this.englishSelectedDate = { day: en.getDate(), month: en.getMonth(), year: en.getFullYear(), }; this.selectedMonthIndex = this.currentNepaliDate.month; this.selectedYear = this.currentNepaliDate.year; } else { this.englishSelectedDate = Object.assign(Object.assign({}, this.englishCurrentDate), { day }); this.selectedDate = this._nepaliDate.engToNepDate(this.englishSelectedDate.day, this.englishSelectedDate.month, this.englishSelectedDate.year); this.selectedMonthIndex = this.currentDate.getMonth(); this.selectedYear = this.currentDate.getFullYear(); } this.formatValue(); this.emitDateInAD(); this.emitDateInBS(); this.close(); } prevMonth() { if (this.calendarView === 'BS') { this.currentNepaliDate.day = 1; if (this.currentNepaliDate.month <= 0) { if (this.currentNepaliDate.year > 2001) { this.currentNepaliDate.month = 11; this.currentNepaliDate.year--; } } else { this.currentNepaliDate.month--; } this.currentDate = this._nepaliDate.nepToEngDate(this.currentNepaliDate.day, this.currentNepaliDate.month, this.currentNepaliDate.year); this.setEnglishCurrentDate(); } else { this.englishCurrentDate.day = 1; if (this.englishCurrentDate.month <= 0) { if (this.englishCurrentDate.year > 1944) { this.englishCurrentDate.month = 11; this.englishCurrentDate.year--; } } else { this.englishCurrentDate.month--; } const newDate = { day: this.englishCurrentDate.day, month: this.englishCurrentDate.month, year: this.englishCurrentDate.year, }; this.currentDate = new Date(`${newDate.year}/${newDate.month + 1}/${newDate.day}`); this.setNepaliCurrentDate(); } if (this.calendarView === 'BS') { this.selectedMonthIndex = this.currentNepaliDate.month; this.selectedYear = this.currentNepaliDate.year; } else { this.selectedMonthIndex = this.currentDate.getMonth(); this.selectedYear = this.currentDate.getFullYear(); } this.setCurrentMonthData(); } nextMonth() { if (this.calendarView === 'BS') { this.currentNepaliDate.day = 1; if (this.currentNepaliDate.month >= 11) { if (this.currentNepaliDate.year < 2099) { this.currentNepaliDate.month = 0; this.currentNepaliDate.year++; } } else { this.currentNepaliDate.month++; } this.currentDate = this._nepaliDate.nepToEngDate(this.currentNepaliDate.day, this.currentNepaliDate.month, this.currentNepaliDate.year); this.setEnglishCurrentDate(); console.log(this.currentNepaliDate, this.daysMapping, "CURRENT DATE"); } else { this.englishCurrentDate.day = 1; if (this.englishCurrentDate.month >= 11) { if (this.englishCurrentDate.year < 2044) { this.englishCurrentDate.month = 0; this.englishCurrentDate.year++; } } else { this.englishCurrentDate.month++; } const newDate = { day: this.englishCurrentDate.day, month: this.englishCurrentDate.month, year: this.englishCurrentDate.year, }; this.currentDate = new Date(`${newDate.year}/${newDate.month + 1}/${newDate.day}`); this.setNepaliCurrentDate(); } if (this.calendarView === 'BS') { this.selectedMonthIndex = this.currentNepaliDate.month; this.selectedYear = this.currentNepaliDate.year; } else { this.selectedMonthIndex = this.currentDate.getMonth(); this.selectedYear = this.currentDate.getFullYear(); } this.setCurrentMonthData(); } toggleOpen() { if (!this.alwaysVisible) { this.isOpen = !this.isOpen; } } open() { this.isOpen = true; this.setCurrentDate(); if (this.calendarView === 'BS') { this.currentNepaliDate.day = 1; this.selectedMonthIndex = this.currentNepaliDate.month; this.selectedYear = this.currentNepaliDate.year; } else { this.englishCurrentDate.day = 1; this.selectedMonthIndex = this.currentDate.getMonth(); this.selectedYear = this.currentDate.getFullYear(); } this.setCurrentMonthData(); } close() { this.isOpen = false; } emitDateInAD() { const dateInAD = this._nepaliDate.nepToEngDate(this.selectedDate.day, this.selectedDate.month, this.selectedDate.year); const defaultFormatDate = this._datePipe.transform(dateInAD, "YYYY/MM/dd'T'hh:mm:ss'Z'zzzz"); this.selectedTimeWithTimezone = defaultFormatDate === null || defaultFormatDate === void 0 ? void 0 : defaultFormatDate.substring(defaultFormatDate.indexOf('T')); const dateAD = defaultFormatDate === null || defaultFormatDate === void 0 ? void 0 : defaultFormatDate.split('T')[0]; if (!dateAD) return; const formattedDate = this._nepaliDate.formatDate(dateAD, this.dateFormat); const dateToReturn = this.setDateWithTime(formattedDate); this.dateInAD.emit(dateToReturn); } emitDateInBS() { const formattedDate = this._nepaliDate.formatDate(this.formattedDate, this.dateFormat); const dateToReturn = this.setDateWithTime(formattedDate); this.dateInBS.emit(dateToReturn); } setDateWithTime(date) { if (!this.appendTime) { return date; } return `${date}${this.selectedTimeWithTimezone}`; } selectCalendarView(data) { const type = data.target.value; this.calendarView = type; this.populateYears(); this.monthsMapping = this.calendarView === 'BS' ? monthsMapping : englishMonthMapping; if (this.calendarView === 'BS') { this.selectedMonthIndex = this.selectedDate ? this.selectedDate.month : this.currentNepaliDate.month; this.selectedYear = this.selectedDate ? this.selectedDate.year : this.currentNepaliDate.year; this.currentNepaliDate = { year: this.selectedYear, month: this.selectedMonthIndex, day: 1, }; } else { this.selectedMonthIndex = this.englishSelectedDate ? this.englishSelectedDate.month : this.englishCurrentDate.month; this.selectedYear = this.englishSelectedDate ? this.englishSelectedDate.year : this.englishCurrentDate.year; this.englishCurrentDate = { year: this.selectedYear, month: this.selectedMonthIndex, day: 1, }; } this.setCurrentMonthData(); } setEnglishCurrentDate() { this.englishCurrentDate = { day: this.currentDate.getDate(), month: this.currentDate.getMonth(), year: this.currentDate.getFullYear(), }; } setNepaliCurrentDate() { this.currentNepaliDate = this._nepaliDate.engToNepDate(this.currentDate.getDate(), this.currentDate.getMonth(), this.currentDate.getFullYear()); } } NepaliDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: NepaliDatepickerComponent, deps: [{ token: NepaliDatepickerAngularPrivateService }, { token: i0.ElementRef }, { token: i2.DatePipe }, { token: 'config', optional: true }], target: i0.ɵɵFactoryTarget.Component }); NepaliDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: NepaliDatepickerComponent, selector: "ne-datepicker", inputs: { primaryColor: "primaryColor", placeholder: "placeholder", language: "language", dateIn: "dateIn", isError: "isError", darkTheme: "darkTheme", date: "date", appendTime: "appendTime", maxDate: "maxDate", minDate: "minDate", dateFormat: "dateFormat", monthDisplayType: "monthDisplayType", hasMultipleCalendarView: "hasMultipleCalendarView" }, outputs: { dateInAD: "dateInAD", dateInBS: "dateInBS" }, host: { listeners: { "document:click": "clickout($event)" } }, viewQueries: [{ propertyName: "nepaliDatePicker", first: true, predicate: ["nepaliDatePicker"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n #nepaliDatePicker\r\n class=\"nepali-date-picker\"\r\n [ngClass]=\"{ dark: darkTheme }\"\r\n>\r\n <input\r\n class=\"np_datepicker_input\"\r\n [ngClass]=\"{\r\n 'np_datepicker_input--error': isError,\r\n 'np_datepicker_input--active': isOpen\r\n }\"\r\n type=\"text\"\r\n [value]=\"formattedDate\"\r\n (focus)=\"open()\"\r\n (keydown)=\"$event.preventDefault()\"\r\n aria-hidden=\"true\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n <a\r\n class=\"form-icon\"\r\n (click)=\"toggleOpen()\"\r\n [ngClass]=\"isOpen ? 'active' : ''\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n <path\r\n d=\"M152 64H296V24C296 10.75 306.7 0 320 0C333.3 0 344 10.75 344 24V64H384C419.3 64 448 92.65 448 128V448C448 483.3 419.3 512 384 512H64C28.65 512 0 483.3 0 448V128C0 92.65 28.65 64 64 64H104V24C104 10.75 114.7 0 128 0C141.3 0 152 10.75 152 24V64zM48 448C48 456.8 55.16 464 64 464H384C392.8 464 400 456.8 400 448V192H48V448z\"\r\n />\r\n </svg>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"datePicker\" *ngIf=\"isOpen\"></ng-container>\r\n</div>\r\n<!--.nepali-date-picker-->\r\n\r\n<ng-template #datePicker>\r\n <div class=\"datepicker__container\">\r\n <div class=\"datepicker__options-container\">\r\n <a class=\"prev-month\" (click)=\"prevMonth()\">\r\n <\r\n </a>\r\n <span class=\"datepicker__options-month-container\">\r\n <select\r\n class=\"datepicker__container__select\"\r\n (change)=\"selectMonth($event)\"\r\n >\r\n <option\r\n *ngFor=\"\r\n let month of monthsMapping[language][monthDisplayType];\r\n index as i\r\n \"\r\n [value]=\"month\"\r\n [selected]=\"i === selectedMonthIndex\"\r\n >\r\n {{ month }}\r\n </option>\r\n </select>\r\n </span>\r\n <span class=\"datepicker__options-year-container\">\r\n <select\r\n class=\"datepicker__container__select\"\r\n (change)=\"selectYear($event)\"\r\n >\r\n <option\r\n *ngFor=\"let year of years; index as i\"\r\n [value]=\"year\"\r\n [selected]=\"year === selectedYear\"\r\n >\r\n {{ year | toNp : language : \"number\" }}\r\n </option>\r\n </select>\r\n </span>\r\n <span\r\n class=\"datepicker__options-year-container\"\r\n *ngIf=\"hasMultipleCalendarView\"\r\n >\r\n <!-- <select\r\n class=\"datepicker__container__select\"\r\n (change)=\"selectCalendarView($event)\"\r\n >\r\n <option\r\n *ngFor=\"let type of calendarType\"\r\n [value]=\"type.value\"\r\n [selected]=\"type.value === calendarView\"\r\n >\r\n {{ type.label }}\r\n </option>\r\n </select> -->\r\n </span>\r\n\r\n <a class=\"next-month\" (click)=\"nextMonth()\">\r\n >\r\n </a>\r\n </div>\r\n <div class=\"datepicker__days-container\">\r\n <div\r\n class=\"datepicker__days\"\r\n *ngFor=\"let day of daysMapping[language][dayDisplayType]; index as i\"\r\n >\r\n <div class=\"datepicker__weekday\">{{ day }}</div>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"dateView\"\r\n ></ng-container>\r\n\r\n <ng-template #dateView>\r\n <div\r\n class=\"datepicker__date-container\"\r\n *ngFor=\"let date of currentMonthData[i]\"\r\n >\r\n <pre>\r\n {{i | json}}\r\n </pre>\r\n <pre>{{date | json}}</pre>\r\n <pre>{{currentMonthData[i]}}</pre>\r\n \r\n <!-- <div *ngIf=\"!maxDate && !minDate; else viewWithDisabledDate\">\r\n <div\r\n *ngIf=\"date\"\r\n class=\"datepicker__date\"\r\n [class.datepicker__date--active]=\"\r\n selectedDate &&\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 cur